動態(tài)面板：能夠在一個固定的區(qū)域切換顯示的內(nèi)容。能實現(xiàn)很多動態(tài)效果。

其本身是一個透明的元件。一個動態(tài)面板里有若干個【狀態(tài)】。“若動態(tài)面板是幻燈片的放映機，而狀態(tài)則是幻燈片。” 打開狀態(tài)的編輯界面，即可放置各種各樣的元件，組成內(nèi)容。

有幾種特性：容器、多狀態(tài)、拖動、循環(huán)、適應寬度、相對固定。

動態(tài)面板-容器：能夠讓裝載的內(nèi)容有統(tǒng)一的動作。實現(xiàn)多個元件的統(tǒng)一移動或現(xiàn)實隱藏。

場景一：登錄面板的燈箱效果

1. 準備工作

制作背景圖，預想點擊【下載PSD】則彈出【登錄面板】

背景

在空白處制作【登錄面板】，然后全選，右鍵-轉(zhuǎn)換為動態(tài)面板

轉(zhuǎn)換為動態(tài)面板

把【登錄面板】放在【背景圖】中間，并【置于頂層】，勾選【隱藏】

登錄面板

2. 熱區(qū)

把熱區(qū)拖到按鈕位置，并添加用例【鼠標單擊時】-【顯示】- 選擇LoginPanel -【燈箱效果】

添加用例

在動態(tài)面板LoginPanel中的關閉按鈕添加用例【鼠標單擊時】-【隱藏】- 選擇LoginPanel

關閉按鈕

如果想取消動態(tài)面板，想增加一些內(nèi)容的話，選中動態(tài)面板-右鍵-從首個狀態(tài)中脫離

image.png

其他

只要是多個元件需要統(tǒng)一顯示/隱藏，都能夠用動態(tài)面板/組合實現(xiàn)

場景二：水平菜單移入時彈出隱藏效果

1. 準備工作

制作一個“一級菜單”，下方放置數(shù)個矩形作為“二級菜單”，并全選【二級菜單】，右鍵，轉(zhuǎn)換為動態(tài)面板，命名為Submenu，狀態(tài)為隱藏

菜單

2. 添加用例

選中【一級菜單】，添加用例【鼠標移入時】-【顯示】- 選中動態(tài)面板Submenu -【彈出效果】

(彈出效果能夠?qū)崿F(xiàn)鼠標在一級菜單和二級菜單的范圍內(nèi)時，二級菜單保持顯示；當鼠標離開，二級菜單自動隱藏)

動畫可自由選擇

添加用例

場景三：垂直菜單單擊時展開，再次單擊時收起

1. 準備工作(與上述場景的準備工作一樣)

2. 添加用例

選中“一級菜單”，添加用例【鼠標單擊時】-【切換可見性】- 選中動態(tài)面板 - 勾選【推動/拉動元件】

(推動/拉動元件(以默認的向下為例)：展開二級菜單向下推動其他菜單，收起二級菜單拉起下方其他菜單的效果)

添加用例

3. 預覽

把做好的全選(包括“一級菜單”和“二級菜單”)并復制放在下方

復制

預覽，達到效果

預覽

3. 嘗試

同樣，我嘗試了使用兩個用例想要達到點擊一次【顯示】二級菜單，再點擊一次【隱藏】二級菜單的效果，如下圖

image.png

結(jié)果是不行的

預覽

或者一個用例里弄兩個動作，也是不行的。所以一定要用【切換可見性】

image.png

總結(jié)

以上是生活随笔為你收集整理的axure rp8 添加动态面板_Axure RP8 | 动态面板-容器的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。