2

当(或应用程序)失去焦点时,如何更改Background选定对象的。在这种情况下,默认情况下选定的项目具有浅灰色背景。TreeViewItemTreeView

编辑:第一个答案后尝试:但是TargetName="Bd"找不到元素。

<TreeView>
        <TreeView.Resources>
            <Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TreeViewItem}">
                            <ControlTemplate.Triggers>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="True"/>
                                        <Condition Property="IsSelectionActive" Value="False"/>
                                    </MultiTrigger.Conditions>
                                    <Setter TargetName="Bd" Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
                                </MultiTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </TreeView.Resources>

        <TreeViewItem Header="Test1" IsExpanded="True">
            <TreeViewItem Header="Test2" />
            <TreeViewItem Header="Test3" />
            <TreeViewItem Header="Test4" />
            <TreeViewItem Header="Test5" />
        </TreeViewItem>
    </TreeView>
4

3 回答 3

5

您需要修改TreeViewItem. 特别是,您需要修改以下触发器:

<Style x:Key="{x:Type TreeViewItem}"
       TargetType="{x:Type TreeViewItem}">
    ...
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TreeViewItem}">
                ...
                <ControlTemplate.Triggers>
                    ...
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected"
                                       Value="true"/>
                            <Condition Property="IsSelectionActive"
                                       Value="false"/>
                        </MultiTrigger.Conditions>
                        <Setter TargetName="Bd"
                                Property="Background"
                                Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
                        <Setter Property="Foreground"
                                Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
                    </MultiTrigger>
                    ...
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    ...
</Style>

如您所见,{DynamicResource {x:Static SystemColors.ControlBrushKey}}如果项目已获得焦点且选择未激活(焦点位于其他位置),则触发器会将背景设置为。

更新:

Aero 主题的完整样式TreeViewItem如下所示:

<Style x:Key="{x:Type TreeViewItem}"
       TargetType="{x:Type TreeViewItem}">
    <Setter Property="Background"
            Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment"
            Value="{Binding Path=HorizontalContentAlignment,RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="VerticalContentAlignment"
            Value="{Binding Path=VerticalContentAlignment,RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="Padding"
            Value="1,0,0,0"/>
    <Setter Property="Foreground"
            Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    <Setter Property="FocusVisualStyle"
            Value="{StaticResource TreeViewItemFocusVisual}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TreeViewItem}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition MinWidth="19"
                                          Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <ToggleButton x:Name="Expander"
                                  Style="{StaticResource ExpandCollapseToggleStyle}"
                                  IsChecked="{Binding Path=IsExpanded,RelativeSource={RelativeSource TemplatedParent}}"
                                  ClickMode="Press"/>
                    <Border Name="Bd"
                            Grid.Column="1"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Padding="{TemplateBinding Padding}"
                            SnapsToDevicePixels="true">
                        <ContentPresenter x:Name="PART_Header"
                                          ContentSource="Header"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                    </Border>
                    <ItemsPresenter x:Name="ItemsHost"
                                    Grid.Row="1"
                                    Grid.Column="1"
                                    Grid.ColumnSpan="2"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsExpanded"
                             Value="false">
                        <Setter TargetName="ItemsHost"
                                Property="Visibility"
                                Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="HasItems"
                             Value="false">
                        <Setter TargetName="Expander"
                                Property="Visibility"
                                Value="Hidden"/>
                    </Trigger>
                    <Trigger Property="IsSelected"
                             Value="true">
                        <Setter TargetName="Bd"
                                Property="Background"
                                Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                        <Setter Property="Foreground"
                                Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected"
                                       Value="true"/>
                            <Condition Property="IsSelectionActive"
                                       Value="false"/>
                        </MultiTrigger.Conditions>
                        <Setter TargetName="Bd"
                                Property="Background"
                                Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
                        <Setter Property="Foreground"
                                Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
                    </MultiTrigger>
                    <Trigger Property="IsEnabled"
                             Value="false">
                        <Setter Property="Foreground"
                                Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
  <Style.Triggers>
    <Trigger Property="VirtualizingStackPanel.IsVirtualizing"
             Value="true">
      <Setter Property="ItemsPanel">
        <Setter.Value>
          <ItemsPanelTemplate>
            <VirtualizingStackPanel/>
          </ItemsPanelTemplate>
        </Setter.Value>
      </Setter>
    </Trigger>
  </Style.Triggers>
</Style>

为此,您还需要这个:

<PathGeometry x:Key="TreeArrow">
    <PathGeometry.Figures>
        <PathFigureCollection>
            <PathFigure IsFilled="True"
                        StartPoint="0 0"
                        IsClosed="True">
                <PathFigure.Segments>
                    <PathSegmentCollection>
                        <LineSegment Point="0 6"/>
                        <LineSegment Point="6 0"/>
                    </PathSegmentCollection>
                </PathFigure.Segments>
            </PathFigure>
        </PathFigureCollection>
    </PathGeometry.Figures>
