一咪辱、輪播banner需求分析:
給3張圖片編號(hào),分別是1椎组,2油狂,3
1、每隔4s,播放順序: 1,2专筷,3弱贼,1,2磷蛹,3...
第i張播放i+1,若i+1=n+1,則改為1吮旅;相當(dāng)一直向左邊滑動(dòng)
同時(shí)對(duì)應(yīng)的點(diǎn)為選中狀態(tài)
2、1向左滑動(dòng)展示2味咳,向右滑動(dòng)展示3庇勃;
2向左滑動(dòng)展示3,向右滑動(dòng)展示1槽驶;
3向左滑動(dòng)展示1责嚷,向右滑動(dòng)展示2;
展示哪張掂铐,哪張對(duì)應(yīng)圓點(diǎn)為選中狀態(tài)罕拂。
3、推斷和總結(jié):設(shè)一共有n張圖全陨,編號(hào)1爆班,2,..., i, n;
1<i <n向左滑動(dòng)展示i+1,向右滑動(dòng)展示i-1;
i= 1向左滑動(dòng)展示1+1,向右滑動(dòng)展示n;
i= n向左滑動(dòng)展示1,向右滑動(dòng)展示n-1;
等價(jià)于:1<=i <=n 向左滑動(dòng)展示i+1, 向右滑動(dòng)展示i-1;
若i+1 = n+1則改為1烤镐;若i-1 = 0則改為n.
二蛋济、結(jié)構(gòu)組成:動(dòng)態(tài)面板(有三種狀態(tài),每種狀態(tài)為一張圖片炮叶,共三張)+三點(diǎn)圓組合
其中碗旅,圓組合放在動(dòng)態(tài)面板上。
三镜悉、交互事件
1 動(dòng)態(tài)面板處理手動(dòng)向左滑動(dòng)祟辟,向右滑動(dòng)的動(dòng)效
2 動(dòng)態(tài)面板處理載入時(shí)自動(dòng)輪播的動(dòng)效