ArkUI学习-Swiper（轮播图）

1、简介：

Swiper组件提供滑动轮播显示的能力。Swiper本身是一个容器组件，当设置了多个子组件后，可以对这些子组件进行轮播显示。通常，在一些应用首页显示推荐的内容时，需要用到轮播显示的能力。

官方介绍Swiper：

Swiper(){
  Image($r("app.media.bg_001"))
  Image($r("app.media.bg_002"))
  Image($r("app.media.bg_003"))
  Image($r("app.media.bg_004"))
}
.width('100%')
.height(200)
.loop(true) //开启循环
.autoPlay(true)//自动播放
.interval(5000)//自动播放间隔
.vertical(false) //横向

2、自定义小圆点

Swiper(){
  Image($r("app.media.bg_001"))
  Image($r("app.media.bg_002"))
  Image($r("app.media.bg_003"))
  Image($r("app.media.bg_004"))
}
.width('100%')
.height(200)
.loop(true) //开启循环
.autoPlay(true)//自动播放
.interval(5000)//自动播放间隔
.vertical(false) //横向
//.indicator(false)
.indicator(//定制小圆点
  Indicator.dot()
    .itemWidth(20)
    .itemHeight(20)
    .color(Color.Black)
    .selectedItemWidth(25)
    .selectedItemHeight(25)
    .selectedColor(Color.Red)
)