You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在TreeView的HierarchicalDataTemplate中通过IsSelected触发Border背景变红

实现TreeViewItem选中时更改内部Border背景色

要实现选中TreeViewItem时将其内部Border的背景改为红色,你需要在Border的Style中添加DataTrigger,通过RelativeSource绑定到父级TreeViewItem的IsSelected属性,具体修改如下:

核心逻辑:由于Border嵌套在HierarchicalDataTemplate内部,无法直接访问TreeViewItem的属性,所以通过RelativeSource AncestorType=TreeViewItem向上查找父级TreeViewItem,监听它的IsSelected状态变化,触发背景色修改。

修改后的完整XAML代码:

<TreeView Margin="0,0,0,49.8" x:Name="lstOwnActions" ItemsSource="{Binding ActivityList}" TreeViewItem.Expanded="lstOwnActions_Expanded"
          HorizontalAlignment="Stretch" >
    <TreeView.Resources>
        <HierarchicalDataTemplate DataType="{x:Type local:ActivityList}" ItemsSource="{Binding SubCategory}">
            <Border CornerRadius="10" Width="Auto" HorizontalAlignment="Stretch" ToolTip="{Binding Name}" PreviewMouseDown="TextBlock_PreviewMouseDown" >
                <Border.Style>
                    <Style TargetType="Border">
                        <!-- 默认背景色 -->
                        <Setter Property="Background" Value="Black"/>
                        <!-- 选中状态触发器 -->
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=TreeViewItem}}" Value="True">
                                <Setter Property="Background" Value="Red"/>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Border.Style>
                <Label Content="{Binding Name}" Foreground="White" Width="Auto" VerticalAlignment="Center" HorizontalAlignment="Stretch" />
            </Border>
        </HierarchicalDataTemplate>
        <HierarchicalDataTemplate  DataType="{x:Type local:SubCategory}">
            <Border CornerRadius="10" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Top" ToolTip="{Binding SubCategoryName}" PreviewMouseDown="TextBlock_PreviewMouseDown">
                <Border.Style>
                    <Style TargetType="Border">
                        <Setter Property="Background" Value="Black"/>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=TreeViewItem}}" Value="True">
                                <Setter Property="Background" Value="Red"/>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Border.Style>
                <Label  Foreground="White" Content="{Binding SubCategoryName}" Width="Auto" VerticalAlignment="Top" />
            </Border>
        </HierarchicalDataTemplate>
    </TreeView.Resources>
</TreeView>

关键说明:

  • 移除了Border原本直接设置的Background="Black",将其移到Style的Setter中,确保触发器能覆盖默认值
  • 通过DataTrigger绑定父级TreeViewItem的IsSelected属性,当值为True时,将Border的Background改为红色

内容的提问来源于stack exchange,提问作者Mihir Choudhary

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.18 06:52:35