C# Avalonia 15- Animation- Easing

Easing.axaml代码

<Window xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        Height="371" Width="499"
        x:Class="AvaloniaUI.Easing"
        Title="Easing">
    <Grid Background="White">
        <Button Width="300" Height="60" HorizontalAlignment="Center" Content="This button grows">
            <Button.Styles>
                <Style Selector="Button">
                    <Style.Animations>
                        <Animation Duration="0:0:3" FillMode="Forward">
                            <KeyFrame Cue="0%">
                                <Setter Property="Width" Value="400"/>
                            </KeyFrame>
                            <KeyFrame Cue="100%">
                                <Setter Property="Width" Value="300"/>
                            </KeyFrame>
                        </Animation>
                    </Style.Animations>
                </Style>
                
                <Style Selector="Button:pointerover">
                    <Style.Animations>
                        <Animation Duration="0:0:1.5" FillMode="Forward" Easing="ElasticEaseOut">
                            <KeyFrame Cue="0%">
                                <Setter Property="Width" Value="300"/>
                            </KeyFrame>
                            <KeyFrame Cue="100%">
                                <Setter Property="Width" Value="400"/>
                            </KeyFrame>
                        </Animation>
                    </Style.Animations>
                </Style>
            </Button.Styles>
        </Button>
    </Grid>
</Window>

Easing.axaml.cs代码

using Avalonia;
using Avalonia.Animation;
using Avalonia.Animation.Easings;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;

namespace AvaloniaUI;

public partial class Easing : Window
{
    public Easing()
    {
        InitializeComponent();
    }

}

运行效果