Wpf(Storyboard)动画简单实例

时间:2023-03-08 20:01:52
Wpf(Storyboard)动画简单实例

原文:Wpf(Storyboard)动画简单实例

动画的三种变换方式

RotateTransform:旋转变换变化值:CenterX围绕转的圆心横坐标

CenterY纵坐标

Angle旋转角度(角度正负表示方向)

ScaleTransform:缩放变换变化值:ScaleX横向放大倍数 ScaleY纵向(负值时翻转)

TranslateTransform:平移变换变化值: X横坐标 Y纵坐标

其中

<Image.Projection>      后多了三种变化值,RotationX,RotationY,RotationZ分别围绕X Y Z轴转(单位度数)可以通过设置定时器来实现动画。

<控件.RenderTransform>

<变换方式x:Name = “名字”></变换方式>

</控件.RenderTransform >

在Wpf下使用:

在xaml <window></winodw>中添加:

  1. <window. Resources>
  2. <Storyboard x:Key=”动画名字”  RepeatBehavior="Forever">
  3. <DoubleAnimation Storyboard.TargetName="名字"
  4. Storyboard.TargetProperty="变化值"
  5. From="数 " To="数 "
  6. BeginTime="XX:XX:XX"
  7. Duration="XX:XX:XX">
  1. </DoubleAnimation>
  2. <!--可以同时变化多个值。-->
  3. <DoubleAnimation Storyboard.TargetName="名字"
  4. Storyboard.TargetProperty="变化值"
  5. From="数 " To="数 "
  6. BeginTime="XX:XX:XX"
  7. Duration="XX:XX:XX">
  8. </DoubleAnimation>
  9. </Storyboard>
  10. ndows. Resources>

在程序调用位置中添加(一般在窗口加载方法中添加)运行动画

Storyboard sbd = Resources["动画名字"]asStoryboard;

sbd.Begin();

注意区分这里的名字和动画名字是不同的。一般名字是控件的名字。

RepeatBehavior获取或设置此时间线的重复行为。Forever循环动画

DoubleAnimation它在指定的持续时间内将动画从指定的起始值继续到指定的目标值。

From,To 动画开始到结束变化的值

BeginTime,Duration动画开始到结束所用时间

DoubleAnimation中的值:

AutoReverse="True/False"

是否播放结束后倒序播放,例如:一朵云从左往右飘然后再从右往左飘回来

下面方式实例:

控件部分:

<Image Source="Images/cloud.png" Width="190" Height="50" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="20,20,0,0">

<Image.RenderTransform>

<TranslateTransform x:Name="cloud"></TranslateTransform>

</Image.RenderTransform>

</Image>

动画部分:

<Window.Resources>

<Storyboard x:Key="sbCloud" RepeatBehavior="Forever">

<DoubleAnimation Storyboard.TargetName="cloud"

Storyboard.TargetProperty="X"

From="0" To="280"

BeginTime="00:00:00"

Duration="00:00:10">

</DoubleAnimation>

<DoubleAnimation Storyboard.TargetName="cloud"

Storyboard.TargetProperty="Y"

From="0" To="30"

BeginTime="00:00:00"

Duration="00:00:10">

</DoubleAnimation>

</Storyboard>

</Window.Resources>