Hello,
We need to create an MVVM solution for tree view control with context menu. The context menu has to be different for each node, based on the type of the node.
We have tried the following approach: binding the context menu items to given properties of the XamDataTree's ItemSource.
<ig:XamDataTree x:Name="customerGroupTreeView"
ActiveNodeChanged="customerGroupTreeViewProjects_ActiveNodeChanged"
ItemsSource="{Binding TreeViewCustomersGroup}"
BorderThickness="0">
<ig:XamDataTree.ContextMenu>
<ContextMenu Loaded="ContextMenu_Loaded">
<MenuItem Header="New"
IsEnabled="{Binding Data.IsNew}">MenuItem>
ContextMenu>
ig:XamDataTree.ContextMenu>
<ig:XamDataTree.EditingSettings>
<ig:TreeEditingSettings AllowDeletion="{Binding AllowDeletion}"
AllowEditing="{Binding AllowEditing}" />
ig:XamDataTree.EditingSettings>
<ig:XamDataTree.Resources>
<DataTemplate x:Key="NodeDataTemplate">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20">ColumnDefinition>
<ColumnDefinition>ColumnDefinition>
Grid.ColumnDefinitions>
<Image Grid.Column="0"
Height="16"
Width="16"
Source="{Binding Data.ImagePath}">
Image>
<TextBlock Text="{Binding Data.Name}"
Margin="5,0,0,0"
Grid.Column="1" />
Grid>
DataTemplate>
ig:XamDataTree.Resources>
<ig:XamDataTree.SelectionSettings>
<ig:TreeSelectionSettings NodeSelection="Single" />
ig:XamDataTree.SelectionSettings>
<ig:XamDataTree.GlobalNodeLayouts>
<ig:NodeLayout Key="MyNode"
TargetTypeName="Node"
ItemTemplate="{StaticResource NodeDataTemplate}">
ig:NodeLayout>
ig:XamDataTree.GlobalNodeLayouts>
ig:XamDataTree>
1. This binding isn't working. Can you please give an example of how the contextmenu would be bound to the Node data?
2. Also, we would like the Node which the user has right clicked on to be the selected node. How can we implement this?
Thanks!
DVSE Team
<ig:NodeLayout Key="SubSystemLayout" TargetTypeName="SubsystemVO"> <ig:NodeLayout.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Image Height="18" Width="18"> <Image.Source> <MultiBinding Converter="{StaticResource SubsystemImageConverterObj}" ConverterParameter="SS"> <Binding Path="Data.Icon"/> <Binding/> </MultiBinding> </Image.Source> </Image>
<TextBlock Text="{Binding Data.Name}" VerticalAlignment="Center" Margin="2"/> <StackPanel.ContextMenu> <ContextMenu> <MenuItem Header="Edit" cal:Message.Attach="BtnShowEdit" IsEnabled="{Binding DataContext.IsnotSubsystemOCU,Source={x:Reference btnShowEdit}}"> <MenuItem.Icon> <Image Source="../Images/edit.ico" Height="18" Width="18"/> </MenuItem.Icon> </MenuItem> </ContextMenu> </StackPanel.ContextMenu> </StackPanel> </DataTemplate> </ig:NodeLayout.ItemTemplate>
hi,
i tried this solution but after binding method from view model i got No target found for method BtnShowEdit error.
The sample code is as follows
Hello Arash,
I created a sample project where I set the Tag of the clicked Node to true and use this value in a Style's Trigger to set the Node's background, so the user can see which node is clicked.
I have the same problem and I want to set the selected or active property when the context menu opens. So that the user understands for which item the context menu is opened and it is very confusing.
I have the same problem and it just goes away after it opens. I tried to do it on the right-click, context menu visible change, context menu opened events but, all of them have the same behavior and after them the context menu closes.
How can I fix this issue and achieve this?
Hello Maria,
I have been looking into your post and I can say that this behavior is expected since the focus is moved to the Node after you set its IsActive Property to true.
Hope this helps you.