Question

我无法为treeviewitems动态添加图片。

TreeViewItem tvi = new TreeViewItem { Header = ni.name, Uid = itemName, Background = color};

这是我的xaml

<TreeView.Resources>
    <Style TargetType="{x:Type TreeViewItem}">
        <Setter Property="HeaderTemplate">
            <Setter.Value>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Image Margin="2" Source="/Citi.Shade;component/Control/Images/folder1.jpg"/>
                                                <TextBlock Margin="2" Text="{Binding}"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TreeView.Resources>

我看到图像已添加到所有项目中，但如果我想根据项目是文件夹还是文件动态决定2个图像，我不确定如何操作。我不知道如何将它添加到我正在创建的TreeViewItem中的标头。在添加treeviewitem之前以编程方式为头文件创建堆栈面板模板，因为我发布的这个问题没有帮助。 Treeviewitem with images programmatically

Answer 1

通过绑定，这应该很容易。下面我分享了我创建的示例代码。

XAML：

<TreeView Name="treeView">
    <TreeView.ItemContainerStyle>
        <Style TargetType="{x:Type TreeViewItem}">
            <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
            <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
            <Setter Property="FontWeight" Value="Normal" />
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="FontWeight" Value="Bold" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </TreeView.ItemContainerStyle>
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding SubElements}">
            <StackPanel Orientation="Horizontal">
                <Image Margin="2" Source="{Binding ImageLocation}" Height="30" Width="30"/>
                <TextBlock Margin="2" Text="{Binding HeaderText}" Background="{Binding BackgroundColor}"></TextBlock>
            </StackPanel>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>

代码隐藏：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApplication1
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            List<TreeViewElement> elements = new List<TreeViewElement>();
            TreeViewElement mainElement = new TreeViewElement() { ImageLocation = "Images/1.png", HeaderText = "MainElement1" };
            mainElement.SubElements = new List<TreeViewElement>();
            mainElement.SubElements.Add(new TreeViewElement() { ImageLocation = "Images/2.png", HeaderText = "SubElement1" });
            mainElement.SubElements.Add(new TreeViewElement() { ImageLocation = "Images/2.png", HeaderText = "SubElement2", BackgroundColor = "Blue" });
            elements.Add(mainElement);
            TreeViewElement mainElement2 = new TreeViewElement() {  HeaderText = "MainElement2" };
            elements.Add(mainElement2);
            this.treeView.ItemsSource = elements;
        }
    }

    public class TreeViewElement
    {
        public string ImageLocation { get; set; }
        public string HeaderText { get; set; }
        public string BackgroundColor { get; set; }
        public List<TreeViewElement> SubElements { get; set; }
    }
}

以下文章可帮助您了解绑定和TreeView控件。

http://www.codeproject.com/Articles/26288/Simplifying-the-WPF-TreeView-by-Using-the-ViewMode

http://www.codeproject.com/Articles/390514/Playing-with-a-MVVM-Tabbed-TreeView-for-a-File-Exp

Answer 2

我想出来了。我必须将TreeViewItem创建更改为：

TreeViewItem tvi = new TreeViewItem
{
    Header = new TreeItem() {
                                iName = ni.name,
                                iImage = img
                            },
            Uid = itemName,
            Background = color
};

TreeItem是一个自定义类，我创建的类似于：

public class TreeItem
{
    public string iName
    {
        get; 
        set;
    }

    public string iImage
    {
        get;
        set;
    }
  }

相应的XAML绑定将是：

<TreeView.Resources>
    <Style TargetType="{x:Type TreeViewItem}">
        <Setter Property="HeaderTemplate">
            <Setter.Value>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Image Source="{Binding Path=iImage}"/>
                        <TextBlock VerticalAlignment="Center" Text="{Binding Path=iName}"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TreeView.Resources>

动态更改treeviewitems的图像

2 个答案: