更改 CollectionView 中所选项目的背景颜色不适用于 UWP

问题描述

我想更改所选项目的背景颜色。我尝试了以下解决方案,但没有奏效。

<CollectionView x:Name="FlexCategoryType" Margin="0" HorizontalOptions="FillAndExpand" SelectionMode="Single" ItemsSource="{Binding ItemsCategory}" SelectedItem="{Binding SelectedCategory,Mode=TwoWay}" SelectionChanged="FlexCategoryType_SelectionChanged">
                                                <CollectionView.ItemTemplate>
                                                    <DataTemplate>
                                                        <StackLayout>
                                                            <Label Text="{Binding Name}"/>
                                                            <visualstatemanager.VisualStateGroups>
                                                                <VisualStateGroup Name="CommonStates">
                                                                    <VisualState Name="normal" />
                                                                    <VisualState Name="Selected">
                                                                        <VisualState.Setters>
                                                                            <Setter Property="BackgroundColor" Value="Yellow" />
                                                                        </VisualState.Setters>
                                                                    </VisualState>

                                                                </VisualStateGroup>
                                                            </visualstatemanager.VisualStateGroups>
                                                        </StackLayout>
                                                    </DataTemplate>
                                                </CollectionView.ItemTemplate>

                                            </CollectionView>

CollectionView SelectedItem is not highlighted in Xamarin Forms

解决方法

更改 CollectionView 中所选项目的背景颜色不适用于 UWP

问题是你没有具体的CollectionView SelectionMode,默认值为none。请将其设置为 Single。并添加 VisualStateGroups,如下所示

<CollectionView SelectionMode="Single">
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <StackLayout Margin="10">
                <Label Text="{Binding}" VerticalOptions="Center" />
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup Name="CommonStates">
                        <VisualState Name="Normal" />
                        <VisualState Name="Selected">
                            <VisualState.Setters>
                                <Setter Property="BackgroundColor" Value="Yellow" />
                            </VisualState.Setters>
                        </VisualState>

                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
            </StackLayout>
        </DataTemplate>
    </CollectionView.ItemTemplate>
    <CollectionView.ItemsSource>
        <x:Array Type="{x:Type x:String}">
            <x:String>1</x:String>
            <x:String>2</x:String>
            <x:String>3</x:String>
            <x:String>4</x:String>
            <x:String>5</x:String>
        </x:Array>
    </CollectionView.ItemsSource>
</CollectionView>

enter image description here

更新

如何更改 ListView 单元格选定的颜色。

这是 FormsListViewItem 样式,请将其复制到 UWP App.xaml 文件并根据需要编辑 SelectedBackground

例如

<Application.Resources>
    <ResourceDictionary>
        <Style x:Key="FormsListViewItem" TargetType="ListViewItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
            <Setter Property="TabNavigation" Value="Local" />
            <Setter Property="IsHoldingEnabled" Value="True" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}" />
            <Setter Property="MinHeight" Value="0" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <ListViewItemPresenter
                    CheckBrush="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                    ContentMargin="{TemplateBinding Padding}"
                    CheckMode="Inline"
                    ContentTransitions="{TemplateBinding ContentTransitions}"
                    CheckBoxBrush="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                    DragForeground="{ThemeResource ListViewItemDragForegroundThemeBrush}"
                    DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                    DragBackground="{ThemeResource ListViewItemDragBackgroundThemeBrush}"
                    DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                    FocusBorderBrush="{ThemeResource SystemControlForegroundAltHighBrush}"
                    FocusSecondaryBorderBrush="{ThemeResource SystemControlForegroundBaseHighBrush}"
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                    PointerOverForeground="{ThemeResource SystemControlHighlightAltBaseHighBrush}"
                    PressedBackground="{ThemeResource SystemControlHighlightListMediumBrush}"
                    PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"
                    PointerOverBackground="{ThemeResource SystemControlHighlightListLowBrush}"
                    ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                    SelectedPressedBackground="{ThemeResource SystemControlHighlightListAccentHighBrush}"
                    SelectionCheckMarkVisualEnabled="True"
                    SelectedForeground="{ThemeResource SystemControlHighlightAltBaseHighBrush}"
                    SelectedPointerOverBackground="{ThemeResource SystemControlHighlightListAccentMediumBrush}"
                    SelectedBackground="SeaGreen"
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>
</Application.Resources>