0

我正在尝试为每个树视图项目设置一个带有圆形边框和背景的树视图控件。然而,虽然我也用线性渐变覆盖了 x:Static SystemColors.HighlightBrushKey。

但是,在执行此操作时,我注意到如果我为 treeview 项目设置背景,我的 highlightbrushkey 将不再被应用。你能告诉我如何实现这一目标吗?

下面是我的代码:

    <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">      

    <Page.Resources>  

        <LinearGradientBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFFFEF" Offset="0"/>
                <GradientStop Color="#FFF7D3" Offset="0.2580"/>
                <GradientStop Color="#FFEFB2" Offset="0.3870"/>
                <GradientStop Color="#FFEFB2" Offset="1"/>
            </LinearGradientBrush>

 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0" x:Key="TreeViewItemBackground">
            <GradientStop Color="#FFFAFFFF" Offset="0"/>
            <GradientStop Color="#FFFAFAFA" Offset="0.2580"/>
            <GradientStop Color="#FFF7F7F7" Offset="0.3870"/>
            <GradientStop Color="#FFF4F4F4" Offset="1"/>
        </LinearGradientBrush>

            <LinearGradientBrush x:Key="{x:Static SystemColors.ControlBrushKey}" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#FFF8F8F8" Offset="0"/>
                <GradientStop Color="#FFE5E5E5" Offset="1"/>
            </LinearGradientBrush>
            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black" />
            <SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Black" />        
            <TreeView x:Name="GroupView" ItemsSource="{Binding}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" MinWidth="150"  Margin="3">
                        <TreeView.Resources>
                            <HierarchicalDataTemplate DataType="{x:Type GridSplitterTextTrim:Group}" ItemsSource="{Binding Items}">                                       
                                        <Border BorderBrush="#FFEAEEE8"   BorderThickness="1" CornerRadius="3" Margin="-1" Background="{StaticResource TreeViewItemBackground}" >
                                            <StackPanel Orientation="Horizontal"  Background="Transparent" Margin="1">
                                                <TextBlock Text="{Binding Path=Name}" TextTrimming="WordEllipsis" Margin="3" MaxWidth="150"  Width="{Binding ActualWidth, ElementName=GroupView, Converter={StaticResource TreeViewWidthConverter}}" ToolTip="{Binding Name}" />
                                            </StackPanel>
                                        </Border>                                           
                                </HierarchicalDataTemplate>
                            <DataTemplate DataType="{x:Type GridSplitterTextTrim:Entry}" >
                                <Border BorderBrush="#C0C0C0" BorderThickness="1" CornerRadius="3" Margin="-1">
                                    <StackPanel Orientation="Horizontal" Background="Transparent" Margin="1">
                                        <TextBlock Text="{Binding Path=Name}" TextTrimming="WordEllipsis" Margin="3" MaxWidth="132"  Width="{Binding ActualWidth, ElementName=GroupView, Converter={StaticResource TreeViewWidthConverter}}" ToolTip="{Binding Name}" />
                                    </StackPanel>
                                </Border>
                            </DataTemplate>
                        </TreeView.Resources>
                        <TreeView.ItemContainerStyle>
                            <Style TargetType="{x:Type TreeViewItem}">
                                <Setter Property="BorderThickness" Value="1"/>
                                <Setter Property="Margin" Value="2"/>
                                <Style.Triggers>
                                    <Trigger Property="IsSelected" Value="True">
                                       <!-- <Setter Property="BorderBrush" Value="#adc6e5"/>-->                                       
                                        </Trigger>
                                    <MultiTrigger>
                                        <MultiTrigger.Conditions>
                                            <Condition Property="IsSelected" Value="True"/>
                                            <Condition Property="IsSelectionActive" Value="False"/>
                                        </MultiTrigger.Conditions>
                                        <Setter Property="BorderBrush" Value="LightGray"/>
                                    </MultiTrigger>
                                </Style.Triggers>
                                <Style.Resources>
                                    <Style TargetType="Border">
                                        <Setter Property="CornerRadius" Value="3"/>                                      
                                    </Style>
                                </Style.Resources>
                            </Style>
                        </TreeView.ItemContainerStyle>
                    </TreeView>
     </Page.Resources>  
    </Page>  

需要注意的几点:

  • 我使用转换器来设置文本块的宽度。这是为了实现文本修剪。

  • 为了这篇文章,我设置了一个没有背景颜色的数据模板,它在突出显示时效果很好,当我在第一个模板中设置背景时,它不会用突出显示画笔突出显示。

在此先感谢,-迈克

4

1 回答 1

1

你的DataTemplate's背景是在容器的选择之上绘制的。这就是它隐藏选择颜色的原因。您可以在选择项目时添加一个DataTriggerDataTemplate清除背景:

<DataTemplate>
    <Border x:Name="bg" Background="Red">
     ...
    </Border>
    <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType={x:Type TreeViewItem}}}" 
                     Value="True">
            <Setter TargetName="bg" Property="Background" Value="{x:Null}" />
        </DataTrigger>
    </DataTemplate.Triggers>
</DataTemplate>
于 2013-01-10T19:00:25.770 回答