mahapps.metrohamburger-menu

How to have dynamic content or use a ContentTemplateSelector with Mahapps Hamburger Menu?


I am doing some testing of the Mahapps HamburgerMenu. I want to dynamically add items to the HambugerMenu and in turn add content. My Basic HambergerMenu is as follow.

<Controls:HamburgerMenu x:Name="HamburgerMenuControl"
          ItemsSource="{Binding HamburgerContentItems}"
          ItemTemplateSelector="{StaticResource HamburgerItemDataSelector}">

The HamburgerContentItems is an ObservableCollection<ViewModelBase>

public class ViewModelBase
{
    public enum ViewTypes
    {
        Open,
        Search
    }

    public ViewTypes ViewType { get; set; }

    private string _Title = string.Empty;

    public string Title
    {
        get { return _Title; }
        set { _Title= value;}
    }
}

As expected in my DataTemplateSelector class I can override public override DataTemplate SelectTemplate(object item, DependencyObject container) and check the item's ViewType and apply my choosen datatemplate for the menuitems.

This is working fine please let me know if I need to show more code in this regard.

My question is how can I show my content or views related to these dynamic menus? If this were a TabControl then I would use the ContentTemplateSelector, however, when doing this for the HamburgerMenu the DataTemplateSelector for this public override DataTemplate SelectTemplate(object item, DependencyObject container) item is always null. Looking at the source code, that looks to be right as there is no ContentTemplateSelector hooked up to the HamburgerMenu (I think). There appears to be one on the TransitioningContentControl contained in the template here but I am unsure how to use this.

I would normally (as you can do in a Tabcontrol) pass a collection of ViewModels to the itemssource and then use the ContentTemplateSelector to decide which datatemplate to use. For example as below, when an item in the collection is of type OpenProjectsViewModel then an OpenProjectsView is created and shown.

<DataTemplate x:Key="OpenProjectsHamburgerContentDataTemplate" DataType="{x:Type VALViews:OpenProjectsViewModel}">
<Grid>
    <VALViews:OpenProjectsView/>
</Grid>
</DataTemplate>

How can I pass this information to the TransitioningContentControl built into the Hamburger control?


Solution

  • I found some HamburgerMenu examples

    The content is set via a converter.

                <mah:HamburgerMenu.Content>
                    <MultiBinding Converter="{StaticResource SelectedItemToContentConverter}">
                        <Binding FallbackValue="{x:Null}"
                                 Mode="OneWay"
                                 Path="SelectedItem"
                                 RelativeSource="{RelativeSource Self}" />
                        <Binding FallbackValue="{x:Null}"
                                 Mode="OneWay"
                                 Path="SelectedOptionsItem"
                                 RelativeSource="{RelativeSource Self}" />
                    </MultiBinding>
                </mah:HamburgerMenu.Content>