原文:零元学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. linux mysql 卸载,安装,測试全过程

    Mysql卸载 yum remove mysql mysql-server mysql-libs compat-mysql51 rm -rf /var/lib/mysql rm /etc/my.cnf ...

  2. windows server 安装 mysql – 畅玩Coding

    原文:windows server 安装 mysql – 畅玩Coding windows server 安装 mysql 2018年12月11日2018年12月11日 admin 下载:https: ...

  3. Net锁

    Net分布式锁的实现 序言 我晚上有在公司多呆会儿的习惯,所以很多晚上我都是最后一个离开公司的.当然也有一些同事,跟我一样喜欢在公司多搞会儿.这篇文章就要从,去年年末一个多搞会的晚上说起,那是一个夜黑 ...

  4. WPF 实现繁花曲线

    原文:WPF 实现繁花曲线 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/nihang1234/article/details/83346919 X ...

  5. 简单使用.net core 自带的DI

    1.创建一个web api项目 2.在项目中创建一个接口类 namespace LearnCore.CoreDI { public interface ILearnDI { string GetNam ...

  6. C++于public、protected和private说明(From MSDN)

    public(C# 參考): https://msdn.microsoft.com/zh-cn/library/yzh058ae.aspx protected(C# 參考):https://msdn. ...

  7. 改变TLabel字型和颜色(Styled特性高于自身特性,李维的博客)

    最近收到几位使用者的来信都是和如何改变FireMonkey TLabel组件的字型和颜色, 这几位使用者都是直接改变TextSettings特性中的Font子特性但却无法改变字型和颜色, 因此来信询问 ...

  8. 认识ADO.net

    这篇文章源自对刘皓的文章的学习 ADO.NET入门教程(一) 初识ADO.NET 这篇文章非常好,用一张图,以及对图的解释介绍了ado.net组件 ado.net内部主要有两个部分 dataProvi ...

  9. hadoop学习笔记(四)——eclipse+maven+hadoop2.5.2源代码

    Eclipse同maven进口hadoop源代码 1)  安装和配置maven环境变量 M2_HOME: D:\profession\hadoop\apache-maven-3.3.3 PATH: % ...

  10. Android学习-- 基于位置的服务 LBS(基于百度地图Android SDK)--定位SDK

    原文:Android学习-- 基于位置的服务 LBS(基于百度地图Android SDK)--定位SDK 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.ne ...