How to make leftdouble click work on entire treeviewitem area not just on text?

Question

I have a TreeView and i use an ItemTemplate for the Item Bindings similar to this:

<TreeView ItemsSource="{Binding TreeViewItemCollection}">
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Children}">
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <StackPanel.InputBindings>
                    <MouseBinding Gesture="LeftDoubleClick" Command="{Binding Command}" CommandParameter="{Binding CommandParameter}"></MouseBinding>
                </StackPanel.InputBindings>
                <TextBlock Text="{Binding Name}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></TextBlock>
            </StackPanel>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>

In the Ui it looks something like this :

Now if i doubleclick on the text the command triggers. When i doubleclick on the grey area nothing happens. How can i achieve this behaviour?

Apply the `InputBinding` in the `ControlTemplate` of the `TreeViewItem`: https://stackoverflow.com/questions/2660760/defining-inputbindings-within-a-style — mm8, Aug 22 '19 at 13:48
Where can i get the default control template? Is there something similar to style.basedon attribute? — Danil.T, Aug 22 '19 at 13:55
What style/template are you currently using? It doesn't look like the default one. — mm8, Aug 22 '19 at 13:56
Please state this in your question the next time. See my answer for a solution to your issue. — mm8, Aug 22 '19 at 14:24

score 1 · Answer 1 · answered Aug 22 '19 at 14:23

1

Define an ItemContainerStyle that stretches the content and removes the default padding, and then put the StackPanel in an element that adds the padding back:

<TreeView ItemsSource="{Binding TreeViewItemCollection}">
    <TreeView.ItemContainerStyle>
        <Style TargetType="TreeViewItem" BasedOn="{StaticResource MaterialDesignTreeViewItem}">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="VerticalContentAlignment" Value="Stretch" />
            <Setter Property="Padding" Value="0" />
        </Style>
    </TreeView.ItemContainerStyle>
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Children}">
            <Border Background="Transparent" Padding="8">
                <Border.InputBindings>
                    <MouseBinding Gesture="LeftDoubleClick" Command="{Binding Command}" CommandParameter="{Binding CommandParameter}" />
                </Border.InputBindings>
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                    <TextBlock Text="{Binding Name}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></TextBlock>
                </StackPanel>
            </Border>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>

answered Aug 22 '19 at 14:23

mm8

163,881
10
57
88

Unfortunately still doesn't work, but it looks much nicer. – Danil.T Aug 22 '19 at 14:36
What exactly doesn't work? Did you set the `Background` of the `Border`? In fact, you can just copy and paste my example. It works for me, i.e. the command is fired when I click outside the text. – mm8 Aug 22 '19 at 14:37
Okay thats weird, cause i pretty much copied your code. Working hours are unfortunately over for me. Ill take another look at it tomorrow. – Danil.T Aug 22 '19 at 14:43
No, it doesn't work unfortunately. Ive tested it in a seperate project as well. I want the grey area like in the picture to be clickable – Danil.T Aug 23 '19 at 06:15
I found a "solution" by setting property of width of treeviewitem to binding ActualWidth of ancestor treeviewitem and binding width of border to width of ancestor treeviewitem. problem with that is that it has a really really bad performance so i cant use that – Danil.T Aug 23 '19 at 06:27
I don't think I understand your issue because it works for me. Please provide a [repo](https://stackoverflow.com/help/minimal-reproducible-example) and tell me where I should click. – mm8 Aug 26 '19 at 11:14

How to make leftdouble click work on entire treeviewitem area not just on text?

1 Answers1