怎么在Axure中，完成跑馬燈廣告，以及彈幕效果呢？一起來看看~

方案1：所需元件：1個動態(tài)面板內(nèi)含1個文本，動態(tài)面板控制文本顯示區(qū)域

（動態(tài)面板就是一個xy坐標軸，00代表與之接觸初始位，正值時元件顯示為負則隱藏。）

如何實現(xiàn)使文字從左到右移動？第1時間肯定想到的是移動，那讓這個移動那循環(huán)起來就是跑馬燈廣告。

條件設置：

• 添加頁面[載入時]用例，移動文本并設置事件循環(huán)；
• 為每個文字添加[移動時]用例，設置完全移出時回到初始值。

操作步驟：

第1步，在頁面上添加[載入時用例]，用例設置如下。因為是往左移所以(-4,0),如果是往上移則是(,0-4)，往哪邊移則哪些設為負數(shù)，具體值可以調(diào)整。

第2步，如上一直往左移，但是當文本完全移出時則一直顯示空白。所以我們還得設置當文本移動時回歸初始始位置。在文本部件添加[移出時]用例，設置如下。

文字完全移出有多種表達方式：

1）用位置標識，不在面板可顯示區(qū)域內(nèi)；

2）用跟目標面板有沒有接觸，元件范圍表示，沒有接觸即代表完全移出。

以下為了方便我直接用數(shù)字表示，-200這個值應該是該文本部件的1/2左右，我為了方便直接顯示具體數(shù)值，也可以用函數(shù)LVAR1.width/2表示。如果發(fā)現(xiàn)不夠完美，可以再調(diào)整數(shù)值(最后一半文字移動時因為沒有內(nèi)容往前補充所以會有一段空白，所以需要修改值)。

按這種方式可以實現(xiàn)往左/右/上/下移動，操作邏輯一致。 如果是多個文本一起移動，就需要添加多個文本并需要在每個文本上加移出時用例，操作繁瑣。有沒有簡單的模板可用了？把文本部件轉(zhuǎn)化為動態(tài)面板就可以解決重復操作問題了。

點擊預覽

方案2：所需元件：1個動態(tài)面板內(nèi)含2個文本面板

條件設置：

• 添加頁面[載入時]用例，移動文本面板并設置事件循環(huán)；
• 為每個文本面板添加[移動時]用例，設置完全移出時回到初始值。

操作步驟：

第1步：頁面載入時移動多文本動態(tài)面板，并設置等待后重新載入該事件實現(xiàn)循環(huán)。

第2步：為每個文本動態(tài)面板添加[移動時]用例，設置如下。元件的左邊位置小于元件的寬度，代表元件完全移出外部的顯示區(qū)域( (0.0)是該文本移動到起始位置，如果想一段間隙顯示完后出現(xiàn)一小段空屏，可調(diào)整x值，如果設置x值設為該部件寬度，則會達到一個顯示完一屏再顯示第2屏的感覺。

建議以上用動態(tài)面板做，做成元件后可以直接復用，跑馬燈、滾屏消息、彈幕等都可以應用。 再以上基礎上一般的廣告會有一種效果，鼠標移入時會暫停，點擊后可跳轉(zhuǎn)。

點擊預覽

鼠標移入時暫停播放，移出時自動播放。

所需元件：1個動態(tài)面板（控制文本顯示區(qū)域），內(nèi)含1個文字動態(tài)面板。

條件設置：

1. 引入全局變量賦1，控制是否暫停；（新增） 統(tǒng)一鼠標移入為0，移出為1。
2. 添加頁面[載入時]用例并設置載入循環(huán)(同上)，條件：變量值和文本面板是否全部移出。
3. 調(diào)置動態(tài)面板移出時用例，將該元件移至最后。
4. 為每個文字添加[移入移出]用例，并賦變量值；設置單擊時跳轉(zhuǎn)鏈接（新增）

操作步驟：

第1步：新建全局變量并賦值，也可用局部變量。

第2步：頁面載入時移動多文本動態(tài)面板，設置變量值為1且未完全移出時移動文字動態(tài)面板，如下。 我這個axure版本有問題條件設置時不能設置&語句，注意看第2種情形是或者。

第3步：為每個文字動態(tài)面板設置[移動時]用例，如下。

第4步：為單獨每個文字部件單獨添加用例。

點擊預覽

本文由 @流素 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議