Axure8實例之支付寶咻一咻
發(fā)布時間:2022-03-18 11:06 [ 我要自學網(wǎng)原創(chuàng) ] 發(fā)布人: 小劉2175 閱讀: 1131

3

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

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

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

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

那么,如何實現(xiàn)呢?

QQ截圖20160331002906

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

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

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

QQ截圖20160331003114

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

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

QQ截圖20160331003716

點擊按鈕的State1后,首先要將按鈕變?yōu)镾tate2,既按下后的狀態(tài)。

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

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

UI交互app及axure設計教程
我要自學網(wǎng)商城 ¥50 元
進入購買
文章評論
0 條評論 按熱度排序 按時間排序 /350
添加表情
遵守中華人民共和國的各項道德法規(guī),
承擔因您的行為而導致的法律責任,
本站有權保留或刪除有爭議評論。
參與本評論即表明您已經閱讀并接受
上述條款。
V
特惠充值
聯(lián)系客服
APP下載
官方微信
返回頂部
分類選擇:
電腦辦公 平面設計 室內設計 室外設計 機械設計 工業(yè)自動化 影視動畫 程序開發(fā) 網(wǎng)頁設計 會計課程 興趣成長 AIGC