原文:零元学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. oracle11g 在azure云中使用rman进行实例迁移

    1,開始备份 备份脚本rman_full_backup.sh内容例如以下: #!/bin/sh export DATE=`date +%F` export BACK_DIR='/backupdisk/ ...

  2. UIApplicationsharedApplication的详解

    iPhone应用程序是由主函数main启动,它负责调用UIApplicationMain函数,该函数的形式如下所示: int UIApplicationMain ( int argc, char *a ...

  3. CF337D Book of Evil - 树型dp

    传送门 题目大意: 一棵树上有一个特殊点,特殊点可以影响距离小于等于d的点,现在告诉被影响的点,问特殊点可以在几个点上. 题目分析: 对题意进行转化:求到被影响点的最大距离小于等于d的点数目. 然后就 ...

  4. 学习OpenCV研究报告指出系列(二)源代码被编译并配有实例project

    下载并安装CMake3.0.1       要自己编译OpenCV2.4.9的源代码.首先.必须下载编译工具,使用的比較多的编译工具是CMake. 以下摘录一段关于CMake的介绍: CMake是一个 ...

  5. 网络编程C#

    C#网络程序设计(1)网络编程常识与C#常用特性     网络程序设计能够帮我们了解联网应用的底层通信原理!     (1)网络编程常识: 1)什么是网络编程 只有主要实现进程(线程)相互通信和基本的 ...

  6. 【codeforces 534B】Covered Path

    [题目链接]:http://codeforces.com/contest/534/problem/B [题意] 你在t秒内可以将车的速度任意增加减少绝对值不超过d; 然后要求在一开始车速为v1,t秒之 ...

  7. 【codeforces 534A】Exam

    [题目链接]:http://codeforces.com/contest/534/problem/A [题意] 给你n个人,要求任意两个编号相邻的人不能相邻; 让你安排座位方案,使得最多人的可以入座 ...

  8. handsontable前端excel学习笔记

    暂时没有好的中文资料,大概找了三遍随便看看,之后重点研究其github 1.Handsontable 学习笔记-Methods 2. Handsontable通用方法 3.handsontable的核 ...

  9. 发布与订阅SQLServer

    SQLServer 中发布与订阅 在对数据库做迁移的时候,会有很多方法,用存储过程,job,也可以用开源工具lettle,那么今天这些天变接触到了一种新的方法,就是SqlServer中自带的发布与订阅 ...

  10. HDU1164_Eddy's research I【Miller Rabin素数测试】【Pollar Rho整数分解】

    Eddy's research I Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others ...