How to add different context menu for parent and child node?

Question

I was able to implement the TreeView successfully and bind the complex data as ItemSource. I need to show the two different context menu. One for Parent node and another one for child nodes. I tried below code, but it shows same context menu for all nodes.

<TreeViewAdv Name="treeView" ShowRootLines="False" ItemsSource="{Binding TreeItems}">
<StackPanel Orientation="Horizontal">
                        <StackPanel.ContextMenu>
                            <ContextMenu>
                                <MenuItem Header="Add"/>
                                <MenuItem Header="Run All"/>
                                <MenuItem Header="Stop"/>
                                <MenuItem Header="Collapse All"/>
                                <MenuItem Header="Expand All" />
                            </ContextMenu>
                        </StackPanel.ContextMenu>
                    </StackPanel>

//This contextmenu only shows for all nodes

<TreeViewAdv.ItemTemplate>
                        <HierarchicalDataTemplate ItemsSource="{Binding SubItems}">
                            <StackPanel Orientation="Horizontal">
                                <StackPanel.ContextMenu>
                                    <ContextMenu>
                                        <MenuItem Header="Record"/>
                                        <MenuItem Header="Run"/>
                                        <MenuItem Header="Delete" />
                                    </ContextMenu>
                                </StackPanel.ContextMenu>
                                <Rectangle Margin="0" Width="12" Height="12"/>
                                <TextBlock Margin="5 0" Text="{Binding Name}" VerticalAlignment="Center"/>
                            </StackPanel>
                        </HierarchicalDataTemplate>
                    </TreeViewAdv.ItemTemplate>
</TreeViewAdv>

Please let me know, how to show the different context menu for parent and child nodes alone?

Thanks

Congenital Optimist Congenital Optimist · Accepted Answer · 2018-01-03T18:28:34

If the root and leaf items are backed by different view model classes, you can include multiple HierarchicalDataTemplates selected by the DataType:

<TreeView>
<TreeView.Resources>
    <HierarchicalDataTemplate ItemsSource="{Binding SubItems}" DataType="{x:Type local:RootViewModel}">
        <StackPanel Orientation="Horizontal">
            <StackPanel.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Record"/>
                    <MenuItem Header="Run"/>
                    <MenuItem Header="Delete" />
                </ContextMenu>
            </StackPanel.ContextMenu>
            <Rectangle Margin="0" Width="12" Height="12"/>
            <TextBlock Margin="5 0" Text="{Binding Name}" VerticalAlignment="Center"/>
        </StackPanel>
    </HierarchicalDataTemplate>
    <HierarchicalDataTemplate ItemsSource="{Binding SubItems}" DataType="{x:Type local:ItemViewModel}">
        <StackPanel Orientation="Horizontal">
            <StackPanel.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Jump"/>
                    <MenuItem Header="Sing"/>
                    <MenuItem Header="Doodle" />
                </ContextMenu>
            </StackPanel.ContextMenu>
            <Rectangle Margin="0" Width="12" Height="12"/>
            <TextBlock Margin="5 0" Text="{Binding Name}" VerticalAlignment="Center"/>
        </StackPanel>
    </HierarchicalDataTemplate>
</TreeView.Resources>

The above example assumes these classes are RootViewModel and ItemViewModel.

How to add different context menu for parent and child node?

1 Answers