Click on a TreeView item to select a non-working

Question

I have a tree with a hierarchical data template

<HierarchicalDataTemplate DataType="{x:Type local:TreeItem}" ItemsSource="{Binding Path=Children}" > <TreeViewItem Focusable="True" ToolTip="{Binding ToolTipText}" > <TreeViewItem.Header> <StackPanel Orientation="Horizontal" Focusable="True" > <Image Width="16" Height="16" Margin="3,0"> <Image.Source> <Binding Path="IsLeaf" Converter="{StaticResource cnvIsBooleanToStringArrayItemConverter}"> <Binding.ConverterParameter> <x:Array Type="sys:String"> <sys:String>..\Images\document_plain.png</sys:String> <sys:String>..\Images\folder.png</sys:String> </x:Array> </Binding.ConverterParameter> </Binding> </Image.Source> </Image> <TextBlock MaxWidth="300" Text="{Binding Desc}" Focusable="True" /> </StackPanel> </TreeViewItem.Header> </TreeViewItem> </HierarchicalDataTemplate> 

I want to select an element by clicking on a TextBlock containing "Desc", but the only way to select an element is to click on the left edge of the text (image area)

Any clues what is missing?

Relations Klaus

Answer 1

As HB says, you should not put a TreeViewItem inside your hierarchical data template, since WPF will automatically create it to pack your content.

If you want to bind to a ToolTip, you can do this inside an ItemContainerStyle that will apply to all of your treeview items in the TreeView.

 <TreeView .... your parameters > <TreeView.ItemContainerStyle> <Style TargetType="{x:Type TreeViewItem}"> <Setter Property="ToolTip" Value="{Binding ToolTipText}"/> </Style> </TreeView.ItemContainerStyle> </TreeView> 

Hope this helps.

Although I have not tested it, I think your hierarchical data template should look like this:

  <HierarchicalDataTemplate DataType="{x:Type local:TreeItem}" ItemsSource="{Binding Path=Children}" > <StackPanel Orientation="Horizontal"> <Image Width="16" Height="16" Margin="3,0"> <Image.Source> <Binding Path="IsLeaf" Converter="{StaticResource cnvIsBooleanToStringArrayItemConverter}"> <Binding.ConverterParameter> <x:Array Type="sys:String"> <sys:String>..\Images\document_plain.png</sys:String> <sys:String>..\Images\folder.png</sys:String> </x:Array> </Binding.ConverterParameter> </Binding> </Image.Source> </Image> <TextBlock MaxWidth="300" Text="{Binding Desc}"/> </StackPanel> </HierarchicalDataTemplate> 

Answer 2

The data directory specifies the root directory of TreeViewItem , but TreeView will automatically create a TreeViewItem around your template, and the TreeViewItem in TreeViewItem is confused by the selection mechanism.

Do something like this:

  <HierarchicalDataTemplate DataType="{x:Type local:TreeItem}" ItemsSource="{Binding Path=Children}"> <HierarchicalDataTemplate.ItemContainerStyle> <Style TargetType="TreeViewItem"> <Setter Property="ToolTip" Value="{Binding ToolTipText}"/> <Setter Property="Focusable" Value="True"/> <Setter Property="Header"> <Setter.Value> ... </Setter.Value> </Setter> </Style> </HierarchicalDataTemplate.ItemContainerStyle> </HierarchicalDataTemplate> 

Edit: After some testing, it turns out that the mess with the container is quite troublesome, I didn’t get its tooltip, if you didn’t find a way to do this, I recommend that you stick to the HierarchicalDataTemplate.VisualTree setting (the default content is HierarchicalDataTemplate), which will be placed in the header automatically generated TreeViewItem.

Answer 3

You may need to set Background = "Transparent" to the StackPanel and / or remove the Focusable setting in the TextBlock.