DataTrigger doesn't work with Style property

[yellboy]

Description

When DataTrigger is used to set the style property of a component, it does change the style of the said component to previous value when the data changes again. This is not according to https://docs.microsoft.com/en-us/dotnet/maui/fundamentals/triggers#data-triggers.

Steps to Reproduce

Create a custom component containing Entry:

<Entry
       Placeholder="{TemplateBinding Placeholder}"
       Text="{TemplateBinding Text}"
       Keyboard="{TemplateBinding Keyboard}"
       IsReadOnly="{TemplateBinding IsReadOnly}"
       MaxLength="{TemplateBinding MaxLength}"
       HorizontalTextAlignment="Center"
       HorizontalOptions="End" 
       VerticalOptions="Center"
>
      <Entry.Triggers>
          <DataTrigger TargetType="Entry" Binding="{TemplateBinding IsValid}" Value="False">
              <Setter Property="Style" Value="{StaticResource Entry.Invalid}" />
          </DataTrigger>
      </controls:MyCustomEntry.Triggers>
  </controls:CustomEntryControl>

Styles are defined in a separate file:

<Style TargetType="Entry" >
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource PrimaryTextColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Focused">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource PrimaryTextColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource SecondaryTextColor}" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
</Style>
<Style x:Key="Entry.Invalid" TargetType="Entry">
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource WarningColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Focused">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource WarningColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource WarningColor}" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
</Style>

I would expect that the text color goes to WarningColor when the IsValid is false and goes back to PrimaryTextColor when IsValid becomes true again. Instead, it stays of WarningColor forever.

Link to public reproduction project repository

https://github.com/yellboy/Maui_DataTriggerIssue

Version with bug

6.0.400

Last version that worked well

Unknown/Other

Affected platforms

Android, Windows

Affected platform versions

Android 12.1, Windows 10.0.19041.0

Did you find any workaround?

It works if the default style is explicitly named and referenced in the custom control:

<Entry
       Placeholder="{TemplateBinding Placeholder}"
       Text="{TemplateBinding Text}"
       Style="{StaticResource Entry.Valid}"
       Keyboard="{TemplateBinding Keyboard}"
       IsReadOnly="{TemplateBinding IsReadOnly}"
       MaxLength="{TemplateBinding MaxLength}"
       HorizontalTextAlignment="Center"
       HorizontalOptions="End" 
       VerticalOptions="Center"
>
      <Entry.Triggers>
          <DataTrigger TargetType="Entry" Binding="{TemplateBinding IsValid}" Value="False">
              <Setter Property="Style" Value="{StaticResource Entry.Invalid}" />
          </DataTrigger>
      </controls:MyCustomEntry.Triggers>
  </controls:CustomEntryControl>

Styles file:

<Style TargetType="Entry" x:Key="Entry.Valid">
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource PrimaryTextColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Focused">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource PrimaryTextColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource SecondaryTextColor}" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
</Style>
<Style x:Key="Entry.Invalid" TargetType="Entry">
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource WarningColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Focused">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource WarningColor}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <VisualState.Setters>
                            <Setter Property="TextColor" Value="{DynamicResource WarningColor}" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
</Style>

Relevant log output

No response

[PureWeen]

@StephaneDelcroix thoughts?

[ghost]

Hi @yellboy. 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.

[ghost]

This issue has been automatically marked as stale because it has been marked as requiring author feedback to reproduce the issue but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. If it is closed, feel free to comment when you are able to provide the additional information and we will re-investigate.

[yellboy]

Hello. I provided a reproduction repo: https://github.com/yellboy/Maui_DataTriggerIssue.

[homeyf]

Verified this issue with Visual Studio Enterprise17.7.0 Preview 1.0. Can repro on Android Platform with above project. https://github.com/yellboy/Maui_DataTriggerIssue Android: Windows: