Custom selection styles for items in CollectionView are ignored when programmatically selecting an item

[tschbc]

Description

Programmatically selecting an item in a CollectionView does not respect the VisualStateManager in its ItemTemplate (applied by styles or otherwise). Selecting the item as a user (tap / click) works.

Steps to Reproduce

1. Create a new MAUI app and replace default views with a CollectionView. Set its SelectionMode to "Single." Subscribe to its "Loaded" event. Add a VisualStateManager to its ItemTemplate that changes the BackgroundColor to Aqua when Selected.

2. Assign a list of strings to the CollectionView's ItemSource and, when its Loaded event fires, set the CollectionView's SelectedItem to the second string from the list.

3. On Windows: When the CollectionView loads, the second item is selected with the default selection style:

Clicking a different item correctly applies the custom selection style:

4. On iOS 17.0 simulator it's even worse. When the CollectionView loads and the second item is selected it just disappears:

Selecting a different item doesn't bring it back:

And when selecting a different item again, either the SelectionMode or VisualStateManager breaks, applying selection styles to multiple items:

Link to public reproduction project repository

https://github.com/tschbc/SelectionStyleIssue

Version with bug

8.0.3

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

iOS, Windows

Affected platform versions

windows10.0.19041.0, iOS 17.0

Did you find any workaround?

No

Relevant log output

No response

[tschbc]

Playing around with this a bit more and it gets weirder.

For iOS, I selected the first item instead of second in the Loaded event and the styles were applied correctly, but the second item is still missing:

Single-selection is still broken though:

[sharpwood]

I also found the same problem. This problem does not seem to appear on Android.

[XamlTest]

Verified this on Visual Studio Enterprise 17.9.0 Preview 2(8.0.3). Repro on Windows 11, Android 14.0-API34, iOS 17.0 and MacCatalyst with below Project:
SelectionStyleIssue.zip

Windows: When the CollectionView loads, the second item is selected with the default selection style -> Clicking a different item correctly applies the custom selection style.

Android: Applying selection styles to multiple items

iOS: When the CollectionView loads, the second item is disappeared, and applying selection styles to multiple items.

Mac: Applying selection styles to multiple items.

[jeremy-visionaid]

ListView appears to be similarly affected :(

[ssamix]

    <CollectionView x:Name="xxx"

HorizontalScrollBarVisibility="Never"
ItemsSource="{Binding Products}"
SelectionMode="Single"
VerticalScrollBarVisibility="Never">

private void MyPage_Loaded(object? sender, EventArgs e)
{

    xxx.SelectedItem = ((ObservableCollection<ProductItem>)xxxx.ItemsSource).FirstOrDefault();

}

First item is selected as default but no color on selected background how to fix it .. I think it is bug ...

[Phantom-KNA]

I also found the same problem. This problem does not seem to appear on Android.

The same for Android

[LeoJHarris]

Any update? VisualStateGroups are not working in iOS when programmatically selecting an item in a CollectionView with SelectionMode="Single". These do not get applied at all:

 <VisualState Name="Selected">
      <VisualState.Setters>
            <Setter TargetName="nameLabel" Property="Label.TextColor" Value="White" />
            <Setter Property="BackgroundColor" Value="{DynamicResource BrandPrimaryColor}" />
      </VisualState.Setters>
</VisualState>

[mybadstudios]

Visual Studio 2022, Windows platform, Same issue. :(
Setting the selected item during OnAppearing after a short delay but still no luck.

I added a ListViewObj_PropertyChanged function and when the Answer property changes I manually update a Label to show the content of the selected item. This way I can see when the values change so I can say that when the page loads Answer has a value of null so there is nothing highlighted. After a short delay I manually set the value and the Label updates but the color remains unchanged. I then click on something else and the Label updates but the color still remains unchanged. I then click on the first value again and from now on the colors change perfectly.

[LeoJHarris]

Visual Studio 2022, Windows platform, Same issue. :(
Setting the selected item during OnAppearing after a short delay but still no luck.

I added a ListViewObj_PropertyChanged function and when the Answer property changes I manually update a Label to show the content of the selected item. This way I can see when the values change so I can say that when the page loads Answer has a value of null so there is nothing highlighted. After a short delay I manually set the value and the Label updates but the color remains unchanged. I then click on something else and the Label updates but the color still remains unchanged. I then click on the first value again and from now on the colors change perfectly.

Are you able to share some of the implementation for this? I've tried putting a delay timer that starts when the pages appearing method is called. Sometimes, it works but not always, android seems to respond better.

[rodolfo-sousa]

I'm having problems in removing the selecteditem background color in Windows (WinUI).

I tried with styles:
<VisualState x:Name="Selected"> <VisualState.Setters> <Setter Property="BackgroundColor" Value="Transparent" /> </VisualState.Setters> </VisualState>

and this in Platforms\Windows\App.xaml:
<maui:MauiWinUIApplication.Resources> <ResourceDictionary> <SolidColorBrush x:Key="ListViewItemBackgroundSelected" Color="#ff000000" /> <SolidColorBrush x:Key="ListViewItemBackgroundSelectedPointerOver" Color="#ff000000" /> <SolidColorBrush x:Key="ListViewItemBackgroundSelectedPressed" Color="#ff000000" /> <SolidColorBrush x:Key="ListViewItemSelectedBackgroundThemeBrush" Color="#ff000000" /> </ResourceDictionary> </maui:MauiWinUIApplication.Resources>