编写一个页面,实现吸顶效果

List({ space: 10, scroller: this.scrollerForList }) { 
  ForEach(this.arr, (item: number) => { 
    ListItem() { 
      Text("促销商品" + item) 
        .width("100%") 
        .height("100%") 
        .borderRadius(15) 
        .fontSize(24) 
        .textAlign(TextAlign.Center) 
        .backgroundColor(Color.White) 
    }.width("100%").height(100) 
  }, (item: string) => item) 
} 
.padding({ left: 10, right: 10 }) 
.width("100%") 
.edgeEffect(EdgeEffect.None) 
.scrollBar(BarState.Off) 
.onReachStart(() => { 
  this.listPosition = ScrollPosition.start 
}) 
.onReachEnd(() => { 
  this.listPosition = ScrollPosition.end 
}) 
.onScrollFrameBegin((offset: number, state: ScrollState) => { 
  // 滑动到列表中间时 
  if (!((this.listPosition == ScrollPosition.start && offset < 0) 
    || (this.listPosition == ScrollPosition.end && offset > 0))) { 
    this.listPosition = ScrollPosition.center 
  } 
 
  // 如果页面已滚动到底部，列表不在顶部或列表有正向偏移量 
  if (this.scrollPosition == ScrollPosition.end 
    && (this.listPosition != ScrollPosition.start || offset > 0)) { 
    return { offsetRemain: offset }; 
  } else { 
    this.scrollerForScroll.scrollBy(0, offset) 
    return { offsetRemain: 0 }; 
  } 
}) 
} 
.tabBar('促销活动')