#鸿蒙通关秘籍# 如何在HarmonyOS开发中使用Swiper组件实现自动轮播图？

  
Swiper( ){
   
//轮播内容
    
Image（...）
    
}
    
//给Swiper设置尺寸（否则只能根据内容自动拉伸）
    
.width('100%')
  
.height(100)

Swiper(){
    
  Text('1')
    
    .backgroundColor(Color.Black)
    
  Text('1')
    
    .backgroundColor(Color.Blue)
    
  Text('1')
    
    .backgroundColor(Color.Green)
    
}
    
.width('100%')
    
.height(100)
    
    
.loop(true)//开启循环，默认为true
    
    
.autoPlay(true)//开启自动轮播
    
    
.interval(5000)//5秒
    
    
.vertical(true)//纵向

//定制小圆点
    
// .indicator(false)//小圆点关掉
    
.indicator(
    
   Indicator.dot()
    
     .itemWidth(20)//小圆点宽度
    
     .itemHeight(20)//小圆点高度
    
     .color(Color.Blue)//默认颜色
    
     .selectedItemWidth(25)
    
     .selectedItemHeight(25)
    
     .selectedColor(Color.Black)
    
)

Swiper(){
    
   Image($r('app.media.ic_swiper_xmyp01'))
    
  Image($r('app.media.ic_swiper_xmyp02'))
    
  Image($r('app.media.ic_swiper_xmyp03'))
    
  Image($r('app.media.ic_swiper_xmyp04'))
    
}
    
    
.width('100%')
    
    
.aspectRatio(2.5)//等比例伸缩
    
.loop(true)//开启循环，默认为true
    
.autoPlay(true)//开启自动轮播
    
.interval(4000)//5秒
    
.vertical(false)//true纵向,false横向
    
//定制小圆点
    
// .indicator(false)//小圆点关掉
    
.indicator(
    
   Indicator.dot()
    
     .itemWidth(10)//小圆点宽度
    
     .selectedItemWidth(30)
    
     .selectedItemHeight(10)
    
     .selectedColor(Color.White)
    
)