How to change the background color of Selected item in CollectionView? .Net Maui-CodePudding

In Android, the default color is orange but i dont know how to change it. I tried the demo code of the official Microsoft's Docs, but is doesn´t work.

//Xaml//
<CollectionView ItemsSource="{Binding Products}"
                ItemTemplate="{StaticResource OfferProductStyle}"
                ItemsLayout="VerticalGrid,1"
                SelectionMode="Single"
                x:Name="MyCollectionView">
</CollectionView>

My CollectionView

CodePudding user response：

For this specific issue, that orange color is a platform specific color. It is found in your Android project head: Resources/values/Styles.xml. If you want to makes sure to take care of all these color cases, I would suggest replacing your contents of that xml file with the following (replace #FFFFFFFF with the actual color you want though) :

<resources>
   <style name="MyTheme" parent="android:style/Theme.Material.Light.DarkActionBar">
       <item name="android:colorPressedHighlight">@color/ListViewSelected</item>
       <item name="android:colorLongPressedHighlight">@color/ListViewHighlighted</item>
       <item name="android:colorFocusedHighlight">@color/ListViewSelected</item>
       <item name="android:colorActivatedHighlight">@color/ListViewSelected</item>
       <item name="android:activatedBackgroundIndicator">@color/ListViewSelected</item>
  </style>
    <color name="ListViewSelected">#FFFFFFFF</color>
    <color name="ListViewHighlighted">#FFFFFFFF</color>
</resources>

CodePudding user response：

CollectionView has a Selected VisualState that can be used to initiate a visual change to the selected item in the CollectionView. A common use case for this VisualState is to change the background color of the selected item, which is shown in the following XAML example:

<CollectionView SelectionMode="Single"> 
        <CollectionView.ItemTemplate>
             <DataTemplate>
                <VerticalStackLayout>
                     <Label Text="{Binding}"/>

                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup Name="CommonStates">
                                <VisualState Name="Normal"></VisualState>
                                <VisualState Name="Selected">
                                    <VisualState.Setters>
                                        <Setter Property="BackgroundColor" Value="LightSkyBlue"></Setter>
                                    </VisualState.Setters>
                                </VisualState>
                                
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                    </VerticalStackLayout>
                </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>

For more deatils, you can refer to this official docs:Change selected item color.