</PathGeometry>

<Style x:Key="ExpandCollapseToggleStyle"
       TargetType="{x:Type ToggleButton}">
    <Setter Property="Focusable"
            Value="False"/>
    <Setter Property="Width"
            Value="16"/>
    <Setter Property="Height"
            Value="16"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ToggleButton}">
                <Border Width="16"
                        Height="16"
                        Background="Transparent"
                        Padding="5,5,5,5">
                    <Path x:Name="ExpandPath"
                          Fill="Transparent"
                          Stroke="#FF989898"
                          Data="{StaticResource TreeArrow}">
                        <Path.RenderTransform>
                            <RotateTransform Angle="135"
                                             CenterX="3"
                                             CenterY="3"/>
                        </Path.RenderTransform>
                    </Path>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver"
                             Value="True">
                        <Setter TargetName="ExpandPath"
                                Property="Stroke"
                                Value="#FF1BBBFA"/>
                        <Setter TargetName="ExpandPath"
                                Property="Fill"
                                Value="Transparent"/>
                    </Trigger>

                    <Trigger Property="IsChecked"
                             Value="True">
                        <Setter TargetName="ExpandPath"
                                Property="RenderTransform">
                            <Setter.Value>
                                <RotateTransform Angle="180"
                                                 CenterX="3"
                                                 CenterY="3"/>
                            </Setter.Value>
                        </Setter>
                        <Setter TargetName="ExpandPath"
                                Property="Fill"
                                Value="#FF595959"/>
                        <Setter TargetName="ExpandPath"
                                Property="Stroke"
                                Value="#FF262626"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

在所有这些中,您只需要修改您感兴趣的部分(如果选择不活动,则为背景颜色)并将这些样式放在主窗口中 App.xaml 的资源部分中。

于 2011-03-31T13:10:14.983 回答
3

对于您的特定情况,存在更简单的方法。就像在 ListBox 中一样,您可以将 ControlBrush 资源替换为 TreeViewItem 的使用样式:

<Style TargetType="TreeViewItem">
    <Style.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="{x:Static SystemColors.HighlightColor}" Opacity=".4" />
    </Style.Resources>
</Style>

您可以指定任何其他颜色。建议使用不透明度,因为如果您有多个 TreeView/ListBox,您可以确定哪个是焦点。但是,当然,编辑完整样式可以为您未来的自定义带来更大的灵活性。

渐变样本:

<Style TargetType="TreeViewItem">
    <Style.Resources>
        <LinearGradientBrush x:Key="{x:Static SystemColors.ControlBrushKey}" EndPoint='0 1'>
            <GradientStop Color='#AA00FF00' />
            <GradientStop Offset='1' Color='#AA007700' />
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" EndPoint='0 1'>
            <GradientStop Color='#AA00FF00' />
            <GradientStop Offset='1' Color='#AA007700' />
        </LinearGradientBrush>
    </Style.Resources>
</Style>
于 2012-02-15T05:24:21.750 回答
1

如果您不想覆盖默认的控制模板,您可以使用 textblock 为标题定义自己的模板,并将该模板中的样式应用于文本块本身(TreeViewItem 的默认控件模板中有一个小填充,所以您还应将其设置为零以实现像素完美)。

<TreeView.Resources>
    <Style TargetType="TreeViewItem">
        <Setter Property="Padding" Value="0"/>
        <Setter Property="HeaderTemplate">
            <Setter.Value>
                <DataTemplate>
                    <DataTemplate.Resources>
                        <Style TargetType="TextBlock">
                            <Style.Triggers>
                                <MultiDataTrigger>
                                    <MultiDataTrigger.Conditions>
                                        <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=TreeViewItem}}" Value="True"/>
                                        <Condition Binding="{Binding IsSelectionActive, RelativeSource={RelativeSource AncestorType=TreeViewItem}}" Value="False"/>
                                    </MultiDataTrigger.Conditions>
                                    <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" />
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}" />
                                </MultiDataTrigger>
                            </Style.Triggers>
                        </Style>
                    </DataTemplate.Resources>
                    <TextBlock Text="{Binding}"></TextBlock>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TreeView.Resources>

<TreeViewItem Header="Test1" IsExpanded="True">
    <TreeViewItem Header="Test2" />
    <TreeViewItem Header="Test3" />
    <TreeViewItem Header="Test4" />
    <TreeViewItem Header="Test5" />
</TreeViewItem>

于 2016-02-29T00:43:47.207 回答