xaml - 如何改变ListView选中项的前景色

Question

我有一个 ListView，我正在其中更改所选项目的前景色:

<ListView ItemsSource="{Binding Levels}" 
                          x:Name="LvLevels" SelectionChanged="LvLevels_SelectionChanged">

    <ListView.ItemContainerStyle>
       <Style TargetType="ListViewItem">
          <Setter Property="Template">
              <Setter.Value>
                 <ControlTemplate TargetType="ListViewItem">
                    <Grid>                                               
                      <VisualStateManager.VisualStateGroups>
                         <VisualStateGroup x:Name="CommonStates">
                             <VisualState x:Name="Normal"/>
                         </VisualStateGroup>
                         <VisualStateGroup x:Name="SelectionStates">
                              <VisualState x:Name="Unselected">
                                 <Storyboard>
                                   <ColorAnimation Duration="0" Storyboard.TargetName="myback" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="Red"/>                                                                
                                 </Storyboard>
                              </VisualState>
                              <VisualState x:Name="SelectedUnfocused">
                                 <Storyboard>
                                   <ColorAnimation Duration="0" Storyboard.TargetName="myback" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="#16C8E0"/>
                                 </Storyboard>
                               </VisualState>
                             </VisualStateGroup>
                          </VisualStateManager.VisualStateGroups>
                          <Border x:Name="myback" Background="Transparent">
                            <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                          </Border>
                        </Grid>
                      </ControlTemplate>
                   </Setter.Value>
                 </Setter>
               </Style>
            </ListView.ItemContainerStyle>

    <ListView.ItemTemplate>
       <DataTemplate>
           <Grid>
              <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="Auto" />
                 <ColumnDefinition Width="*" />
              </Grid.ColumnDefinitions>

              <Image Grid.Column="0" Source="../Assets/icons/uno.png"
                     Margin="10 0 0 0"/>
              <TextBlock x:Name="tblock" Text="{Binding}" Grid.Column="1" FontSize="30" />                      
          </Grid>
       </DataTemplate>
  </ListView.ItemTemplate>
</ListView>

在我的案例中，如何更改所选项目的 TextBlock 的前景色？

我尝试过使用:

<ColorAnimation Duration="0" Storyboard.TargetName="tblock" 
   Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" 
   To="White"/>

但是得到了异常:

Exception = {"No installed components were detected.\r\n\r\nCannot resolve TargetName tblock."}

Answer 1

您遇到异常是因为 ListViewItem 的样式无法了解其项目模板中的结构/元素。
最简单的方法是重新定义 ListViewItem 容器样式。您还需要为“SelectionStates”中的“Selected”状态指定 VisualState。在那里你可以为某些元素的前景属性设置动画(ContentPresenter 没有它，所以我使用了 ContentControl)。

        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListViewItem">
                            <Grid>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal"/>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="SelectionStates">
                                        <VisualState x:Name="Selected">
                                            <Storyboard>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="contentControl" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" To="GreenYellow"/>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Unselected">
                                            <Storyboard>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="myback" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="Red"/>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="SelectedUnfocused">
                                            <Storyboard>
                                                <ColorAnimation Duration="0" Storyboard.TargetName="myback" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="#16C8E0"/>
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <Border x:Name="myback" Background="Transparent">
                                    <ContentControl x:Name="contentControl" Foreground="{TemplateBinding Foreground}" Content="{TemplateBinding Content}"  ContentTemplate="{TemplateBinding ContentTemplate}"/>
                                </Border>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListView.ItemContainerStyle>