0

我正在将应用程序从 WinUI 移植到 Avalonia，但在移植动画时遇到了一些麻烦。在 WinUI 上，我有一个动画，当登录失败时触发，使两个 TextBoxes 和 Button 红色半秒，然后恢复到原来的状态：

            <Grid.Resources>
                <Storyboard x:Name="LoginFailedAnimation" AutoReverse="True">
                    <ColorAnimation Storyboard.TargetName="EmailField"                                
                            Storyboard.TargetProperty="(TextBox.Background).(SolidColorBrush.Color)"
                            To="Red" Duration="0:0:0.5"/>
                    <ColorAnimation Storyboard.TargetName="EmailField" 
                                    Storyboard.TargetProperty="(TextBox.BorderBrush).(SolidColorBrush.Color)"
                                    To="Red" Duration="0:0:0.5"/>
                    <ColorAnimation Storyboard.TargetName="PasswordField" 
                                    Storyboard.TargetProperty="(PaswordBox.Background).(SolidColorBrush.Color)"
                                    To="Red" Duration="0:0:0.5"/>
                      <ColorAnimation Storyboard.TargetName="PasswordField" 
                            Storyboard.TargetProperty="(PaswordBox.BorderBrush).(SolidColorBrush.Color)"
                            To="Red" Duration="0:0:0.5"/>
                    <ColorAnimation Storyboard.TargetName="LoginButton" 
                            Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"
                            To="Red" Duration="0:0:0.5"/>
                    <ColorAnimation Storyboard.TargetName="LoginButton" 
                            Storyboard.TargetProperty="(Button.Foreground).(SolidColorBrush.Color)"
                            To="White" Duration="0:0:0.5"/>
                </Storyboard>
            </Grid.Resources>

我只是使用 LoginFailedAnimation.Begin() 从代码中触发它。

在阿瓦洛尼亚我有这样的事情：

            <Grid.Styles>
                <Style Selector="TextBox.FailedLogin">
                    <Setter Property="Height" Value="100"/>
                    <Setter Property="Width" Value="100"/>
                    <Setter Property="Background" Value="Red"/>
                    <Style.Animations>
                        <Animation Duration="0:0:0.5" PlaybackDirection="Alternate" IterationCount="1"> 
                            <KeyFrame Cue="100%">
                                <Setter Property="Background" Value="{DynamicResource Red}"/>
                                <Setter Property="BorderBrush" Value="{DynamicResource Red}"/>
                            </KeyFrame>
                        </Animation>
                    </Style.Animations>
                </Style>

                <Style Selector="Button.FailedLogin">
                    <Setter Property="Height" Value="100"/>
                    <Setter Property="Width" Value="100"/>
                    <Setter Property="Background" Value="Red"/>
                    <Style.Animations>
                        <Animation Duration="0:0:0.5" PlaybackDirection="Alternate" IterationCount="1"> 
                            <KeyFrame Cue="100%">
                                <Setter Property="Background" Value="{DynamicResource Red}"/>
                                <Setter Property="Foreground" Value="White"/>
                            </KeyFrame>
                        </Animation>
                    </Style.Animations>
                </Style>
            </Grid.Styles>

目前，为了触发动画，我从代码中更改了两个 TextBoxes 和 Button 的 Classes 属性，顺便说一句，在动画结束时，我必须将 Classes 属性改回原始样式。为此，我必须使用一个等待 1 秒然后恢复 Classes 属性的计时器，顺便说一下，我认为这是一个糟糕的方法。

有没有更好的方法来实现这种行为？我错过了一些明显的东西吗？

4

0 回答 0