Ответ 1

Я нашел использование MVVM с MenuItems очень сложным. Остальная часть моего приложения использует DataTemplates для сопряжения View с ViewModel, но это, похоже, не работает с меню из-за именно тех причин, которые вы описали. Вот как я в итоге решил это. Мой вид выглядит следующим образом:

<DockPanel>
<Menu DockPanel.Dock="Top" ItemsSource="{Binding Path=(local:MainViewModel.MainMenu)}">
    <Menu.ItemContainerStyle>
        <Style>
            <Setter Property="MenuItem.Header" Value="{Binding Path=(contracts:IMenuItem.Header)}"/>
            <Setter Property="MenuItem.ItemsSource" Value="{Binding Path=(contracts:IMenuItem.Items)}"/>
            <Setter Property="MenuItem.Icon" Value="{Binding Path=(contracts:IMenuItem.Icon)}"/>
            <Setter Property="MenuItem.IsCheckable" Value="{Binding Path=(contracts:IMenuItem.IsCheckable)}"/>
            <Setter Property="MenuItem.IsChecked" Value="{Binding Path=(contracts:IMenuItem.IsChecked)}"/>
            <Setter Property="MenuItem.Command" Value="{Binding}"/>
            <Setter Property="MenuItem.Visibility" Value="{Binding Path=(contracts:IMenuItem.Visible), 
                Converter={StaticResource BooleanToVisibilityConverter}}"/>
            <Setter Property="MenuItem.ToolTip" Value="{Binding Path=(contracts:IMenuItem.ToolTip)}"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding Path=(contracts:IMenuItem.IsSeparator)}" Value="true">
                    <Setter Property="MenuItem.Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type MenuItem}">
                                <Separator Style="{DynamicResource {x:Static MenuItem.SeparatorStyleKey}}"/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Menu.ItemContainerStyle>
</Menu>
</DockPanel>

Если вы заметили, я определил интерфейс IMenuItem, который является ViewModel для MenuItem. Вот код для этого:

public interface IMenuItem : ICommand
{
    string Header { get; }
    IEnumerable<IMenuItem> Items { get; }
    object Icon { get; }
    bool IsCheckable { get; }
    bool IsChecked { get; set; }
    bool Visible { get; }
    bool IsSeparator { get; }
    string ToolTip { get; }
}

Обратите внимание, что IMenuItem определяет IEnumerable Items, как вы получаете подменю. Кроме того, IsSeparator - это способ определить разделители в меню (еще один жесткий небольшой трюк). Вы можете увидеть в xaml, как он использует DataTrigger, чтобы изменить стиль на существующий стиль разделителя, если IsSeparator является истинным. Здесь, как MainViewModel определяет свойство MainMenu (с которым связано представление):

public IEnumerable<IMenuItem> MainMenu { get; set; }

Это, кажется, работает хорошо. Я предполагаю, что вы можете использовать ObservableCollection для MainMenu. Я на самом деле использую MEF для создания меню из частей, но после этого сами элементы статичны (хотя свойства каждого элемента меню нет). Я также использую класс AbstractMenuItem, который реализует IMenuItem и является вспомогательным классом для создания элементов меню в различных частях.

UPDATE:

Относительно проблемы с цветом, этот поток помогает?

Ответ 2

Не помещайте MenuItem в DataTemplate. DataTemplate определяет содержимое MenuItem. Вместо этого задайте посторонние свойства для MenuItem через ItemContainerStyle:

<Menu>
    <Menu.ItemContainerStyle>
        <Style TargetType="MenuItem">
            <Setter Property="Header" Value="{Binding Title}"/>
            ...
        </Style>
    </Menu.ItemContainerStyle>
    <MenuItem 
        Header="Options" ItemsSource="{Binding ManageMenuPageItemViewModels}"
              ItemTemplate="{StaticResource MainMenuTemplate}"/>
</Menu>

Кроме того, взгляните на HierarchicalDataTemplate s.

Ответ 3

Вот как я сделал свое меню. Возможно, это не совсем то, что вам нужно, но я думаю, что это довольно близко.

  <Style x:Key="SubmenuItemStyle" TargetType="MenuItem">
    <Setter Property="Header" Value="{Binding MenuName}"></Setter>
    <Setter Property="Command" Value="{Binding Path=MenuCommand}"/>
    <Setter Property="ItemsSource" Value="{Binding SubmenuItems}"></Setter>
  </Style>

  <DataTemplate DataType="{x:Type systemVM:TopMenuViewModel}" >
    <Menu>
      <MenuItem Header="{Binding MenuName}"         
                    ItemsSource="{Binding SubmenuItems}" 
                    ItemContainerStyle="{DynamicResource SubmenuItemStyle}" />
    </Menu>
  </DataTemplate>

    <Menu DockPanel.Dock="Top" ItemsSource="{Binding Menus}" />

TopMenuViewModel - это набор меню, который появится в строке меню. Каждый из них содержит имя MenuName, которое будет отображаться, и коллекцию под названием SubMenuItems, которую я установил как ItemsSource.

Я контролирую способ отображения SubMenuItems с помощью стиля SumMenuItemStyle. Каждый SubMenuItem имеет свое собственное свойство MenuName, свойство Command типа ICommand и, возможно, еще один набор SubMenuItems.

В результате я могу хранить всю информацию о моем меню в базе данных и динамически переключаться, какие меню отображаются во время выполнения. Вся область меню доступна и отображается правильно.

Надеюсь, что это поможет.

Ответ 4

Просто сделайте свой DataTemplate текстовым блоком (или панелью со стеклом со значком и TextBlock).