點擊按鈕出彈窗
點擊按鈕出彈窗勒奇,是PC或APP上最基本的交互。我們利用Axure可以快速設(shè)計實現(xiàn)該交互员串。
具體操作:
1. 輸入好需要點擊按鈕后跳出彈窗的頁面盔腔;
2. 拖動控件“動態(tài)面板”至頁面空白處,點擊右鍵將動態(tài)面板“設(shè)為隱藏”琳拨;
3. 雙擊“動態(tài)面板”瞭恰,設(shè)置該面板名稱:彈窗,雙擊State1進(jìn)入面板編輯頁面狱庇;
4. 在面板編輯頁面配置具體彈窗內(nèi)容(注意將彈窗內(nèi)容配置在輸入框內(nèi))惊畏;
5. 在第一步配好的頁面按鈕處,添加交互用例——鼠標(biāo)單擊時顯示動態(tài)面板:彈窗密任;
實現(xiàn)效果:點擊按鈕颜启,跳出彈窗。
6. 在動態(tài)面板“確認(rèn)”按鈕處浪讳,添加交互用例——鼠標(biāo)單擊時隱藏動態(tài)面板:彈窗缰盏;
實現(xiàn)效果:點擊確認(rèn)按鈕,彈窗關(guān)閉淹遵。
7. 在動態(tài)面板“取消”按鈕處口猜,添加交互用例——鼠標(biāo)單擊時隱藏動態(tài)面板:彈窗;
實現(xiàn)效果:點擊取消按鈕透揣,彈窗關(guān)閉济炎。
6. 最后一步,點擊index中動態(tài)面板淌实,美化動態(tài)面板冻辩,置于瀏覽器中間位置猖腕;
整體效果: