silverlight学习之storyboard （动画）

来源：互联网发布：webpack mac 安装编辑：程序博客网时间：2024/04/28 22:45

利用silverlight的storyboard可以很方便的制作一些简单的“动画”，比如控制一些控件double类型或者color类型的属性值的变化。下面简单地说其中最简单的两个方面：DoubleAnimation（控制控件double类型的属性）和ColorAnimation（控制控件Color类型的属性）。

前提知识：DoubleAnimation是一个执行动画的动画对象，ColorAnimation也只是一个执行动画的动画对象，他们不是独立存在的，而是要寄存在管理动画的演示图板对象（storyboard对象）上。可以这样理解：DoubleAnimation、ColorAnimation只是storyboard的一个属性而已。

XAML代码：

<UserControl.Resources>        <Storyboard x:Name="storyboard">            <DoubleAnimation  Storyboard.TargetName="rectangle1" Storyboard.TargetProperty="Width"                               From="160" To="300" Duration="0:0:2" AutoReverse="True" RepeatBehavior="forever">            </DoubleAnimation>            <ColorAnimation Storyboard.TargetName="rectangle1" Storyboard.TargetProperty="(rectangle1.Fill).Color"                             From="Blue" To="Red" Duration="0:0:5" AutoReverse="True" RepeatBehavior="forever">            </ColorAnimation>            <ColorAnimation Storyboard.TargetName="rectangle1" Storyboard.TargetProperty="(rectangle1.Stroke).Color"                             From="Green" To="Black" Duration="0:0:5" AutoReverse="True" RepeatBehavior="forever">            </ColorAnimation>        </Storyboard>    </UserControl.Resources>    <Grid x:Name="LayoutRoot" Background="White">        <Rectangle Height="100" HorizontalAlignment="Left" Margin="90,96,0,0" Name="rectangle1" Stroke="#FF16DB16"                    StrokeThickness="10" VerticalAlignment="Top" Width="200" Fill="#FFD83232" />    </Grid></UserControl>

1、可以看到里面的控件就只有一个：矩形 Rectangle

2、建立一个Storyboard对象

3、在Storyboard里添加一个DoubleAnimation属性（暂且这么理解吧）
Storyboard.TargetName：表示动画要作用于的控件

Storyboard.TargetProperty：表示动画要作用于的控件的哪个属性

From="160" ：表示控件属性的初始值 To="300" ：表示控件属性值的结束值

Duration="0:0:2" ：表示要经历的时间，表是时：分：秒

AutoReverse="True" 表示从From到To结束后再从To到From变化。 RepeatBehavior="forever" 表示无限重复

在ColorAnimation 属性里，我们想改变矩形的填充颜色，但这里要注意一下写法： Storyboard.TargetProperty = "(rectangle1.Fill).Color"

0 0