HarmonyOS 嵌套滑动NestedScroll 指定offset

当前的嵌套滑动功能不足以完全支撑现实应用,在开发沉浸式app时,在滑动时,顶部的导航栏会从透明转为不透明,列表滑动时,吸顶是吸在导航栏的下面,因此,需要能够设置一个offset,实现指定offset时(而不是边缘),子List开启滑动

HarmonyOS
2024-08-10 12:06:31
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
FengTianYa

demo如下:

@Entry 
@Component 
struct page { 
  @State listPosition: number = 0; // 0代表滚动到List顶部,1代表中间值,2代表滚动到List底部。 
  @State arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13] 
  private scrollerForScroll: Scroller = new Scroller() 
  private scrollerForList: Scroller = new Scroller() 
  @State isRefreshing: boolean = false 
  @Builder 
  listBuilder() { 
    List({ space: 20, scroller: this.scrollerForList }) { 
      ForEach(this.arr, (item: number) => { 
        ListItem() { 
          Text("ListItem" + item) 
            .width("100%") 
            .height("100%") 
            .fontSize(16) 
            .textAlign(TextAlign.Center) 
            .backgroundColor(Color.White) 
        }.width("100%").height(100) 
      }, (item: string) => item) 
    } 
    .divider({ strokeWidth: 1, color: 0xeeeeee }) 
    .nestedScroll({ 
      scrollForward: NestedScrollMode.PARENT_FIRST, 
      scrollBackward: NestedScrollMode.SELF_FIRST 
    }) 
    .edgeEffect(EdgeEffect.None) 
    .friction(0.6) 
    .height('calc(100% - 100vp)') // 滚动到scroll area还剩100时 就定格了 
  } 
 
  build() { 
    Scroll(this.scrollerForScroll) { 
      Column() { 
        Text("Scroll Area") 
          .width("100%") 
          .height("40%") 
          .backgroundColor(0X330000FF) 
          .fontSize(16) 
          .textAlign(TextAlign.Center) 
          .onClick(() => { 
            setTimeout(() => { 
 
            }, 1000) 
          }) 
        this.listBuilder() 
 
 
      }.justifyContent(FlexAlign.Start) 
    }.edgeEffect(EdgeEffect.None) 
  } 
}
分享
微博
QQ
微信
回复
2024-08-10 18:19:55
相关问题
HarmonyOS Tabs组件嵌套滑动
143浏览 • 1回复 待解决
HarmonyOS 嵌套滑动问题
141浏览 • 1回复 待解决
HarmonyOS List嵌套waterflow滑动卡顿
154浏览 • 1回复 待解决
HarmonyOS list 嵌套web滑动切换问题
304浏览 • 1回复 待解决
HarmonyOS scroll嵌套List不能整体滑动
165浏览 • 1回复 待解决
HarmonyOS Refresh组件嵌套滑动冲突问题
654浏览 • 1回复 待解决
滑动嵌套事件冲突处理
142浏览 • 0回复 待解决
Tabs组件嵌套滑动组件
1277浏览 • 1回复 待解决
Scroll与WaterFlow滑动嵌套
837浏览 • 1回复 待解决
scroll和list的嵌套滑动
1206浏览 • 1回复 待解决
HarmonyOS Tabs和Web嵌套左右滑动问题
168浏览 • 1回复 待解决
如何处理tabs嵌套web滑动场景
375浏览 • 1回复 待解决
Web嵌套滑动卡顿怎么办?
59浏览 • 1回复 待解决
Refresh组件不支持设置nestedScroll属性
1764浏览 • 1回复 待解决