WPF TreeView - 根据枚举值应用样式

Question

我有一个 TreeView 绑定到一个包含 enum 值的 ObservableCollection：

public enum Categories
{
    CatA, CatB, CatC, CatD
}

public ObservableCollection<Categories> CategoriesList = new ObservableCollection<Categories>();

foreach (Categories cat in (Categories[])Enum.GetValues(typeof(Categories)))
{
    CategoriesList.Add(cat);
}

TreeView 绑定到 CategoriesList:

tvCat.ItemsSource = CategoriesList;

XAML 标记：

<TreeView x:Name="tvCat">
    <TreeView.ItemContainerStyle>
        <Style TargetType="{x:Type TreeViewItem}">
            <Style.Triggers>
                 <Trigger Property="IsSelected" Value="True">
                     <Setter Property="FontWeight" Value="Bold"/>
                 </Trigger>
            </Style.Triggers>
        </Style>
    </TreeView.ItemContainerStyle>
</TreeView>

我想弄清楚如何为每个枚举值将单独的样式应用到 TreeViewItem，例如CatA 的蓝色，CatB 的红色，CatC 等的图标

非常感谢您的帮助。

Answer 1

您可以使用 DataTriggers 来获得所需的输出。

<TreeView.ItemContainerStyle>
    <Style TargetType="{x:Type TreeViewItem}">
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="FontWeight" Value="Bold"/>
            </Trigger>
            <DataTrigger Binding="{Binding}" Value="CatA">
                <Setter Property="Foreground" Value="Blue" />
            </DataTrigger>
            <DataTrigger Binding="{Binding}" Value="CatB">
                <Setter Property="Foreground" Value="Red" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</TreeView.ItemContainerStyle>

编辑

上面的 XAML 是如果你只是想为你的物品换一种颜色。如果您还想拥有不同的内容（例如 CatC 的图标），那么您必须根据 DataTrigger.

设置 ControlTemplate

这是实现该目标的 XAML。

<TreeView.Resources>
    <ControlTemplate TargetType="TreeViewItem" x:Key="CatCTemplate">
        <Image Source="icon.jpeg" Height="64" Width="64" />
    </ControlTemplate>
</TreeView.Resources>
<TreeView.ItemContainerStyle>
    <Style TargetType="{x:Type TreeViewItem}">
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="FontWeight" Value="Bold"/>
            </Trigger>
            <DataTrigger Binding="{Binding}" Value="CatA">
                <Setter Property="Foreground" Value="Blue" />
            </DataTrigger>
            <DataTrigger Binding="{Binding}" Value="CatB">
                <Setter Property="Foreground" Value="Red" />
            </DataTrigger>
            <DataTrigger Binding="{Binding}" Value="CatC">
                <Setter Property="Template" Value="{StaticResource CatCTemplate}" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</TreeView.ItemContainerStyle>

WPF TreeView - 根据枚举值应用样式

WPF TreeView - Apply styling based on enum value

c#

wpf

treeview

enums