In my XAML I have a ContextMenu where the MenuItems are associated with commands:
<ToolBarTray Background="Black" Width="180" Height="25" VerticalAlignment="Top" HorizontalAlignment="Right" Grid.Column="1">
<ToolBar Background="Black">
<ToolBar.Clip>
<RectangleGeometry Rect="10,0,54,25" />
</ToolBar.Clip>
<ToggleButton Checked="DropdownButton_Checked" MouseRightButtonUp="DropdownButton_MouseRightButtonUp" Background="Black" Margin="-4,-6,4,0">
<ToggleButton.Content>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Layout" Foreground="White"/>
<Path Margin="4" Width="5" Fill="White" Stretch="Uniform" HorizontalAlignment="Right" VerticalAlignment="Center" Data="F1 M 301.14,-189.041L 311.57,-189.041L 306.355,-182.942L 301.14,-189.041 Z" />
</StackPanel>
</ToggleButton.Content>
<ToggleButton.ContextMenu>
<ContextMenu Closed="ContextMenu_Closed">
<MenuItem Header="1x1" Command="{Binding MenuItem1}"/>
<MenuItem Header="2x2" Command="{Binding MenuItem2}"/>
<MenuItem Header="3x3" Command="{Binding MenuItem3}"/>
<MenuItem Header="1+5" Command="{Binding MenuItem4}"/>
</ContextMenu>
</ToggleButton.ContextMenu>
</ToggleButton>
</ToolBar>
</ToolBarTray>
I use these commands to toggle the layout of another part of the markup, e.g. Layout1 looks like this:
<Grid Grid.Row="1" Opacity="{Binding Layout1, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
<Border BorderBrush="White" BorderThickness="1" />
</Grid>
For this I have the following code in the view model:
public int Layout1 { get; set; }
public IReactiveCommand MenuItem1 { get; }
public MainWindowViewModel()
{
MenuItem1 = ReactiveCommand.Create(OnMenuItem1);
}
internal void OnMenuItem1()
{
Layout1 = 100;
Layout2 = 0;
Layout3 = 0;
Layout4 = 0;
}
And the same for Layout2, Layout3, Layout4.
Now when running this with the debugger I see that when I select "1x1" from the menu, OnMenuItem1 is executed. But the layout is not displayed on the screen.