零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画

简介: 原文:零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画 零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画...
原文: 零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画

零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画

?

有位网友jiokoi留言问我:是否可以用StoryBoard制作出一个圆从0度到360度顺时针扇形的出现

?

我做了一个简单的范例,顺便分享给大家~

?

这是最後的成果:

看起来有雷达扫描装置的fu~XD(误)

很抱歉,阁下使用的浏览器并不支援 IFrame,不能正常浏览我的网页

?

?

直接开始吧!

?

01

拉进一个图形->Pie

Pie通常会应用在圆饼图上,但今天我们要拿来做动画

image

?

02

Shapes->置入一个Pie後,我们来看一下Properties->Appearance

预设的Pie,StartAngle为90度,而EndAngle为360度

(12点钟位置为零度,顺时针转一圈,所以我们可以知道,90度为三点钟位置)

image

?

03

调整StartAngle以及EndAngle皆为0度

image

?

04

建立一个新的Storyboard

image

?

05

使时间轴在2秒时,调整EndAngle360度

image

?

并且调整以下设定:

(A)点选A处,会出现Common Properties相关设定

(B)勾选AutoReverse则的动画播放完後会自动到转带回到原点

image

?

(C)RepeatBehavior->Forever,使动画不停的播放

image

?

06

最後,离开动画编辑模式,并置入一个ControlStoryBoradAction

image

?

设定动画触发条件Properties->Trigger->EventName->Loaded

image

?

完成!

想看更多的动画效果,可以参考Chapter 6 、Chapter 17、Chapter 18、Chapter 27

或是点选左边的动画分类。

?

附上本篇范例:

?

?

(若有任何错误的地方,请各位前辈或同好能不吝指教,小女子都会虚心接受;若是你喜欢我的教学,请给我点鼓励,谢谢。)

?

一步一步迈向HIE之路

 

喜欢我文章请推我一下或给我个回应,你的鼓励会给我无限的动力喔!

若是您有其他问题或是特别需要,请在文章回应处留言,我会尽快回覆您

 

 

目录
相关文章
|
C#
在Expression Blend中制作侧面为梯形的类棱柱体
原文:在Expression Blend中制作侧面为梯形的类棱柱体 在上一篇“在WPF设计工具Blend2中制作立方体图片效果”( http://blog.csdn.net/johnsuna/archive/2007/08/10/1736000.aspx )中,演示了如何制作立方体形图片效果;本篇则制作侧面为梯形的类棱柱体形图片。
1034 0
|
C#
在Microsoft Expression Blend 2 中绘制圆角矩形按钮
原文:在Microsoft Expression Blend 2 中绘制圆角矩形按钮 /* 声明:转载请保留此信息:http://www.BrawDraw.com, http://www.ZPXP.com 版权所有:a3news(AT)hotmail.com */(1)打开Blend 2,新建一个工程名称为:LinearGradientButton。
1175 0
|
前端开发 数据格式 XML
Expression Design与Blend制作滚动的小球动画教程
原文:Expression Design与Blend制作滚动的小球动画教程 一,开发工具 Microsoft Expression Design & Blend 4.0 (3.0亦可)。 这两款软件可以在微软Expression官方网站上下载:http://expression.
1086 0
|
Web App开发 前端开发 容器
零元学Expression Blend 4 - Chapter 9 用实例了解布局容器系列-「Canvas」
原文:零元学Expression Blend 4 - Chapter 9 用实例了解布局容器系列-「Canvas」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里被我称为忠於原味的傻大姊-「Canvas」。
1254 0
|
容器 前端开发
零元学Expression Blend 4 - Chapter 12 用实例了解布局容器系列-「Viewbox」
原文:零元学Expression Blend 4 - Chapter 12 用实例了解布局容器系列-「Viewbox」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的-「Viewbox」; 以及加码赠送安装扩充元件-「Silverlight Toolkit」。
1596 0
|
内存技术
零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上)
原文:零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上) 一直以来都有人拿Flash的动画问我Blend可不...
1368 0
|
内存技术
零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下)
原文:零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下) 抱歉久等了!!!! 终於到了动画MenuBar的...
1372 0
|
内存技术
零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中)
原文:零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中) 我们接着进行动画MenuBar的制作 接续着上一...
1403 0
|
容器
零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」
原文:零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」 将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的专情王子-「Border」。
1265 0
|
前端开发 容器
零元学Expression Blend 4 - Chapter 34 啊~!!我不要毛毛的感觉!-使用布局修整「UseLayoutRounding」
原文:零元学Expression Blend 4 - Chapter 34 啊~!!我不要毛毛的感觉!-使用布局修整「UseLayoutRounding」 本章将介绍UseLayoutRounding,中...
1263 0