不同的 WPF Treeview 图标取决于节点的类型 [英] Different WPF Treeview icons depending on the type of node

问题描述

我需要向 WPF 树视图节点添加图像，我看过这个例子 如何在 WPF TreeView 中的节点旁边添加图标? 并且它工作正常，但所有节点都具有相同的图像.我想要所有树视图中没有任何子节点的节点要么没有图像，要么有不同的图像.

I need to add images to WPF treeview nodes, I've had a look at this example How do I add icons next to the nodes in a WPF TreeView? and it's working fine except ALL nodes have the same image.I would like all the nodes in the treeview which do not have any children to either have no image or have a different image.

这是我设置图像的 XAML:

Here is my XAML where I set the image:

   <HierarchicalDataTemplate x:Key="NodeTemplate">
        <StackPanel Orientation="Horizontal" Margin="2">
            <Image Source="test.png"  Width="16" Height="16" SnapsToDevicePixels="True"/>
        <TextBlock x:Name="tb"/>
        </StackPanel>
        <HierarchicalDataTemplate.ItemsSource>
            <Binding>
                <Binding.XPath>child::node()</Binding.XPath>
            </Binding>
        </HierarchicalDataTemplate.ItemsSource>
        <HierarchicalDataTemplate.Triggers>
            <DataTrigger Binding="{Binding Path=NodeType}" Value="Text">
                <Setter TargetName="tb" Property="Text" Value="{Binding Path=Value}"></Setter>
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=NodeType}" Value="Element">
                <Setter TargetName="tb" Property="Text" Value="{Binding Path=Name}"></Setter>
            </DataTrigger>
        </HierarchicalDataTemplate.Triggers>
    </HierarchicalDataTemplate>

下面是输出的屏幕截图

有人可以建议我如何实现这一点，可能的解决方案可以是更改 XAML 或通过 C# 以编程方式.

Could someone please suggest how can I achieve this, the possible solution can be either changing the XAML or programatically via C#.

推荐答案

这是我用来解决几乎相同问题的一些代码.(我设计这个的数据是XML数据，所以XPath="@name"表示节点属性名的值，而Name表示元素类型.)

Here is some code I used to solve almost the same problem. (The data I designed this for is XML data, so XPath="@name" means the value of the attribute name of the node, while Name means element type.)

<Window x:Class="NodeExplorer2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:my="clr-namespace:NodeExplorer2">
    <Window.Resources>
        <my:PathConverter x:Key="iconConverter"/>

        <HierarchicalDataTemplate x:Key="XmlTreeTemplate">
            <HierarchicalDataTemplate.ItemsSource>
                <Binding XPath="child::node()" />
            </HierarchicalDataTemplate.ItemsSource>

            <StackPanel Orientation="Horizontal">
                <Image x:Name="icon" SnapsToDevicePixels="True" Stretch="None" Margin="0,0,3,0" />
                <TextBlock Text={Binding XPath="@name"/>
            </StackPanel>
            <HierarchicalDataTemplate.Triggers>
                <DataTrigger Binding="{Binding Path=NodeType}" Value="Element">
                    <Setter TargetName="icon" Property="Source">
                        <Setter.Value>
                            <Binding Path="Name" Converter="{StaticResource iconConverter}">
                                <Binding.FallbackValue>
                                    <ImageSource>
                                        Data/Icons/unknown.png
                                    </ImageSource>
                                </Binding.FallbackValue>
                            </Binding>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
            </HierarchicalDataTemplate.Triggers>
        </HierarchicalDataTemplate>

转换器:

public class PathConverter: IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        //Console.WriteLine("Value:" + value);
            return "Data/Icons/" + value + ".png";
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return "";
    }
}

这篇关于不同的 WPF Treeview 图标取决于节点的类型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！