一款精美的提交按钮效果制作

　　效果演示

　　效果分解：白色按钮→绿色按钮→圆环进度条→提交完毕

　　需要使用Axure8才可以做出此效果，想学习的记得下载Axure8版本。

　　教学重点

　　1、环形进度条动画

　　2、Axure8多动画同时进行功能的应用

　　静态元素绘制

　　State1：白色按钮，按钮上有绿色提交文字。

　　State2：绿色按钮，按钮上有白色提交文字。

　　State3：

　　绿色圆环、灰色圆环、中心白色原型、绿色圆(隐藏)是4个同心圆，其中中心白色原型比其他的小一圈，小的这一圈刚好把圆形的边线漏出来。

　　扇形环1-4为绿色边线，灰色扇形环为灰色边线，均为左上朝向的扇形，之前的中心白色原型就是为了挡住这些扇形的直角边，灰色扇形环是为了挡住其他绿色扇形环，使他们在没有旋转到90度之前得以隐藏。

　　对勾文字(隐藏)，在圆中心。

　　步骤分解

　　白色按钮→绿色按钮：按钮状态1<逐渐>变为状态2

　　按钮文本缩放效果：使用富文本，让文字的大小进行抖动以表示用户点击按钮的效果，给用户反馈。例：字号 50→45→40→50。

　　按钮变圆：使状态2的长条按钮变为正圆形状，由中心向外扩大。同时<逐渐>将状态2隐藏，将状态3显示。

　　环形进度条：将扇形环1、2、3、4分别顺时针旋转到90、180、270、360度，需要注意的是后者的时长必须大于前者，并且环形4分为2次专选，*次旋转到270度，然后将之前用于遮盖绿色扇形换的灰色扇形环进行隐藏，然后再让绿色扇形环4继续旋转到360度。

　　环形变按钮：<逐渐>显示绿色圆和对勾文字，并隐藏其他无用图形。使绿色圆环从<中心>由圆形变为长条形按钮，同时使绿色圆的尺寸也从<中心>由圆形变为长条形按钮。

　　贵阳航洋动漫职业学校是贵阳市教育局批准(贵阳市教[2010]15号)设立的跨专业(包含计算机平面设计、动漫与游戏制作、影像与影视技术、绘画等专业)、多门类、全日制中等专业职业学校，同时也是一所实行准军事化管理的学校。