[Switch] Switch Toggle: OnColor Not set correctly and ThumbColor Not Reset When Toggled Off

[MAUIoxo]

Description

I have a Switch in a Grid within a DataTemplate of a CollectionView with my own ThumbColor defined like in the example below:

<CollectionView.ItemTemplate>
    <DataTemplate x:DataType="{x:Type databaseModels:Band}">
        <Grid ColumnDefinitions="*, Auto" RowDefinitions="Auto" Padding="{OnPlatform Default='5, 0, 5, 0', iOS='5, 0, 5, 15'}">
            <Label Grid.Row="0" Grid.Column="0" Text="{Binding Band.Name}" VerticalOptions="Center" />
            <Switch Grid.Row="0" Grid.Column="1" IsEnabled="True" IsToggled="{Binding IsSelected, Mode=TwoWay}" ThumbColor="{StaticResource Gray100}" OnColor="{StaticResource Orange}" VerticalOptions="Center" HorizontalOptions="Center" Margin="{OnPlatform Android='0, -5, 0, -5'}"/>
        </Grid>
    </DataTemplate>
</CollectionView.ItemTemplate>

Initially the Switch looks like below:

First of all, when the Switch is toggled, it gets its defined wrong OnColor (should be Orange):

After that when it is toggled off again, the defined ThumbColor="{StaticResource Gray100}" is not set back and the Switch looks as follows:

Steps to Reproduce

1. Define a ThumbColor and an OnColor for a Switch
2. See how the Color looks like when the Switch is not toggled initially
3. Toggle the Switch and it will apply the wrong OnColor (should be Orange)
4. Toggled again to state "Off" and it will not apply the defined ThumbColor again

In the linked example Project from repository:

1. Launch project
2. Click on the DotNetBot Icon
3. Defined ThumbColor is visible
4. Toggle switch on and color does not change to correct OnColor (should be Orange)
5. Toggle switch off and color is changed to a system default color, but not the specified ThumbColor again

Hint: The View containing the Switch with the ThumbColor and OnColor is in ..\Pages\Views*BottomSheetContentView.xaml*

Link to public reproduction project repository

ThumbColorNotReset_19883

Version with bug

8.0.6-nightly.9863

Is this a regression from previous behavior?

No, this is something new

Last version that worked well

7.0.101

Affected platforms

iOS, Android

Affected platform versions

No response

Did you find any workaround?

By the time this issue was reported, I did not find a workaround.

On April 13th 2024, I found the simples way that solved it for me, by just using a CustomSwitch that derived from Switch and use this in my XAML which fixed it for me as you can see below.

Relevant log output

No response

Hi @MAUIoxo. We have added the "s/needs-repro" label to this issue, which indicates that we require steps and sample code to reproduce the issue before we can take further action. Please try to create a minimal sample project/solution or code samples which reproduce the issue, ideally as a GitHub repo that we can clone. See more details about creating repros here: https://github.com/dotnet/maui/blob/main/.github/repro.md

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

[jsuarezruiz]

Could be related? #19882

[MAUIoxo]

I added an example project that shows this Bug: ThumbColorNotReset_19883

I don't think that #19882 is related. The Switch is within a Grid, but the other Bug is about Grid.Resources that overwrite globally defined Styles (e.g. for Labels) completely when a property is defined as a Grid.Resource (intention e.g. define a HorizontalOption for all Labels within this Grid) and this is not the same here

[MAUIoxo]

First of all, I fooled myself by not choosing a more distinct OnColor and did not see that also the OnColor is not set! The OnColor should be Orange, but is not assigned. Can also be seen in the same project I attached