Databinding to multiple type of Objects for Menu

Question

I am developing a WPF project, following is the code for my data model of Menu

class NavigationMenu
    {
        public abstract class MenuBase
        {
            public MenuBase()
            {
            }

            public MenuBase(string title)
            {
                MenuTitle = title;
            }

            public Guid MenuId { get; set; }
            public string MenuTitle { get; set; }
            public string ImageResourceName { get; set; }
        }

        public class MenuItem : MenuBase
        {
            public MenuItem()
            {

            }

            public MenuItem(string title)
                : base(title)
            {

            }

            public string View { get; set; }
        }

        public class MenuCategory : MenuBase
        {
            public MenuCategory()
            {
                MenuItems = new ObservableCollection<MenuItem>();
            }

            public MenuCategory(string title)
                : base(title)
            {
                MenuItems = new ObservableCollection<MenuItem>();
            }

            public MenuCategory(string CategoryTitle, ObservableCollection<MenuItem> pMenuItems)
                : base(CategoryTitle)
            {
                this.MenuItems = pMenuItems;
            }

            public ObservableCollection<MenuItem> MenuItems { get; set; }
        }

        public class MainMenuItem : MenuBase
        {
            public MainMenuItem()
            {
                MenuCategories = new ObservableCollection<MenuCategory>();
            }

            public MainMenuItem(string title)
                : base(title)
            {
                MenuCategories = new ObservableCollection<MenuCategory>();
            }
            public ObservableCollection<MenuCategory> MenuCategories { get; set; }
        }
    }

The XAML for RadMenu is as follows,

<ui:RadMenu Name="radMenu1" ItemsSource="{Binding MenuBar}" Height="76">

        <ui:RadMenu.ItemTemplate>

            <HierarchicalDataTemplate ItemsSource="{Binding Path=MenuCategories}">
                <StackPanel Height="Auto">
                    <Image MaxWidth="32" MaxHeight="32" Source="{Binding Path=ImageResourceName}" />
                    <TextBlock HorizontalAlignment="Center"> 
                        <TextBlock.Text>
                            <MultiBinding  Converter="{StaticResource myConv}">
                                <Binding Path="MenuId"></Binding>
                                <Binding Path="MenuTitle"></Binding>
                             </MultiBinding>
                        </TextBlock.Text>
                   </TextBlock>
                </StackPanel>
            </HierarchicalDataTemplate>
        </ui:RadMenu.ItemTemplate>
      </ui:RadMenu>

The problem I am getting is, that MenuCategories are shown successfully, but the MenuItems inside MenuCategory are not shown. It is clear that I have not bind MenuItems but MenuCategories. But I am not sure how to bind MenuItems as well in the above DataTemplate? Any Idea?

score 0 · Answer 1 · answered Jul 16 '12 at 10:58

Bind your model classes to a datatemplate

    <HierarchicalDataTemplate DataType="{x:Type NavigationMenu.MenuCategory }" ItemsSource="{Binding Path=MenuItems }">
            <StackPanel Height="Auto">
                <Image MaxWidth="32" MaxHeight="32" Source="{Binding Path=ImageResourceName}" />
                <TextBlock HorizontalAlignment="Center"> 
                    <TextBlock.Text>
                        <MultiBinding  Converter="{StaticResource myConv}">
                            <Binding Path="MenuId"></Binding>
                            <Binding Path="MenuTitle"></Binding>
                         </MultiBinding>
                    </TextBlock.Text>
               </TextBlock>
            </StackPanel>
    </HierarchicalDataTemplate>


         <HierarchicalDataTemplate DataType="{x:Type NavigationMenu.MenuItem }">
            <StackPanel Height="Auto">
                //....
                <TextBlock HorizontalAlignment="Center" Text="{Binding View}"/> 
                //....
            </StackPanel>
    </HierarchicalDataTemplate>

Databinding to multiple type of Objects for Menu

1 Answers1