HarmonyOS 鸿蒙Next中有什么好的办法去监听折叠屏内外屏切换时的屏幕尺寸变化？

HarmonyOS 鸿蒙Next中有什么好的办法去监听折叠屏内外屏切换时的屏幕尺寸变化？

目前有一个动画这边需要做折叠屏适配（目前二折叠、三折叠OK），阔折叠这块的话在UI里面如何去监听当前的内外屏切换代来的屏幕尺寸变化呢？？

我原来用的是如下的代码段：

// 宽屏适配屏幕长度和高度
@State
text_height: number = this.screen_height = px2vp(display.getDefaultDisplaySync().height)
@State
text_width: number = this.screen_width = px2vp(display.getDefaultDisplaySync().width)

.onAppear(()=>{
  display.on("change",()=>{
    this.text_height = this.viewModel.displayHeight = px2vp(display.getDefaultDisplaySync().height)
    this.text_width = this.viewModel.displayWidth = px2vp(display.getDefaultDisplaySync().width)
    logger.print('SliderControl','检测到屏幕尺寸变化')
  })
})

我自己在阔折叠模拟器上调试看日志，并无看到“检测到屏幕尺寸变化”日志输出，貌似这个display.on监听不到这个阔折叠，望大佬给一个好一点的解答，谢谢。


更多关于HarmonyOS 鸿蒙Next中有什么好的办法去监听折叠屏内外屏切换时的屏幕尺寸变化？的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

您好，Pura X折叠屏设备在开合状态变化时，窗口高度会相应改变，应用界面需要实时响应这些变化。开发者可以通过注册on(‘windowSizeChange’)事件监听器来捕获窗口尺寸变化，在回调函数中重新计算当前断点并更新UI布局，确保界面始终与当前窗口尺寸保持同步。这一机制能够有效处理设备展开/折叠、分屏模式切换以及屏幕旋转等多种场景下的界面适配需求，为用户提供流畅的折叠屏使用体验。

更多关于HarmonyOS 鸿蒙Next中有什么好的办法去监听折叠屏内外屏切换时的屏幕尺寸变化？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在鸿蒙Next中监听折叠屏切换，可使用display模块的on('displayChange')事件。具体步骤：

  1. 导入@ohos.display模块
  2. 注册显示设备变化监听：
display.on('displayChange', (curDisplay) => {
  // curDisplay.width/height包含新尺寸
})
  1. 在回调中获取当前Display对象的宽高属性。该方法直接响应包括折叠屏展开/折叠在内的所有显示变化事件。

在HarmonyOS Next中监听折叠屏内外屏切换，建议使用window模块的on('windowSizeChange')事件。这种方式比display.on('change')更适合处理折叠屏场景变化。

推荐实现方式：

import window from '@ohos.window';

// 获取窗口对象
let win = window.getLastWindow(this.context);

// 监听窗口尺寸变化
win.on('windowSizeChange', (data) => {
  this.text_height = px2vp(data.height);
  this.text_width = px2vp(data.width);
  logger.print('SliderControl','检测到窗口尺寸变化');
});

关键点说明：

  1. windowSizeChange事件会在折叠/展开操作时触发
  2. 回调参数data包含width/height等属性
  3. 需要先通过getLastWindow获取当前窗口对象

这种方式可以准确捕获折叠屏状态变化时的尺寸调整事件。

回到顶部