圖片輪播是各大網站常常見到的形式，文章帶我們學習了如何用Axure實現圖片輪播功能，一起來看看~

雙11剛過沒多久，大家是否都參加了2000+億的大項目呀？剁手的時候，有沒有被各大電商平臺的首頁圖片輪播吸引住了呢？是不是原本不想剁手，結果只因一個對眼就無法自拔了呢？

圖片輪播是各大電商平臺常見的套路，輪播中的每個圖片都相當有吸引力的呀。下面呢，我們就來說說首頁圖片輪播用Axure怎么實現？

還是跟以往的套路一樣，下面從3個方面來展開。

01 需求分析

我們本次的需求是圖片輪播，什么是圖片輪播呢？簡單來說，就是一套圖片以一定時間間隔自動循環播放，同時用戶也可以選擇圖片實現點播的效果。

其實再深入一點，我們會發現一張圖片的顯示與否也是有條件的。從這個角度來看，我們會想到Axure中的動態面板。

沒錯，今天的主角還是它。

02 Axure關鍵點分析

這個案例的關鍵點主要有3個：

1）動態面板的不同狀態及對應的圖片設置，這個相對比較容易

2）設置小圓點，實現點擊小圓點跳轉至對應的圖片

所有小圓點需要設置為只能單個選中，這個通過設置選項組名稱實現

設置點擊小圓點的交互，如點擊第一個小圓點則顯示第一張圖片，以此類推。

3）設置動態面板的交互效果

交互時間點為狀態改變時，“向后循環”需要勾選上，還可以根據實際設置間隔時間以及圖片切換的方向等

03 效果展示

我們來看一下最終效果吧，網址為：https://wxnac1.axshare.com/

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

題圖來自Unsplash，基于CC0協議