WPF - 使用GridView选择ListViewItem的未聚焦颜色

时间:2010-11-18 17:28:44

标签: wpf templates xaml listview gridview

我正在尝试将所选ListViewItem上的默认浅灰色突出显示更改为ListView聚焦时显示的蓝色突出显示。我一直在努力在线调和不同的StackOverflow答案和来源,但我还没想出我还需要什么样的XAML。我有以下内容:

<ListView ItemContainerStyle="{StaticResource checkableListViewItem}"
          SelectionMode="Multiple"
          View="{StaticResource fieldValueGridView}"/>

引用的View资源是:

<GridView x:Key="fieldValueGridView" AllowsColumnReorder="False">
    <GridViewColumn Header="Field">
        <GridViewColumn.CellTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <TextBlock FontWeight="Bold" Text="{Binding Path=DisplayName}"/>
                    <TextBlock FontWeight="Bold" Text=": "/>
                </StackPanel>
            </DataTemplate>
        </GridViewColumn.CellTemplate>
    </GridViewColumn>
    <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Path=FieldValue}"/>
</GridView>

引用的ItemContainerStyle资源是:

<Style TargetType="ListViewItem" BasedOn="{StaticResource {x:Type ListViewItem}}"
       x:Key="checkableListViewItem">
    <Setter Property="IsSelected" Value="{Binding Path=IsChecked}" />
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
</Style>

如果重要的话,ListView的{​​{1}}属性确实会发生变化。我想以某种方式合并IsEnabled或类似内容,以突出显示未聚焦<SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="{x:Static SystemColors.HighlightColor}"/>中的所选ListViewItem

我有以下风格,但这似乎不会影响我ListView中的ListViewItem,我认为我使用的ListView可能是原因。当我尝试覆盖GridView属性时,Template属性被忽略,因此我的View未显示。

GridView

<Style TargetType="ListViewItem"> <Style.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="{x:Static SystemColors.HighlightColor}"/> </Style.Resources> </Style> 未聚焦时,如何以蓝色突出显示ListView中所选项目?

1 个答案:

答案 0 :(得分:8)

这适用于没有GridView的ListView

<Style TargetType="{x:Type ListViewItem}">
    <Style.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" 
                         Color="{DynamicResource {x:Static SystemColors.HighlightColorKey}}"/>
    </Style.Resources>
</Style>

<强>更新
1.使用GridView时无需重新模板

<LinearGradientBrush x:Key="ListItemSelectedFill" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFD9F4FF" Offset="0"/>
    <GradientStop Color="#FF9BDDFB" Offset="1"/>
</LinearGradientBrush>

<Style TargetType="ListViewItem" x:Key="checkableListViewItem">
    <Setter Property="IsSelected" Value="{Binding Path=IsChecked}" />
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Background" Value="{StaticResource ListItemSelectedFill}" />
            <Setter Property="BorderBrush" Value="#FF98DDFB" />
        </Trigger>
        <!-- Or if you want to choose another color for unfocused
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsSelected" Value="True" />
                <Condition Property="Selector.IsSelectionActive" Value="False" />
            </MultiTrigger.Conditions>
            <Setter Property="Background" Value="{StaticResource ListItemSelectedFill}" />
            <Setter Property="BorderBrush" Value="#FF98DDFB" />
        </MultiTrigger>
        -->
    </Style.Triggers>
</Style>

<强> 2。使用GridView时重新模板化ListViewItem。

<LinearGradientBrush x:Key="ListItemHoverFill" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFF1FBFF" Offset="0"/>
    <GradientStop Color="#FFD5F1FE" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ListItemSelectedFill" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFD9F4FF" Offset="0"/>
    <GradientStop Color="#FF9BDDFB" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ListItemSelectedInactiveFill" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFEEEDED" Offset="0"/>
    <GradientStop Color="#FFDDDDDD" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ListItemSelectedHoverFill" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFEAF9FF" Offset="0"/>
    <GradientStop Color="#FFC9EDFD" Offset="1"/>
</LinearGradientBrush>

<Style TargetType="ListViewItem" x:Key="checkableListViewItem">
    <Setter Property="IsSelected" Value="{Binding Path=IsChecked}" />
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ListViewItem}">
                <Border CornerRadius="2" SnapsToDevicePixels="True" 
                        BorderThickness="{TemplateBinding BorderThickness}"  
                        BorderBrush="{TemplateBinding BorderBrush}"  
                        Background="{TemplateBinding Background}">
                    <Border Name="InnerBorder" CornerRadius="1" BorderThickness="1">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition MaxHeight="11" />
                                <RowDefinition />
                            </Grid.RowDefinitions>

                            <Rectangle Name="UpperHighlight" Visibility="Collapsed" Fill="#75FFFFFF" />
                            <GridViewRowPresenter Grid.RowSpan="2"  
                                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"  
                                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                        </Grid>
                    </Border>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{StaticResource ListItemHoverFill}" />
                        <Setter Property="BorderBrush" Value="#FFCCF0FF" />
                        <Setter TargetName="UpperHighlight" Property="Visibility" Value="Visible" />
                    </Trigger>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Background" Value="{StaticResource ListItemSelectedFill}" />
                        <Setter Property="BorderBrush" Value="#FF98DDFB" />
                        <Setter TargetName="InnerBorder" Property="BorderBrush" Value="#80FFFFFF" />
                        <Setter TargetName="UpperHighlight" Property="Visibility" Value="Visible" />
                        <Setter TargetName="UpperHighlight" Property="Fill" Value="#40FFFFFF" />
                    </Trigger>
                    <!--<MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected" Value="True" />
                            <Condition Property="Selector.IsSelectionActive" Value="False" />
                        </MultiTrigger.Conditions>
                        <Setter Property="Background" Value="{StaticResource ListItemSelectedInactiveFill}" />
                        <Setter Property="BorderBrush" Value="#FFCFCFCF" />
                    </MultiTrigger>-->
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected" Value="True" />
                            <Condition Property="IsMouseOver" Value="True" />
                        </MultiTrigger.Conditions>
                        <Setter Property="Background" Value="{StaticResource ListItemSelectedHoverFill}" />
                        <Setter Property="BorderBrush" Value="#FF98DDFB" />
                    </MultiTrigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>