在HarmonyOS NEXT开发中定时轮播滚动的功能有没有用例代码？

Question

在HarmonyOS NEXT开发中定时轮播滚动的功能有没有用例代码？

Answer 1

解决方案如下：

@Entry 
@Component 
struct TextInputDemos { 
  private swiperController: SwiperController = new SwiperController(); 
  private controller: TextInputController = new TextInputController() 
  private textArr: String[] = ["早起晨练", "准备早餐", "阅读名著", "学习ArkTS", "看剧放松"] 
  @State shuRu: boolean = false; 
  @State text: string = ''; 
 
  build() { 
    Column({ space: 5 }) { 
      Stack() { 
        TextInput({ 
          text: $$this.text, placeholder: '', controller: this.controller 
        }) 
          .onChange((value: string) => { 
            this.shuRu = true; 
            if (value === '') { 
              this.shuRu = false; 
            } 
          }) 
          .border({ width: 1 }) 
          .width('100%') 
          .height(50) 
          .zIndex(1) 
        Swiper(this.swiperController) { 
          ForEach(this.textArr, (item: string) => { 
            Text(item.toString()) 
              .width('100%') 
              .height(160) 
              .backgroundColor('#00000000') 
              .textAlign(TextAlign.Center) 
              .fontSize(30) 
              .fontWeight(2) 
              .fontColor(Color.Gray) 
          }, (item: string) => item) 
        } 
        .cachedCount(2) 
        .index(0) 
        .autoPlay(true) 
        .interval(4000) 
        .loop(true) 
        .duration(1000) 
        .itemSpace(0) 
        .curve(Curve.Linear) 
        .indicator(false) 
        .vertical(true) 
        .width('100%') 
        .height(50) 
        .visibility(this.shuRu ? Visibility.Hidden : Visibility.Visible) 
      } 
    }.width('100%').margin({ top: 5 }) 
  } 
}