HarmonyOS鸿蒙Next开发 Navigation组件内，在悬浮窗后会有异常高度占用

HarmonyOS鸿蒙Next开发 Navigation组件内，在悬浮窗后会有异常高度占用 如下图所示，当程序进入悬浮窗的时候，红框组件无法占满全部高度，重新恢复全屏后也无法恢复。

1.png

2.png

3.png

cke_27234.png


更多关于HarmonyOS鸿蒙Next开发 Navigation组件内，在悬浮窗后会有异常高度占用的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复

有一块是Navigation的标题区域，给Navigation加上.title(‘demo’)可以看到效果

更多关于HarmonyOS鸿蒙Next开发 Navigation组件内，在悬浮窗后会有异常高度占用的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


诡异，默认没有title高度，悬浮窗后就有了title高度…，

要是能够设置无标题就好了，

我这边提供一下这种UI的排查思路：

可以使用编译器里面的ArkUI Inspector来查询UI布局的结构，这样去看试试会不会好一点

cke_2908.png

给红色那个框，加一个layoutWeight(1)试试

在鸿蒙Next开发中，Navigation组件在悬浮窗后出现异常高度占用问题，可能是由于Navigation的布局计算未适配悬浮窗模式导致。可检查Navigation组件的height属性和布局约束条件，确保在悬浮窗模式下正确响应窗口尺寸变化。使用onAreaChange回调监听布局区域变化，动态调整Navigation高度。同时确认是否设置了不必要的固定高度值，建议使用百分比或自适应布局。该问题也可能与系统级悬浮窗管理策略相关。

这是一个已知的HarmonyOS Navigation组件在悬浮窗模式下的布局问题。问题原因是当应用进入悬浮窗模式时，Navigation组件的height属性没有正确响应窗口尺寸变化，导致布局计算异常。

建议检查以下几点：

  1. 确保Navigation组件使用了百分比高度(100%)而非固定值
  2. 在onWindowStageChange回调中手动触发布局重绘
  3. 检查是否在页面生命周期中正确重置了组件尺寸

临时解决方案可以尝试在窗口模式变化时强制重新加载Navigation组件：

onWindowStageChange(isFullScreen: boolean) {
  this.isFullScreen = isFullScreen;
  // 强制更新布局
  this.navComponent.updateLayout();
}

该问题已在HarmonyOS最新预览版中修复，建议升级SDK版本。

回到顶部