Axure如何實現圖片輪播效果!三分鍾搞定!


Axure在繪制高保真原型圖時如何實現圖片輪播呢?

效果圖展示 https://e2qsae.axshare.com/#g=1&p=vcg%E5%AE%98%E7%BD%91

// 注 意:這個效果圖是上一篇博客的成品效果圖DAY2_前端入門准備篇(二)https://blog.csdn.net/Kyrenee/article/details/108991467里面涵蓋了圖片輪播。

方法一:

1、首先打開Axure軟件,新建一個頁面,拖放一個動態面板(大小必須大於等於你要制作的輪播圖片的大小)。成果如下圖所示:

在這里插入圖片描述

2、雙擊動態面板區域,彈出面板狀態管理框,添加動態面板狀態(面板狀態個數由自己的輪播圖片的張數決定)本文以4張圖片為例,點擊確定,則該動態面板獲取4個不同的狀態。

在這里插入圖片描述

3、雙擊動態面板的某一個狀態,進入該狀態的編輯區域,接着在該區域內放置需要輪播的圖片(大小必須小於等於動態面板的大小,超出動態面板的邊界不會被顯示出來)。其余三個狀態也是一樣的操作,在動態面板內添加圖片。效果展示如下:

在這里插入圖片描述
在這里插入圖片描述
在這里插入圖片描述

在這里插入圖片描述
在這里插入圖片描述
在這里插入圖片描述

4、點擊頁面空白區域(不要選中任何原件),為該頁面添加用例,選中頁面載入時,設置如下圖所示的動作,點擊確定進行保存。

在這里插入圖片描述

5、點擊預覽,在瀏覽器中查看效果即可。

在這里插入圖片描述
如果對你解決輪播效果有用的話,記得點贊喲~ 有什么不對的歡迎評論交流~嘻嘻嘻嘻嘻


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM