HarmonyOS 是否有可吸顶的tab滑动组件呢？

参考：

@Entry
@Component
struct Index_231204142752067 {
  @State height1: number = 30
  build() {
    Stack() {
      // 主内容
      Scroll() {
        Column() {
          ScrollHeaderArea()
            .onVisibleAreaChange([0.0, 1.0], (isVisible: boolean, currentRatio: number) => {
              if (!isVisible) {
                this.height1 = 50
              } else {
                this.height1 = 30
              }
            })
          // 主内容
          ScrollMainArea({ height1: this.height1 })
        }.width("100%")
      }
      .edgeEffect(EdgeEffect.None)
      .friction(0.6)
      .backgroundColor('#DCDCDC')
      .scrollBar(BarState.Off)
      .width('100%')
      .height('100%')
      // 头部右上角图标
      header()
    }
  }
}

@Component
struct header {
  build() {
    Row() {
      Blank().layoutWeight(1)
      Row() {
        Image($r('app.media.startIcon'))
          .width(20)
          .height(20)
          .margin({ right: 10 })
          .onClick(() => {
            console.log('11111')
          })
        Image($r('app.media.startIcon'))
          .width(20)
          .height(20).onClick(() => {
          console.log('111112')
        })
      }.margin({ right: 10 })
    }.width('100%').position({ y: 10 })
  }
}

@Component
struct ScrollHeaderArea {
  build() {
    Row() {
      Row() {
        Text('1').fontSize(20).layoutWeight(1)
        Text('1').fontSize(20).layoutWeight(1)
        Text('1').fontSize(20).layoutWeight(1)
        Text('1').fontSize(20).layoutWeight(1)
      }
      .backgroundColor(Color.White)
      .margin(10)
      .borderRadius(5)
      .height(50)

    }.backgroundColor(Color.Pink)
    .padding({ top: 50, bottom: 50 })
  }
}
@Component
struct ScrollMainArea {
  @State arr: number[] = [1, 2, 3, 4, 5, 6]
  @Prop height1: number

  @Builder
  headerItem() {
    Column() {
      Text()
        .size({ width: '100%', height: this.height1 })
        .animation({
          duration: 300
        })
        .backgroundColor(Color.Red)
        .fontSize(16)
        .align(Alignment.Start)
        .position({ x: 0, y: 0 })
      Image($r('app.media.icon')).width(40).height(40).padding({ left: 5 })
    }
  }

  @Styles
  listCard() {
    .backgroundColor(Color.White)
    .height(200)
    .width("100%")
    .borderRadius(12)
  }

  build() {
    Column() {
      List({ space: 10 }) {
        ListItemGroup({ header: this.headerItem }) {
          ForEach(this.arr, (item: number) => {
            ListItem() {
              Text("item" + item)
                .fontSize(16)
            }.listCard()
          }, (item: string) => item)
        }
      }
      .sticky(StickyStyle.Header)
      .width("100%")
      .height('100%')
      .edgeEffect(EdgeEffect.None)
      .nestedScroll({
        scrollForward: NestedScrollMode.PARENT_FIRST,
        scrollBackward: NestedScrollMode.SELF_FIRST
      })
    }.width('100%').height('100%')
  }
}