WPF ListView高亮显示颜色不变 [英] WPF ListView Highlight Color don't change

查看:77
本文介绍了WPF ListView高亮显示颜色不变的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个ListView,每个项目具有三个TextBlock. 第一个具有默认颜色(黑色),其他一个具有前景"属性设置为灰色.

当我选择一个项目时,第一个TextBlock的颜色变为蓝色,而其他文本保持灰色,难以阅读.

我希望选中该项目时所有文本都变为白色. 我该怎么做?

我的风格:

 <UserControl.Resources>
        <Style TargetType="{x:Type ListViewItem}">
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Foreground" Value="White"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

我的ListView

        <ListView  x:Name="lvResultat"  Grid.Row="0" Grid.Column="1" Background="{x:Null}"  
                      Margin="4"                       
                      HorizontalContentAlignment="Stretch"
                           ScrollViewer.VerticalScrollBarVisibility="Auto"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                      IsSynchronizedWithCurrentItem="True"    

                      ItemsSource="{Binding ResultatsRecherche}" SelectedItem="{Binding ResultatSelectione, Mode=TwoWay}" BorderBrush="{x:Null}" MouseDoubleClick="lvResultat_MouseLeftDoubleClick" >
        <ListView.ItemTemplate>
            <DataTemplate DataType="viewModel:ResultatRechercheViewModel">
                <Grid Height="86" Margin="2"  >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="1.5*"/>
                        <RowDefinition Height="1*"/>
                        <RowDefinition Height="1*"/>
                        <RowDefinition Height="0.5*"/>
                    </Grid.RowDefinitions>
                    <TextBlock Text="{Binding Titre}" 
                                       FontSize="20" FontWeight="Bold"  />
                    <TextBlock Text="{Binding SousTitre}" Grid.Row="1" 
                                       FontStyle="Italic" Foreground="Gray"/>
                    <TextBlock Text="{Binding Resume}" Grid.Row="2"  TextTrimming="WordEllipsis"
                                        Foreground="Gray"/>

                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

我也尝试过

<Style TargetType="ListViewItem">
    <Style.Resources>
        <!--<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="White" />-->
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="White" />
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="White" />
    </Style.Resources>
</Style>

我发现自定义样式更改了Textblock的颜色,该文本块的默认属性为Foreground(黑色). 如果我将黑色指定为第一个文本块的文本颜色,则选中该项目后文本的颜色将不再改变.

图片:

解决方案

通过将代码从具有DataTemplateListViewItem转换为具有ControlTemplate

的代码,可以实现您想要的目标

这是我尝试过的:

ListViewItem样式:

<Style TargetType="ListViewItem">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ListViewItem}">
                <Border x:Name="ContentBorder"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Margin="4">
                    <Grid Height="86" Margin="2"  >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="1.5*"/>
                            <RowDefinition Height="1*"/>
                            <RowDefinition Height="1*"/>
                            <RowDefinition Height="0.5*"/>
                        </Grid.RowDefinitions>
                        <TextBlock Text="{Binding Titre}" 
                               FontSize="20" FontWeight="Bold"  />
                        <TextBlock Text="{Binding SousTitre}" Grid.Row="1" Name="st"
                               FontStyle="Italic" Foreground="Gray"/>
                        <TextBlock Text="{Binding Resume}" Grid.Row="2"  TextTrimming="WordEllipsis" Name="r"
                                Foreground="Gray"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Foreground" TargetName="st" Value="White" />
                        <Setter Property="Foreground" TargetName="r" Value="White" />
                        <Setter Property="Background" TargetName="ContentBorder"  Value="DeepSkyBlue" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然后我从ListView XAML中删除了DataTemplate:

<ListView  x:Name="lvResultat"  Grid.Row="0" Grid.Column="1" Background="{x:Null}"  
           Margin="4"                       
           HorizontalContentAlignment="Stretch"
           ScrollViewer.VerticalScrollBarVisibility="Auto"
           ScrollViewer.HorizontalScrollBarVisibility="Disabled"
           IsSynchronizedWithCurrentItem="True"    
           ItemsSource="{Binding ResultatsRecherche}" SelectedItem="{Binding ResultatSelectione, Mode=TwoWay}" BorderBrush="{x:Null}" >
</ListView>

但是,如果必须使用DateTemplate,则可以做的是在ViewModelResultatRechercheViewModel上具有一个名为IsSelected的属性,然后在DataTemplate中的该属性上具有DataTriggers.

更新的数据模板:

<ListView.ItemTemplate>
    <DataTemplate DataType="viewModel:ResultatRechercheViewModel">
        <Grid Height="86" Margin="2"  >
            <Grid.RowDefinitions>
                <RowDefinition Height="1.5*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="0.5*"/>
            </Grid.RowDefinitions>
            <TextBlock Text="{Binding Titre}" 
                           FontSize="20" FontWeight="Bold"  />
            <TextBlock Text="{Binding SousTitre}" Grid.Row="1"  Name="st"
                           FontStyle="Italic" Foreground="Gray"/>
            <TextBlock Text="{Binding Resume}" Grid.Row="2"  TextTrimming="WordEllipsis" Name="r"
                            Foreground="Gray"/>

        </Grid>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding IsSelected}" Value="True">
                <Setter Property="Foreground" TargetName="st" Value="White" />
                <Setter Property="Foreground" TargetName="r" Value="White" />
            </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</ListView.ItemTemplate>

并且,您需要更新您的ViewModel代码以设置IsSelected属性,以下是来自MainViewModel的代码:

public ResultatRechercheViewModel ResultatSelectione
{
    get { return _resultatSelectione; }
    set
    {
        if (_resultatSelectione != null)
        {
            _resultatSelectione.IsSelected = false;
        }

        _resultatSelectione = value;

        _resultatSelectione.IsSelected = true;
    }
}

