HarmonyOS 怎么实现APP首页上搜索框中的轮播文字

参考代码如下：

@Entry
@Component
struct TextInputDemos {
  private swiperController: SwiperController = new SwiperController();
  private data: MyDataSourceSwipers = new MyDataSourceSwipers([]);
  private controller: TextInputController = new TextInputController()
  @State shuRu : boolean = false;
  @State text : string = '';

  aboutToAppear(): void {
    let list: string[] = ['这是一个输入框','HarmonyOS','OpenHarmony'];
    this.data = new MyDataSourceSwipers(list)
  }

  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) {
          LazyForEach(this.data, (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 })
  }
}