輪播的實現(xiàn)

輪播的實現(xiàn)

輪播的實現(xiàn)原理是怎樣的？如果讓你來實現(xiàn)，你會抽象出哪些函數(shù)(or接口)供使用？（比如 play()）
  • 輪播的實現(xiàn)原理
    1. 輪播中容器中的圖片橫向水平排列
    2. 將要輪播的圖片的第一個圖片和最后一個圖片分別克隆到 尾部和頭部，當(dāng)圖片輪播到克隆圖片時， 直接立刻跳轉(zhuǎn)到對應(yīng)的真實的圖片上
    3. 圖片滑動相對于父容器移動
    4. 通過 index對應(yīng)的切換欄的大小與輪播圖片對應(yīng)的pageIndex 作比較，決定圖片向左向右滑動，滑動時，輪播跳轉(zhuǎn)（n個圖片與n個切換框?qū)?yīng)切換）
  • 接口
playNext()   //右滑，圖片偏移切換
playPre() //當(dāng)點擊左滑按鈕時，圖片偏移切換
實現(xiàn)視頻中的左右滾動無限循環(huán)輪播效果

預(yù)覽

實現(xiàn)一個漸變輪播效果, 效果范例

預(yù)覽

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 1： 輪播的實現(xiàn)原理是怎樣的？如果讓你來實現(xiàn)，你會抽象出哪些函數(shù)(or接口)供使用？（比如 play()） 一種左...
    曉風(fēng)殘月1994閱讀 441評論 0贊 0
  • 題目1： 輪播的實現(xiàn)原理是怎樣的？如果讓你來實現(xiàn)，你會抽象出哪些函數(shù)(or接口)供使用？（比如 play()） 原...
    魔王卡卡閱讀 169評論 0贊 0
  • 題目1： 輪播的實現(xiàn)原理是怎樣的？如果讓你來實現(xiàn)，你會抽象出哪些函數(shù)(or接口)供使用？（比如 play()） 左...
    cctosuper閱讀 263評論 0贊 0
  • 題目1： 輪播的實現(xiàn)原理是怎樣的？如果讓你來實現(xiàn)，你會抽象出哪些函數(shù)(or接口)供使用？（比如 play()） 左...
    yuhuan121閱讀 263評論 0贊 0
  • 輪播的實現(xiàn)原理是怎樣的？如果讓你來實現(xiàn)，你會抽象出哪些函數(shù)(or接口)供使用？（比如 play()） 輪播的實現(xiàn)原...
    Jeff12138閱讀 317評論 0贊 0