ContextMenu in MVVM

Question

I want to bind a contextmenu to a list of commands.

<Grid.ContextMenu> <ContextMenu ItemsSource="{Binding ItemContextCommands, Converter={StaticResource commandToStringConverter}}"> <ContextMenu.ItemTemplate > <DataTemplate DataType="MenuItem"> <MenuItem Command="{Binding}"></MenuItem> </DataTemplate> </ContextMenu.ItemTemplate> </ContextMenu> </Grid.ContextMenu>

The commandToStringConverter simply converts a list of commands to a list of strings calling the ToString() on each command in the list.

How can I achieve that the Command in each MenuItem is called?

You probabbly should think about using another yet converter that converts every single {Binding} to actual command call. — Tigran
– Tigran, Commented Mar 22, 2013 at 9:31

Dorado · Accepted Answer · 2020-01-16 17:51:07Z

I would use a small "view model" to hold the informations for such a command.

class ContextAction : INotifyPropertyChanged { public string Name; public ICommand Action; public Brush Icon; }

make a collection inside your view model which should get the context actions like

ObservableCollection<ContextAction> Actions {get;set;}

and simply bind this collection to your ContextMenu.

<Grid.ContextMenu> <ContextMenu ItemsSource="{Binding Actions}" />

The ItemTemplate for the contextmenu items can now access the name, the command and whatever else you might need. It might be useful to change the CommandParameter as well so that it will call the command with the actions owning element, not with the action itself.

Anyone have an idea how to handle a ContextMenu with separators and submenus? This solution appears to be only useful for a homogenous set of objects.
Submenues are just as easy. You just give the ContextMenu an ItemContainerStyle with a setter for ItemsSource and bind to a new property of type ObservableCollection<ContextAction> inside a ContextAction. For Separators see this solution.

blindmeis · Accepted Answer · 2013-03-22 09:48:37Z

i use something like this:

public class ContextMenuVM { public string Displayname {get;set;} public ICommand MyContextMenuCommand {get;set;} }

in your contextmenu datacontext:

public ObservableCollection<ContextMenuVM> MyCommandList {get;set;}

in your xaml

<ContextMenu ItemsSource="{Binding MyCommandList}"> <ContextMenu.ItemTemplate > <DataTemplate DataType="MenuItem"> <MenuItem Header="{Binding Displayname}" Command="{Binding MyContextMenuCommand}"></MenuItem> </DataTemplate> </ContextMenu.ItemTemplate> </ContextMenu>

its written without ide, so maybe some syntax errors in there

Ole K · Accepted Answer · 2016-04-21 08:46:32Z

An improved XAML version of @blindmils solution below:

<ContextMenu ItemsSource="{Binding MyCommandList}"> <ContextMenu.ItemContainerStyle> <Style TargetType="MenuItem"> <Setter Property="Header" Value="{Binding Displayname}" /> <Setter Property="Command" Value="{Binding MyContextMenuCommand }" /> </Style> </ContextMenu.ItemContainerStyle> </ContextMenu>

Collectives™ on Stack Overflow

ContextMenu in MVVM

3 Answers 3

2 Comments

1 Comment

Comments

Linked

Hot Network Questions