Home > Net >  How to animation button from y 10 to y 0 - UWP
How to animation button from y 10 to y 0 - UWP

Time:10-22

Animation Button From Y Coordinate 10 to Y Coordinate 0. Animation Like: Ease-In-Out, Ease-In, Ease-Out. Thanks!

CodePudding user response:

How to animation button from y 10 to y 0 - UWP

You could use DoubleAnimation with EasingFunction to animate your button. the following is the complete sample.

<Grid>
    <Grid.Resources>
        <Storyboard x:Name="Storyboard2">
            <DoubleAnimation
                Storyboard.TargetName="MyButton"
                Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)"
                From="0"
                To="200">
                <DoubleAnimation.EasingFunction>
                    <ExponentialEase EasingMode="EaseIn" Exponent="4.5" />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
    </Grid.Resources>
    <Button
        x:Name="MyButton"
        VerticalAlignment="Center"
        Click="Button_Click"
        Content="HelloWorld">
        <Button.RenderTransform>
            <CompositeTransform />
        </Button.RenderTransform>
    </Button>
</Grid>

Usage

private void Button_Click(object sender, RoutedEventArgs e)
{
    Storyboard2.Begin();
}
  • Related