首先準(zhǔn)備好三張廣告圖像，見(jiàn)圖82。

（圖82）

第一步：在【部件】面板中拖放一個(gè)圖像部件到設(shè)計(jì)區(qū)域，雙擊該部件導(dǎo)入廣告圖 1，并將其尺寸設(shè)置為400×300像素，然后右鍵單擊該圖像部件，在彈出的關(guān)聯(lián)菜單中選擇【轉(zhuǎn)換為動(dòng)態(tài)面板】，見(jiàn)圖83。

（圖83）

第二步：在右側(cè)的部件【屬性】面板中，給動(dòng)態(tài)面板部件命名為【輪播廣告】，在學(xué)習(xí)過(guò)程中要養(yǎng)成給部件命名的好習(xí)慣。然后雙擊動(dòng)態(tài)面板，在彈出的【動(dòng)態(tài)面板狀態(tài)管理】對(duì)話框中，單擊【State1】，然后單擊【快速?gòu)?fù)制】圖標(biāo)，快速?gòu)?fù)制兩份動(dòng)態(tài)面板狀態(tài)【Stete2】和【State3】（注意：使用快速?gòu)?fù)制功能會(huì)同時(shí)復(fù)制【State1】中的內(nèi)容，也就是那張廣告圖1），見(jiàn)圖84，單擊【確定】按鈕關(guān)閉【動(dòng)態(tài)面板狀態(tài)管理】。

第三步：在右側(cè)的【Outline】概要面板中，可以看到輪播廣告這個(gè)動(dòng)態(tài)面板中的三個(gè)不同的狀態(tài)以及其中的內(nèi)容，見(jiàn)圖85?，F(xiàn)在三個(gè)狀態(tài)中的內(nèi)容都是一樣的，分別雙擊【State2】然后再次雙擊【State2】中的圖像替換成廣告圖2，同樣的方法替換廣告圖3，替換后見(jiàn)圖86。

（圖84）

（圖85）

（圖86）

第四步：通常網(wǎng)站建設(shè)小編認(rèn)為我們見(jiàn)到的圖像輪播廣告都是在打開(kāi)頁(yè)面后等待幾秒鐘開(kāi)始輪播的，所以這里我們使用【頁(yè)面載入時(shí)】事件來(lái)實(shí)現(xiàn)（你也可以使用動(dòng)態(tài)面板部件的【載入時(shí)】事件來(lái)實(shí)現(xiàn)。隨著學(xué)習(xí)的深入你會(huì)發(fā)現(xiàn)，很多效果的實(shí)現(xiàn)方法都不止一種）?，F(xiàn)在回到Index頁(yè)面并單擊頁(yè)面空白處，在右側(cè)的【頁(yè)面屬性】面板中雙擊【頁(yè)面載入時(shí)】事件，見(jiàn)圖87，然后在彈出的【用例編輯器】窗口頂部給用例命名為【圖像輪播】，在左側(cè)的動(dòng)作列表中新增【設(shè)置面板狀態(tài)】動(dòng)作，在右側(cè)的配置面板中勾選【輪播廣告】動(dòng)態(tài)面板，并設(shè)置【選擇狀態(tài)】為【下一個(gè)】。勾選【向前循環(huán)】，勾選【循環(huán)間隔】并設(shè)置間隔時(shí)間為【3000】毫秒，勾選【第一個(gè)狀態(tài)延遲 3000毫秒】（這個(gè)選項(xiàng)的意思是，當(dāng)頁(yè)面打開(kāi)時(shí)等待3秒鐘之后再開(kāi)始輪播）。設(shè)置【進(jìn)入/退出動(dòng)畫(huà)】為【淡入淡出】效果，動(dòng)畫(huà)時(shí)間為【500】毫秒，見(jiàn)圖88，單擊【確定】按鈕關(guān)閉【用例編輯器】。

第五步：在頂部的工具欄中單擊【預(yù)覽】按鈕，或者按下快捷鍵F5/Shift+Command+P，快速預(yù)覽交互效果。

（圖87）

（圖88）