Page crash when insert VisualState.Setters Property for "Label.Text"

Question

I have one .NET MAUI xaml-page with a Label and Switch. When i try to use VisualState-setters for change label text value on switch on/off, it work with emulator and in phone-debugger mode, but when i download it into my android phone the page crash when try to open!! This is the part of code for reproduce the problem:

    <HorizontalStackLayout Grid.Row="2" Grid.Column="0" Margin="5" Spacing="7" BackgroundColor="White" HeightRequest="50">
                                
                <!-- Automatic-Manual -->
                <VerticalStackLayout Margin="2" >
                    <Label x:Name="LblAutoMan" Text="Automatic" VerticalOptions="Start" HorizontalOptions="Center" HeightRequest="20" WidthRequest="65"/>
                    <Switch IsToggled="True" HorizontalOptions="Start" VerticalOptions="Center" HeightRequest="10">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup Name="CommonStates">
                                <VisualState Name="On">
                                    <VisualState.Setters>
                                        <Setter Property="ThumbColor" Value="Green" />
                                        <Setter TargetName="LblAutoMan" Property="Label.Text" Value="Automatic" /> 
                                    </VisualState.Setters>
                                </VisualState>
                                <VisualState Name="Off">
                                    <VisualState.Setters>
                                        <Setter Property="ThumbColor" Value="Red" />
                                        <Setter TargetName="LblAutoMan" Property="Label.Text" Value="Manual" /> 
                                    </VisualState.Setters>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                    </Switch>
                </VerticalStackLayout>
               
            </HorizontalStackLayout>

If i comment both two rows: <Setter TargetName="LblAutoMan"

Can someone resolve this bug?

Answer 1

According to this issue you need to enclose your <VisualStateGroup> inside a <VisualStateGroupList> tag:

<HorizontalStackLayout Grid.Row="2" Grid.Column="0" Margin="5" Spacing="7" BackgroundColor="White" HeightRequest="50">
                            
    <!-- Automatic-Manual -->
    <VerticalStackLayout Margin="2" >
        <Label x:Name="LblAutoMan" Text="Automatic" VerticalOptions="Start" HorizontalOptions="Center" HeightRequest="20" WidthRequest="65"/>
        <Switch IsToggled="True" HorizontalOptions="Start" VerticalOptions="Center" HeightRequest="10">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroupList>
                    <VisualStateGroup Name="CommonStates">
                        <VisualState Name="On">
                            <VisualState.Setters>
                                <Setter Property="ThumbColor" Value="Green" />
                                <Setter TargetName="LblAutoMan" Property="Label.Text" Value="Automatic" /> 
                            </VisualState.Setters>
                        </VisualState>

                        <VisualState Name="Off">
                            <VisualState.Setters>
                                <Setter Property="ThumbColor" Value="Red" />
                                <Setter TargetName="LblAutoMan" Property="Label.Text" Value="Manual" /> 
                            </VisualState.Setters>
                        </VisualState>
                    </VisualStateGroup>
                  </VisualStateGroupList>
                </VisualStateManager.VisualStateGroups>
        </Switch>
    </VerticalStackLayout>
</HorizontalStackLayout>