silverlight中 Storyboard(动画)的使用,实现球的上下循环移动,左右移动,及旋转功能
话说,总结应该是个收获的心情,可现在的自己似乎没感觉到哪个喜悦的心情,说明自己做得还不够好,现在还是把一些做好的东西总结下。“总结”是学习,工作中必须的,不能偷这个懒 o(╯□╰)o
实现上下循环移动的关键代码是:
首先创建一个计时器
rollTimer = new DispatcherTimer();
rollTimer.Interval = TimeSpan.FromMilliseconds();
rollTimer.Tick += new EventHandler(rollTimer_Tick);
rollTimer.Start();
此计时器设置的间隔期是1秒 也就是说1秒后会触发此事件rollTimer_Tick,然后我在此事件中,让球从上往下移动(用时0.5秒),然后此动画(故事板Storyboard)结束后,触发另一个事件(这个事件的控制是,让球从下往上移动,用时0.5秒),这样在这1秒中,球就实现了,上下循环移动。然后计时器的控制,可隔1秒后触发rollTimer_Tick事件,也就是说能让它循环。到一定的时间,将计时器停止就可将该事件停止。
rollTimer_Tick中的关键代码为:
public void rollTimer_Tick(object sender,EventArgs e)
{
DoubleAnimation da = new DoubleAnimation();
da.From = ;
da.To = ;
da.Duration = new Duration(TimeSpan.FromSeconds(0.5));
Storyboard.SetTarget(da, ellipse);
sbd.Completed += new EventHandler(sbd_Completed);
sbd.FillBehavior = FillBehavior.HoldEnd;
sbd.Children.Add(da);
sbd.Begin();
}
故事板结束后触发的事件sbd_Completed为:
#region 下半部分,使其由下往上移动
private void sbd_Completed(object sender, EventArgs e)
{
if (i == )
{
rollTimer.Stop();
NumTimer.Stop();
}
else
{
sbd.Stop();
sbd.Children.Clear();
DoubleAnimation da = new DoubleAnimation();
da.From = ;
da.To = ;
da.Duration = new Duration(TimeSpan.FromSeconds(0.5));
Storyboard.SetTarget(da, ellipse); Storyboard.SetTargetProperty(da, new PropertyPath(Canvas.TopProperty));
sbd.FillBehavior = FillBehavior.HoldEnd;
sbd.Children.Add(da);
sbd.Children.Add(da11);
sbd.Begin();
}
}
实现左右移动的关键代码是:
能实现上下移动,左右移动也就同理了,只要改变一下 Storyboard.SetTargetProperty(da11, new PropertyPath(Canvas.TopProperty)); 这个代码,让Canvas.TopProperty 变为Canvas.LeftProperty即可。
Storyboard sbd = new Storyboard();
DoubleAnimation da = new DoubleAnimation();
da.From = ;
da.To = ;
da.Duration = new Duration(TimeSpan.FromSeconds());
Storyboard.SetTarget(da, ellipse5);
Storyboard.SetTargetProperty(da, new PropertyPath (Canvas.LeftProperty));
sbd.Children.Add(da);
实现旋转的关键代码是:
首先看下我xaml的布局,对球是这样设计的
<Ellipse x:Name="ellipse5" Canvas.Top="" Canvas.Left="" Width="" Height="" Stroke="Black" StrokeThickness="" >
<Ellipse.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="" Color="#E2E0C8" />
<GradientStop Offset="" Color="#FFFF00" />
<GradientStop Offset="0.4" Color="#978B00"/>
<GradientStop Offset="0.6" Color="#686001"/>
<GradientStop Offset="0.8" Color="#978B00"/>
</LinearGradientBrush>
</Ellipse.Fill>
<Ellipse.RenderTransform>
<RotateTransform Angle="" CenterX="" CenterY=""></RotateTransform>
</Ellipse.RenderTransform>
</Ellipse>
这一行代码 <RotateTransform Angle="0" CenterX="25" CenterY="25"></RotateTransform> 是设置球的旋转中心,旋转中心的设置为 CenterX=25,CenterY=25 而这个的设置又是球的Width="55" Height="55",照理来说应该是其一半,所以其实25是有点不精确的 \(^o^)/~
后台控制其旋转的代码为:
DoubleAnimation da11 = new DoubleAnimation();
da11.From = ;
da11.To = ;
da11.Duration = new Duration(TimeSpan.FromSeconds());
Storyboard.SetTarget(da11, ellipse5);
Storyboard.SetTargetProperty(da11, new PropertyPath("(Ellipse.RenderTransform).(RotateTransform.Angle)"));
注意不同的点: From=0,To=360 和 Storyboard.SetTargetProperty(da11, new PropertyPath("(Ellipse.RenderTransform).(RotateTransform.Angle)")); 这样也就控制了其角度从0度旋转到360度,看起来也就像是圆的旋转咯。
最后效果图:
虽然看不出动画效果,嗯,我是想纪念下我实现了我想要的效果,O(∩_∩)O哈哈~
silverlight中 Storyboard(动画)的使用,实现球的上下循环移动,左右移动,及旋转功能的更多相关文章
- Silverlight & Blend动画设计系列十:Silverlight中的坐标系统(Coordinate System)与向量(Vector)运动
如果我们习惯于数学坐标系,那么对于Silverlight中的坐标系可能会有些不习惯.因为在Silverlight中的坐标系与Flash中的坐标系一样,一切都的颠倒的.在标准的数学坐标系中,X轴表示水平 ...
- Silverlight中动画的性能浅析
Silverlight中提供了StoryBoard实现动画,可是StoryBoard的性能实在不敢恭维,特别是动画很大的时候,计算机的CPU和内存的狂增,如此一来性能实在太差,在默认的动画效果中动画实 ...
- Silverlight中的拖拽实现的图片上传
原文 http://blog.csdn.net/dujingjing1230/article/details/5443003 在Silverlight中因为可以直接从系统的文件夹里面拖出来一个文件直接 ...
- WPF中的动画——(三)时间线(TimeLine)
WPF中的动画——(三)时间线(TimeLine) 时间线(TimeLine)表示时间段. 它提供的属性可以让控制该时间段的长度.开始时间.重复次数.该时间段内时间进度的快慢等等.在WPF中内置了如下 ...
- Silverlight中图片显示
silverlight中显示一个图片有很多的中方法,xaml中的image控件或者自定编写程序来生成image控件. silverlight中显示的图片只能是Bitmap, JPG, PNG(64位颜 ...
- Wpf(Storyboard)动画简单实例
原文:Wpf(Storyboard)动画简单实例 动画的三种变换方式 RotateTransform:旋转变换变化值:CenterX围绕转的圆心横坐标 CenterY纵坐标 Angle旋转角度(角度正 ...
- 【WPF学习笔记】[转]周银辉之WPF中的动画 && 晓风影天之wpf动画——new PropertyPath属性链
(一)WPF中的动画 动画无疑是WPF中最吸引人的特色之一,其可以像Flash一样平滑地播放并与程序逻辑进行很好的交互.这里我们讨论一下故事板. 在WPF中我们采用Storyboard(故事板)的方式 ...
- 一步一步学Silverlight 2系列(22):在Silverlight中如何用JavaScript调用.NET代码
概述 Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#, IronRuby, ...
- 一步一步学Silverlight 2系列(21):如何在Silverlight中调用JavaScript
概述 Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#, IronRuby, ...
随机推荐
- Bootstrap的安装
在了解了HTML和CSS.JS之后,我咨询了之前做过这一块的学长,得知了Bootstrap的存在. Bootstrap (Web前端CSS框架) Bootstrap,来自 Twitter,是目前很受欢 ...
- ‘ant-version’不是内部或外部命令,也不是可运行的程序
下载apache-ant-1.9.2-bin.zip后,解压目录:F:\selenium\apache-ant-1.9.2 配置环境变量,在“我的电脑->属性->高级->环境变量 - ...
- 【转】Wince中文乱码解决方法
http://www.cnblogs.com/we-hjb/archive/2008/11/27/1342651.html 如果WinCE的默认语言是英语,也没有支持MUI的话,很多中文的应用程序就不 ...
- Mysql创建新用户后无法登录,提示 Access denied for user 'username'@'localhost' (using password: YES)
MySQL创建新用户后无法登录,提示 Access denied for user 'username'@'localhost' (using password: YES) ,多半是因为存在匿名用户, ...
- C++模板&泛型编程
---恢复内容开始--- 一.泛型编程 定义:编写与类型无关的逻辑代码,是代码复用的一种手段.模板是泛型编程的基础 模板分为:函数模板和类模板 函数模板:代表了一个函数家族,该函数与类型无关,在使用时 ...
- MyRocks简介
RocksDB是facebook基于LevelDB实现的,目前为facebook内部大量业务提供服务.经过facebook大量工作,将RocksDB为MySQL的一个存储引擎移植到MySQL,称之为M ...
- C# - JSON详解
最近在做微信开发时用到了一些json的问题,就是把微信返回回来的一些json数据做一些处理,但是之前json掌握的不好,浪费了好多时间在查找一些json有关的转换问题,我所知道的方法只有把json序列 ...
- AlwaysOn 同步时间的测试
背景 <SQL Server 2012实施与管理实战指南>中指AlwaysON同步过程如下: 任何一个SQL Server里都有个叫Log Writer的线程,当任何一个SQL用户提交一个 ...
- Java设计模式2:简单工厂模式
简单工厂模式 简单工厂模式是类的创建模式,又叫做静态工厂方法模式.简单工厂模式由一个工厂对象决定生产出哪一种产品类的实例. 为什么要使用简单工厂模式 原因很简单:解耦. A对象如果要调用B对象,最简单 ...
- 设计模式之美:Product Trader(操盘手)
索引 意图 结构 参与者 适用性 效果 相关模式 实现 实现方式(一):Product Trader 的示例实现. 意图 使客户程序可以通过命名抽象超类和给定规约来创建对象. Product Trad ...