HarmonyOS鸿蒙Next中折叠屏由折叠变为展开,Scroller自动上滑了一点

HarmonyOS鸿蒙Next中折叠屏由折叠变为展开,Scroller自动上滑了一点 折叠屏手机,由折叠变为展开,为什么会自动往上滑一点距离。

操作步骤:1、折叠情况下,收到滑到Scroller底部。 2、折叠屏展开,Scroller自动往上滑了一点。

我监听折叠屏折叠展开,当折叠屏展开的时候使用scrollBy滑动到最底部,但是还会剩一点距离,没有滑倒最底部。代码如下:

@Entry
@Component
struct Index {
  scroller: Scroller = new Scroller()

  aboutToAppear(): void {
    //折叠屏的屏幕显示模式变化
    display.on('foldDisplayModeChange', (data) => {
      //折叠屏由折叠变为展开,Scroller自动上滑了一点点
      if (data === display.FoldDisplayMode.FOLD_DISPLAY_MODE_FULL) {
        animateTo({ duration: 500 }, () => {
          // this.scroller.scrollTo({xOffset:0,yOffset:10000})
          this.scroller.scrollBy(0, 10000)
        })
      } else if (data === display.FoldDisplayMode.FOLD_DISPLAY_MODE_MAIN) {
        animateTo({ duration: 500 }, () => {
          // this.scroller.scrollTo({xOffset:0,yOffset:10000})
          this.scroller.scrollBy(0, 10000)
        })
      }
    });
  }

  build() {
    Scroll(this.scroller){
      Column(){
        Text('1').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
          .onClick(() => {
            this.scroller.scrollBy(0,10000)
          })
        Text('2').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('3').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('4').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('5').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('6').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('7').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('8').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('9').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('2').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('3').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('4').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('5').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('6').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('7').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('8').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('9').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
        Text('10').backgroundColor(Color.Red).width('100%').height(100).margin({bottom:10})
          .onClick(() => {
            this.scroller.scrollTo({xOffset:0, yOffset:0 })
          })
      }
    }
    .width('100%').height('100%')
  }
}

更多关于HarmonyOS鸿蒙Next中折叠屏由折叠变为展开,Scroller自动上滑了一点的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

在HarmonyOS鸿蒙Next中,当折叠屏由折叠状态变为展开状态时,Scroller组件可能会自动上滑一点。这种现象通常是由于屏幕尺寸变化导致的布局调整。在折叠屏设备中,屏幕展开后,可用显示区域增大,系统会自动重新计算和调整UI布局。Scroller组件作为可滚动容器,可能会根据新的屏幕尺寸重新计算其内容的位置,从而导致自动上滑。

鸿蒙系统在处理屏幕尺寸变化时,会触发相应的布局更新机制。Scroller组件的内容位置可能会根据新的屏幕高度进行调整,以确保内容的可视性和用户体验。这种自动上滑行为是系统为了适应屏幕尺寸变化而进行的自动调整,属于正常现象。

更多关于HarmonyOS鸿蒙Next中折叠屏由折叠变为展开,Scroller自动上滑了一点的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中,折叠屏由折叠变为展开时,Scroller自动上滑可能是由于屏幕尺寸变化导致的布局调整。系统会根据新的屏幕尺寸重新计算内容位置,可能导致Scroller自动滚动。建议检查布局适配逻辑,确保在屏幕尺寸变化时内容能够正确显示。可以通过监听屏幕尺寸变化事件,手动调整Scroller的位置,避免自动上滑。

回到顶部