如何更改 ListBox 项的 SelectedItem 前景文本

Question

我在下面有以下列表框。我不确定如何在选择项目时更改所选项目的文本块文本的前景，然后在取消选择项目时返回原始前景色（很可能在之后选择 ListBox 中的另一个项目时发生）？

<ListBox Name="ListBox" SelectionMode="Single" ItemsSource="{Binding}" Margin="{Binding}"
                     toolkit:TiltEffect.IsTiltEnabled="True" SelectionChanged="ListBox_SelectionChanged" >
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <toolkit:WrapPanel ItemWidth="159" ItemHeight="Auto" />
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Vertical"  >
                                <Image Source="{Binding Thumbnail}" Width="155" Height="155" />
                                <TextBlock Text="{Binding Name}" TextWrapping="Wrap" FontSize="{StaticResource PhoneFontSizeNormal}" VerticalAlignment="Center" HorizontalAlignment="Center" />
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>

Answer 1

您必须编辑ItemContainerStyle（编辑其他模板> 编辑生成的项目容器（ItemContainerStyle））。

ItemContainerStyle 内是Selected 视觉状态，您可以更改它。

<Style x:Key="ListBoxItemStyle1" TargetType="ListBoxItem">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="VerticalContentAlignment" Value="Top"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListBoxItem">
                <Border x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ContentContainer"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Unselected"/>
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="YOUR_NEW_COLOR"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 2

我正在考虑将您的ListBox 的ItemsSource 绑定到一个示例类test.cs 的ObservableCollection，如下所示

ObservableCollection<test> coll = new ObservableCollection<test>();

而DataContext 是ListBox.DataContext = coll;

在ListBoxItemTemplate中绑定TextBlock的Foreground属性

<TextBlock Text="{Binding Name}" Foreground="{Binding foreground}" TextWrapping="Wrap" FontSize="{StaticResource PhoneFontSizeNormal}" VerticalAlignment="Center" HorizontalAlignment="Center" />

现在定义您的 SelectionChanged 事件

private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    test tItem = (sender as ListBox).SelectedItem as test;
    test.foreground = "#FFCB202D"; //this will change the color of the TextBlock
}

确保您使用INotifyPropertyChanged 扩展您的类test.cs 并使用相同的方式定义属性foreground，否则将不会反映动态更改。

    private string tmpforeground;
    public string foreground
    {
        get
        {
            return tmpforeground;
        }

        set
        {
            if (tmpforeground== value)
                return;
            tmpforeground= value;
            NotifyPropertyChanged("foreground");
        }
    }

另外请注意，如果您希望文本块在一次点击时将颜色更改为绿色，然后通过再次点击再次更改其颜色，SelectionChanged 事件将不起作用，因为它仅在选择不同的项目时起作用。因此，如果您想在连续点击时更改颜色，请改用 Tap 事件

<ListBox Name="ListBox" SelectionMode="Single" ItemsSource="{Binding}" Margin="{Binding}"
                 toolkit:TiltEffect.IsTiltEnabled="True" Tap="ListBox_Tap" >

private void ListBox_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
    test tItem = (sender as ListBox).SelectedItem as test;
    test.foreground = "#FFCB202D";
}