[Silverlight]使用DoubleAnimation为对象添加动画效果

在Silverlight中,你可以使用Storyboard控件来控制页面对象的属性从而实现动画效果。该控件可以做用于double,Color以及Point类型,比如以动画形式改变Rectangle的Opactity值(double型)。Storyboard可以在XAML中作为一个Resource声明,如在Canvs对象中可以做如下声明

    <Canvas>
        <Canvas.Resources>
            <Storyboard x:Name="MyRect"></Storyboard>
        </Canvas.Resources>
    </Canvas>

Storyboard控件提供两种实现动画的方式

  • DoubleAnimation -  使用 From/To 描述动画过程.
  • DoubleAnimationUsingKeyFrames - 这是一个用来承载关键帧设置的容器,通过设置时间轴上关键真的方式描述动画过程.

     

    DoubleAnimation

    如上所述,DoubleAnimation通过使用From/To的方式来更改某个属性值从而实现动画效果。让我们来看看DoubleAnimation都包含了哪些属性:

  • Storyboard.TargetProperty - 这个属性用来指定DoubleAnimation所要作用的属性(格式:UIElement.Property)。
  • Storyboard.TargetName - 这个属性用来指定DoubleAnimation所作用的控件(一个提供了x:name的控件) .
  • Duration - 设置动画的持续时间 (格式: [days.]hours:minutes:seconds)。
  • From/To - 设置属性的起始和结束值,From的默认值是1.0。一般情况下我们不需要修改它。  
  • AutoReverse - 指示时间线在完成向前迭代后是否按相反的顺序播放
  • RepeatBehavior - 设置为"Forever”会使动画无限循环播放。你也可以设置一个循环次数或者持续时间 (格式: [days.]hours:minutes:seconds) .

     

    OK,下面看一个例子

    <Canvas> <Canvas.Resources> <Storyboard x:Name="CatSB"> <DoubleAnimation

    Storyboard.TargetName="MyCat" Storyboard.TargetProperty="UIElement.Opacity" Duration="00:00:02" From="1.0" To="0.0" AutoReverse="True" RepeatBehavior="Forever">

    </DoubleAnimation> </Storyboard> </Canvas.Resources> <Image Source="cat.jpg" x:Name="MyCat" ></Image> </Canvas>

  • 然后在代码中使用CatSB.Begin()方法调用即可。

    效果如下

     

     

     

     

     

     

     

     

     

     

     

  • posted @   紫色永恒  阅读(2263)  评论(2编辑  收藏  举报
    编辑推荐:
    · 如何编写易于单元测试的代码
    · 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
    · .NET Core 中如何实现缓存的预热?
    · 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
    · AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
    阅读排行:
    · 周边上新:园子的第一款马克杯温暖上架
    · Open-Sora 2.0 重磅开源!
    · 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
    · Ollama——大语言模型本地部署的极速利器
    · [AI/GPT/综述] AI Agent的设计模式综述
    点击右上角即可分享
    微信分享提示