如何在 WPF TreeView 中的节点旁边添加图标？答案

【问题标题】：How do I add icons next to the nodes in a WPF TreeView?如何在 WPF TreeView 中的节点旁边添加图标？
【发布时间】：2009-02-21 05:10:33
【问题描述】：

我有一个只有 1 级项目的 WPF TreeView。 TreeView 是绑定到字符串 ObservableCollection 的数据。如何确保相同的图标出现在 TreeView 中每个节点的左侧？

【问题讨论】：

标签： .net wpf treeview

【解决方案1】：

我认为最好的方法是在 TreeView 上设置一个样式，这将更改 TreeViewItems 的模板以获得您想要的图像。

模板可能需要是带有图像和标签控件的 StackPanel，您将图像绑定到图标，将标签文本绑定到 Observable 集合中的字符串。

我已经从Code Project article 复制了相关代码 sn-p，它更详细地介绍了这一点，但我认为您只需要以下代码（此代码位于 TreeView.Resources 元素中）。

<Style TargetType="{x:Type TreeViewItem}">
    <Setter Property="HeaderTemplate">
        <Setter.Value>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Name="img"
                           Width="20"
                           Height="20"
                           Stretch="Fill"
                           Source="image.png"/>
                    <TextBlock Text="{Binding}" Margin="5,0" />
                </StackPanel>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

【讨论】：

这是所有节点的一个图标。如何为不同级别的树节点关联不同的图标？
对源使用绑定值

【解决方案2】：

我认为可以帮助您了解 TreeView 的最佳文章之一是 http://www.codeproject.com/KB/WPF/TreeViewWithViewModel.aspx。一般来说，这描述了一组很好的模式，可以使 WPF/SL 中的许多场景变得更加容易。

【讨论】：

【解决方案3】：

我是这样使用James Osborn的StackPanel technique的...

XAML：

<TreeView Name="TreeViewThings" ItemsSource="{Binding}">
    <TreeView.Resources>
        <HierarchicalDataTemplate DataType="{x:Type local:Thing}"
                                  ItemsSource="{Binding Children}">
            <StackPanel Orientation="Horizontal" Margin="2">
                <Image Source="Thing.png"
                       Width="16"
                       Height="16"
                       SnapsToDevicePixels="True"/>
                <TextBlock Text="{Binding Path=Name}" Margin="5,0"/>
            </StackPanel>
        </HierarchicalDataTemplate>
    </TreeView.Resources>
</TreeView>

【讨论】：