中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

相信大家對看視頻時候的彈幕都不陌生，很多時候甚至會覺得彈幕比視頻本身還有趣，因此，現在大多數視頻網站或者視頻app都有這個彈幕功能。既然這個功能這么重要，那么在axure原型設計中又是怎么實現的呢？這篇文章就是教大家如何設計逼真的彈幕原型圖~~

第一步：放置相關控件

首先，擺好背景圖，其實就是一個手機外形圖和一張視頻截圖，《三生三世》最近這么火，那這里就截一張冪姐的照片當背景圖的。

然后，拖拉一個動態面板至視頻截圖的上方，并命名為“彈幕”。

最后，在“彈幕”動態面板的State1面板狀態中分兩行放置若干個文本標簽，文本標簽的字隨意，反正大家敲彈幕的時候也挺隨意的，文本標簽的字體顏色為白色和橙色隨機混雜。這里需要強調的是，所有的文本標簽的總體長度應該是動態面板長度的兩倍，其中前面一半組合成整體，并命名為“彈幕文字1”，后面一半組合成整體，并命名為“彈幕文字2”。

第二步：設置“彈幕”動態面板的載入時用例

首先，設置變量值OnLoadVariable為0；然后，設置顯示“彈幕”動態面板。

第三步：設置“彈幕”動態面板的顯示時用例

首先，添加一個顯示時用例，條件設置為OnLoadVariable等于0，為該用例添加如下6步動作：

1. “彈幕文字1”和“彈幕文字2”都在x軸方向向左相對移動“彈幕”動態面板寬度的距離，移動過程是線性的，用時10000毫秒；
2. 等待0毫秒（一定不能缺了這步，要不然循環不起來）；
3. 隱藏“彈幕”動態面板；
4. “彈幕文字1”在x軸方向向右相對移動2個“彈幕”動態面板寬度的距離；
5. 設置變量值OnLoadVariable為1；
6. 顯示“彈幕”動態面板；

然后，再添加一個顯示時用例，條件設置為OnLoadVariable等于1，為該用例添加如下6步動作：

1. “彈幕文字1”和“彈幕文字2”都在x軸方向向左相對移動“彈幕”動態面板寬度的距離，移動過程是線性的，用時10000毫秒；
2. 等待0毫秒（一定不能缺了這步，要不然循環不起來）；
3. 隱藏“彈幕”動態面板；
4. “彈幕文字2”在x軸方向向右相對移動2個“彈幕”動態面板寬度的距離；
5. 設置變量值OnLoadVariable為0；
6. 顯示“彈幕”動態面板；

搞定，點擊預覽就可以看到彈幕不斷地循環地飄過。

其實一開始我是打算用動態面板像輪播圖那樣實現的，但后來發現效果非常不理想，因為輪播圖在進入和退出的過程都有一個緩沖的過程，以導致循環不順暢，所以后來使用了如上方法來實現。

堅持分享axure原型設計小技巧，希望對大家有幫助。

效果圖：http://2x2mmk.axshare.com

作者：維度，個人博客：http://weidublog.com

本文由 @維度 原創發布于人人都是產品經理。未經許可，禁止轉載。