BackgroundColor of Selected Label in CollectionView doesn't change using VisualStateManager in Release build on iOS

[fischberg]

Description

When I use VisualStateManager to change the BackgroundColor of selected Label items in a CollectionView, the BackgroundColor remains the default color and doesn't change for a Release build on iOS. The BackgroundColor does change as expected for a Debug build on iOS and Debug and Release builds on Android. The TextColor property responds to the VisualStateManager on all builds as expected. My iOS testing and the images below were taken from an iPhone SE device running iOS 16.4.1. Android testing was done on emulators.

The first image is from the Debug build. The second image is of the "broken" Release build.

Steps to Reproduce

Create a Release build on iOS using the provided repository. Select items on the page and see that the Label's background colors don't respond to the VisualStateManager. It remains the default gray. Create a Debug build and see that the BackgroundColor responds as expected and is purple.

Link to public reproduction project repository

https://github.com/fischberg/RadioButtonControlTemplateBug

Version with bug

7.0 (current)

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

iOS 16.4

Did you find any workaround?

Not yet. Will try using Border as the parent item of Label within the CollectionView and using VisualStateManager to change the Background color.

Relevant log output

No response

[fischberg]

Here is a workaround...

If I create a custom ContentView component with the Label in it, put this component in the CollectionView DataTemplate instead of the Label and target this custom component with VisualStateManager instead of the Label, the BackgroundColor obeys the VisualStateManager on all builds.

Here's the very simple custom component created by extracting the Label from my original CollectionView DataTemplate.

` <?xml version="1.0" encoding="utf-8" ?> <ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="CVSelectionIssue.Comp">

    <Label FontAttributes="Bold" HeightRequest="40" VerticalTextAlignment="Center"
                HorizontalTextAlignment="Center" FontSize="Medium" Text="{Binding .}">
    </Label>

`

Here is the updated MainPage code that worked...

` <?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:components="clr-namespace:CVSelectionIssue" x:Class="CVSelectionIssue.MainPage">

<ContentPage.Resources>
    <Style TargetType="components:Comp">
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal">
                        <VisualState.Setters>
                            <Setter Property="BackgroundColor" Value="{AppThemeBinding Light={StaticResource White},Dark={StaticResource Black}}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Selected">
                        <VisualState.Setters>
                            <Setter Property="BackgroundColor" Value="{StaticResource Primary}"/>
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
    </Style>
</ContentPage.Resources>

<CollectionView ItemsSource="{Binding CVItems}" SelectionMode="Multiple">
    <CollectionView.ItemsLayout>
        <GridItemsLayout Span="2" Orientation="Vertical" VerticalItemSpacing="10" HorizontalItemSpacing="15" />
    </CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
    <DataTemplate>
        <components:Comp/>
    </DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>

`

[ghost]

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.

[realchrisparker]

The following works for Android but not iOS.

<CollectionView ItemsSource="{Binding Dates}" ItemSizingStrategy="MeasureAllItems" VerticalScrollBarVisibility="Always" SelectionMode="Single" SelectionChanged="DatesSelectionChanged" HeightRequest="{OnIdiom Tablet=325, Default=125}" Margin="20,0,0,0" VerticalOptions="Start">

[Hooterr]

I just run into a bug that in release, when you have a data trigger on a label that changes the background color, it doesn't work on iOS on release.

Then again the same issue but in a collection view. I have a background color of a label bound to a property and a converter. When you scroll the list some label have wrong color, which means when the item templates are recycled setting new background color doesn't work properly.

THIS NEEDS IMMEDIATE ATTENTION!!!

As a workaround use Background instead of BackgroundColor. But if you do that you need to also change your converters to inherit from IValueConverter instead of BaseConverter from Community toolkit (if you were even using that in the first place).

I guess we have another fundamental bug like the famous IsVisible a while back. What the actual f...k are you guys doing over there?!

[JohnHDev]

Im seeing the same on iOS release builds, background colour for label and entry controls don't change on theme changes (light/dark toggling). Works fine in debug, but not on release builds.

[Zhanglirong-Winnie]

Verified this issue with Visual Studio Enterprise 17.9.0 Preview 2.1. Can repro on iOS platforms with sample project. fischberg/CVSelectionIssue: Demo of Label in CollectionView not responding to VisualStateManager "Selected" state (github.com)