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

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

?

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

?

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

?

这是最後的成果：

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

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

?

?

直接开始吧!

?

01

拉进一个图形->Pie

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

?

02

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

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

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

?

03

调整StartAngle以及EndAngle皆为0度

?

04

建立一个新的Storyboard

?

05

使时间轴在2秒时，调整EndAngle至360度

?

并且调整以下设定：

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

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

?

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

?

06

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

?

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

?

完成!

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

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

?

附上本篇范例：

?

?

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

?

一步一步迈向HIE之路

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

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

 

零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画的更多相关文章

  1. 零元学Expression Blend 4 - Chapter 46 三分钟快速充电-设定Margin的小撇步

    原文:零元学Expression Blend 4 - Chapter 46 三分钟快速充电-设定Margin的小撇步 如果需要经常的使用某一项工具,总会希望能够更快速的使用各项设定达到效果 今天要介绍 ...

  2. 零元学Expression Blend 4 - Chapter 6 如何置入Photoshop档案以及入门动画设计

    原文:零元学Expression Blend 4 - Chapter 6 如何置入Photoshop档案以及入门动画设计 本章将教大家如何把Photoshop档案置入Expression Blend ...

  3. 零元学Expression Blend 4 - Chapter 25 以Text相关功能就能简单做出具有设计感的登入画面

    原文:零元学Expression Blend 4 - Chapter 25 以Text相关功能就能简单做出具有设计感的登入画面 本章将交大家如何运用Blend 4 内的Text相关功能做出有设计感的登 ...

  4. 零元学Expression Blend 4 - Chapter 13 用实例了解布局容器系列-「Pathlistbox」I

    原文:零元学Expression Blend 4 - Chapter 13 用实例了解布局容器系列-「Pathlistbox」I 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局 ...

  5. 零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果

    原文:零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果 有网友问我如何在Blend内制作出倒影效果 我提供了 ...

  6. 零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下)

    原文:零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下) 抱歉久等了!!!! 终於到了动画MenuBar ...

  7. 零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗?

    原文:零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗? ListBox里的排列不是垂直就是水平,觉得这样的排列很枯燥乏味吗? 想要它变聪明吗? ...

  8. 零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中)

    原文:零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中) 我们接着进行动画MenuBar的制作 接续着上 ...

  9. 零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上)

    原文:零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上) 一直以来都有人拿Flash的动画问我Blend ...

随机推荐

  1. 热烈庆祝UE4完全免费Free---GitHub上源码的关联方法

    声明:所有权利保留. 转载请说明出处:http://blog.csdn.net/cartzhang/article/details/44040317 IF YOU LOVE SOMETHING, SE ...

  2. Oracle数据库中的几个名字及监听的配置问题

    学习数据库的时候,由于数据库只建了一个库,而且只是本机访问,所以没有对listener.ora与tnsname.ora这两个文件进行过多设置,但是实际中要区分客户端与服务器端,相互之间的访问就存在微妙 ...

  3. erlang OTP gen_server 图解分析

    http://www.hoterran.info/otp-gen_server-sourcecode 在阅读erlang的otp源码gen_server.erl的时候,一直想写点什么,用一种最好的方式 ...

  4. leetcode——Reverse Words in a String 旋转字符串中单词顺序（AC）

    题目例如以下: Given an input string, reverse the string word by word. For example, Given s = "the sky ...

  5. module.exports输出的属性被ES6如何引用的

    阮一峰的ES6教程里有讲: import 命令加载 CommonJS 模块 Node 采用 CommonJS 模块格式,模块的输出都定义在module.exports这个属性上面.在 Node 环境中 ...

  6. Linux核心设计依据（六）该块I/O一层

    块设备是能随机存取装置固定大小的数据表设备.如硬盘:字符设备(如串口和键盘)它是按照字符流进入有序进行.不同之处在于是否足够的随机存取数据--这时候,你可以随心所欲地从一个位置跳到访问设备和位置.复杂 ...

  7. jquery 源码学习（三）

    jQuery源码分析-03构造jQuery对象-源码结构和核心函数,需要的朋友可以参考下.   作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 毕竟 ...

  8. delphi 10.2 创建并使用资源文件（一共22种格式，RCDATA是自定义格式）

    windows支持以下资源格式: 1 2 //下面是 Windows 支持的资源格式: RT_CURSOR = MakeIntResource(1); RT_BITMAP = MakeIntResou ...

  9. C#后台调用前台js方法

    前台js方法(写在head标签之内) <script type="text/javascript" language="javascript"> f ...

  10. 深度神经网络（DNN）

    深度神经网络(DNN) 深度神经网络(Deep Neural Networks, 以下简称DNN)是深度学习的基础,而要理解DNN,首先我们要理解DNN模型,下面我们就对DNN的模型与前向传播算法做一 ...