HarmonyOS 展示弹窗的时候，样机底部会有白条。如何隐藏？

Question

展示弹窗的时候，样机底部会有白条。如何隐藏？ 附件中 红框就是自定义弹窗。 页面底部白色区域，如何隐藏？

Answer 1

可以通过设置导航条颜色的方式来解决问题

1：在EntryAbility中缓存windowStage

onWindowStageCreate(windowStage: window.WindowStage): void {

  AppStorage.setOrCreate("windowStage",windowStage);

  hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');
  windowStage.loadContent('pages/Index18', (err, data) => {
  if (err.code) {
  hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
  return;
}

hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
});
}

2：pages中设置导航条颜色

aboutToAppear() {
  if (this.dialogController != null) {

    let windowStage = AppStorage.get("windowStage") as window.WindowStage
    windowStage.getMainWindowSync().setWindowBackgroundColor('#ff00ff');

    this.dialogController.open();
  }
}

应用窗口默认会避让导航栏和状态栏，可以通过设置沉浸式布局实现全屏效果。参考以下设置

//EntryAbility.ets
export default class EntryAbility extends UIAbility {
  // ...
  onWindowStageCreate(windowStage: window.WindowStage): void {
    windowStage.loadContent('pages/Index', (err, data) => {
      if (err.code) {
        return;
      }
      let windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口
      // 1. 设置窗口全屏
      let isLayoutFullScreen = true;
      windowClass.setWindowLayoutFullScreen(isLayoutFullScreen)
        .then(() => {
          console.info('Succeeded in setting the window layout to full-screen mode.');
        })
        .catch((err: BusinessError) => {
          console.error('Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(err));
        });
    });
  }
}

更多沉浸式布局设置可以参考：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-develop-apply-immersive-effects-0000001820435461