鸿蒙NEXT开发实战教程：仿抖音短视频

@State arr: Array<string> =  ['首页', '朋友', '发布', '消息', '我'];

  @Builder TabBuilder(index: number) {
    Column() {
          if (index === 2) {
            Image($rawfile('add.png'))
              .width($r('app.float.width_small'))
          } else {
            Text(`${this.arr[index]}`)
              .fontColor(this.currentIndex === index ? Color.Red : Color.Gray)
              .fontSize(17)
              .fontWeight(500)
          }
    }
    .width('100%')
    .height('100%')
    .alignItems(HorizontalAlign.Center)
    .justifyContent(FlexAlign.Center)
    .backgroundColor(Color.Black)
  }

Row(){
        Row(){
          Image($r('app.media.l_more'))
            .width(25)
            .height(25)
        }
        .height(56)
        .width(this.screenWidth/7)
        .justifyContent(FlexAlign.Center)
        .alignItems(VerticalAlign.Center)

        YLTabbar()
          .width(5*this.screenWidth/7)

        Row(){
          Image($r('app.media.find'))
            .width(25)
            .height(25)
        }
        .width(this.screenWidth/7)
        .height(56)
        .width(this.screenWidth/7)
        .justifyContent(FlexAlign.Center)
        .alignItems(VerticalAlign.Center)

      }
      .margin({top:this.topHeight})
      .height(56)

Video({
          src: this.videoResource,
          controller: this.controller
        })
          .height('100%')
          .autoPlay(true)
          .controls(false)
          .objectFit(ImageFit.Cover)
          .loop(true)

Swiper(this.swiperController){
        SingleRow({videoResource:$rawfile('video1.mp4')})
        SingleRow({videoResource:$rawfile('video2.mp4')})
        SingleRow({videoResource:$rawfile('video3.mp4')})
      }
      .index(videoIndex) // 设置当前在容器中显示的子组件的索引值
      .width('100%')
      .height('100%')
      .autoPlay(false)
      .indicator(false)
      .loop(true)
      .duration(200) // 子组件切换的动画时长
      .cachedCount(0)
      .vertical(true)
      .itemSpace(0)
      /**
       * 弹性曲线产生自然的弹簧效果，四个参数分别对应附着在弹簧上的对象的初始速度、附着在弹簧上的对象的质量、单位形变量所需弹力的大小、
       * 弹簧在振动过程中的减震力，使得弹簧振幅逐渐减小直至停止在平衡位置
       */
      .curve(curves.interpolatingSpring(-1, 1, 328, 34))
      .onChange((index) => {
        this.index = index;
        this.playBoo = true;
        videoIndex = index;
      })