希望这可以解决您的问题或为您提供一些解决问题的想法.

I have a ListView with three TextBlock for each Item. The first one has the default color (black) and the others has the property Foreground set to gray.

When I select an item the color of the first TextBlock becomes blue but the others stay gray and are hard to read.

I want that all the text become white color when the item is selected. How I do that ?

Edit : My style :

 <UserControl.Resources>
        <Style TargetType="{x:Type ListViewItem}">
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Foreground" Value="White"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

My ListView

        <ListView  x:Name="lvResultat"  Grid.Row="0" Grid.Column="1" Background="{x:Null}"  
                      Margin="4"                       
                      HorizontalContentAlignment="Stretch"
                           ScrollViewer.VerticalScrollBarVisibility="Auto"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                      IsSynchronizedWithCurrentItem="True"    

                      ItemsSource="{Binding ResultatsRecherche}" SelectedItem="{Binding ResultatSelectione, Mode=TwoWay}" BorderBrush="{x:Null}" MouseDoubleClick="lvResultat_MouseLeftDoubleClick" >
        <ListView.ItemTemplate>
            <DataTemplate DataType="viewModel:ResultatRechercheViewModel">
                <Grid Height="86" Margin="2"  >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="1.5*"/>
                        <RowDefinition Height="1*"/>
                        <RowDefinition Height="1*"/>
                        <RowDefinition Height="0.5*"/>
                    </Grid.RowDefinitions>
                    <TextBlock Text="{Binding Titre}" 
                                       FontSize="20" FontWeight="Bold"  />
                    <TextBlock Text="{Binding SousTitre}" Grid.Row="1" 
                                       FontStyle="Italic" Foreground="Gray"/>
                    <TextBlock Text="{Binding Resume}" Grid.Row="2"  TextTrimming="WordEllipsis"
                                        Foreground="Gray"/>

                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

I also tried things like

<Style TargetType="ListViewItem">
    <Style.Resources>
        <!--<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="White" />-->
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="White" />
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="White" />
    </Style.Resources>
</Style>

EDIT 2 : I have discovered that the custom style changes the color of Textblock which have the default property as Foreground (black). If I specife Black for the color of the text of the first textblock, the text doesn't change anymore of color when the item is selected.

Picture :

解决方案

You could achieve what you are trying to do by converting your code from having DataTemplate for a ListViewItem to having a ControlTemplate

This is what I tried:

ListViewItem Style:

<Style TargetType="ListViewItem">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ListViewItem}">
                <Border x:Name="ContentBorder"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Margin="4">
                    <Grid Height="86" Margin="2"  >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="1.5*"/>
                            <RowDefinition Height="1*"/>
                            <RowDefinition Height="1*"/>
                            <RowDefinition Height="0.5*"/>
                        </Grid.RowDefinitions>
                        <TextBlock Text="{Binding Titre}" 
                               FontSize="20" FontWeight="Bold"  />
                        <TextBlock Text="{Binding SousTitre}" Grid.Row="1" Name="st"
                               FontStyle="Italic" Foreground="Gray"/>
                        <TextBlock Text="{Binding Resume}" Grid.Row="2"  TextTrimming="WordEllipsis" Name="r"
                                Foreground="Gray"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Foreground" TargetName="st" Value="White" />
                        <Setter Property="Foreground" TargetName="r" Value="White" />
                        <Setter Property="Background" TargetName="ContentBorder"  Value="DeepSkyBlue" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

and then I removed DataTemplate from the ListView XAML:

<ListView  x:Name="lvResultat"  Grid.Row="0" Grid.Column="1" Background="{x:Null}"  
           Margin="4"                       
           HorizontalContentAlignment="Stretch"
           ScrollViewer.VerticalScrollBarVisibility="Auto"
           ScrollViewer.HorizontalScrollBarVisibility="Disabled"
           IsSynchronizedWithCurrentItem="True"    
           ItemsSource="{Binding ResultatsRecherche}" SelectedItem="{Binding ResultatSelectione, Mode=TwoWay}" BorderBrush="{x:Null}" >
</ListView>

However, if you must use DateTemplate, then what you could do is have a property called IsSelected on your ViewModel, ResultatRechercheViewModel and then have DataTriggers on that property in your DataTemplate.

Updated DataTemplate:

<ListView.ItemTemplate>
    <DataTemplate DataType="viewModel:ResultatRechercheViewModel">
        <Grid Height="86" Margin="2"  >
            <Grid.RowDefinitions>
                <RowDefinition Height="1.5*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="0.5*"/>
            </Grid.RowDefinitions>
            <TextBlock Text="{Binding Titre}" 
                           FontSize="20" FontWeight="Bold"  />
            <TextBlock Text="{Binding SousTitre}" Grid.Row="1"  Name="st"
                           FontStyle="Italic" Foreground="Gray"/>
            <TextBlock Text="{Binding Resume}" Grid.Row="2"  TextTrimming="WordEllipsis" Name="r"
                            Foreground="Gray"/>

        </Grid>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding IsSelected}" Value="True">
                <Setter Property="Foreground" TargetName="st" Value="White" />
                <Setter Property="Foreground" TargetName="r" Value="White" />
            </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</ListView.ItemTemplate>

And, you need to update your ViewModel code to set IsSelected property, Below is code from my MainViewModel:

public ResultatRechercheViewModel ResultatSelectione
{
    get { return _resultatSelectione; }
    set
    {
        if (_resultatSelectione != null)
        {
            _resultatSelectione.IsSelected = false;
        }

        _resultatSelectione = value;

        _resultatSelectione.IsSelected = true;
    }
}

Hope this resolves your problem or gives you some ideas to resolve your problem.

这篇关于WPF ListView高亮显示颜色不变的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