HarmonyOS 如何实现滚动渐变效果？

@Entry  
@Component  
struct Page1 {  
  @State tabOpacity:number = 0  
  private scrollerForScroll: Scroller = new Scroller()  
  
  build() {  
    Column(){  
      Stack(){  
  
        List({ scroller: this.scrollerForScroll }) {  
          ListItem()  
            .height('20%')  
            .width('90%')  
            .backgroundColor(Color.Green)  
            .margin({top:70})  
  
          ListItem()  
            .height('30%')  
            .width('90%')  
            .backgroundColor(Color.Blue)  
            .margin({top:20})  
  
          ListItem()  
            .height('10%')  
            .width('90%')  
            .backgroundColor(Color.Red)  
            .margin({top:20})  
  
          ListItem()  
            .height('30%')  
            .width('90%')  
            .backgroundColor(Color.Blue)  
            .margin({top:20})  
  
          ListItem()  
            .height('30%')  
            .width('90%')  
            .backgroundColor(Color.Brown)  
            .margin({top:20})  
  
        }  
        .onScroll(() => {  
          let yOffset = this.scrollerForScroll.currentOffset().yOffset  
  
          if(yOffset < 100){  
            this.tabOpacity = yOffset*0.01  
          }  
        })  
        .scrollBar(BarState.Off)  
        .alignListItem(ListItemAlign.Center)  
        .backgroundColor(Color.Gray)  
        .width('100%')  
  
        Stack(){  
          Column(){  
          }  
          .backgroundColor(Color.Blue)  
          .opacity(this.tabOpacity)  
          .height('100%')  
          .width('100%')  
  
          Text('tabbar')  
            .fontSize(40)  
        }  
        .width('100%')  
        .height('50')  
        .alignContent(Alignment.Center)  
      }  
      .alignContent(Alignment.TopStart)  
    }  
    .width("100%")  
  }  
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.