axure商城

Axure8實例:支付寶咻一咻

3

其實,我覺得這真是個卵用沒有的東西,但是既然有人問了,那我就做一個,正好說下Axure8的優點。

這個需要用Axure8做,為什么呢?因為Axure8可以多個動作同時進行。

在Axure7里,如果想在向上移動的同時隱藏,是做不到的,只能是先移動到位了再隱藏。

而Axure8就可以!請大家認真觀察支付寶咻一咻,它的動畫是一個圓圈一邊放大一邊變透明。

那么,如何實現呢?

QQ截圖20160331002906

需要弄個動態面板,2個狀態,狀態1是點擊前的按鈕樣式,狀態2是點擊后的按鈕樣式。

然后再弄2個圓圈,放在按鈕下面。

因為圓圈的動畫是循環的,所以我們需要想一個循環的手段,本次我們使用“顯示時”來做循環,就是在圓圈完全透明后,隱藏圓圈,再顯示出來。再次顯示時,就會觸發“顯示時”這個交互,實現循環。

QQ截圖20160331003114

1、2兩個圓圈都是一樣的,所以1做完了之后直接復制粘貼到2里就可以了,那么不同的是什么呢?是它們會一先一后的播放這個動畫。

這時候,讓我們回到按鈕的State1上:

QQ截圖20160331003716

點擊按鈕的State1后,首先要將按鈕變為State2,既按下后的狀態。

然后要顯示圓圈1,等待1000毫秒后再顯示圓圈2即可。

在這里做顯示1、2的時,就會觸發圓圈1、2的顯示時交互,然后進入無盡の循環中。

最后的最后我想說,Axure緣分問答QQ群招收動腦子、有學習態度的成員,群號是542524521,歡迎加入~

給TA買糖
共{{data.count}}人
人已贊賞
案例教程

手機垂直劃屏效果從零學起(二)

2016-2-10 22:19:28

案例教程

創意實例:不偷看密碼的登錄頁面

2016-4-8 1:38:30

axure商城
0 條回復 A文章作者 M管理員
    暫無討論,說說你的看法吧
?
個人中心
購物車
優惠劵
今日簽到
有新私信 私信列表
搜索
俄罗斯videoxxxoo