HarmonyOS开发应用沉浸式效果（全屏显示）

效果展示

解决方法

可以通过调用窗口强制全屏布局接口（setWindowLayoutFullScreen()）实现界面元素覆盖到状态栏和导航条，获取到状态栏和导航条高度后进行避让处理。

在ability中通过getMainWindow可以获取主窗体，然后通过得到的window对象设置全屏即可实现。

1.全局开启

import { abilityAccessCtrl, AbilityConstant, UIAbility, Want } from '@kit.AbilityKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { KeyboardAvoidMode, window } from '@kit.ArkUI';
import { PreferencesClass } from '../pages/09/PreferencesDemo/PreferencesClass';

export default class EntryAbility extends UIAbility {
   onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {
    const manager = abilityAccessCtrl.createAtManager(); // 创建程序控制管理器
     manager.requestPermissionsFromUser(this.context,
      [
        "ohos.permission.APPROXIMATELY_LOCATION"
      ])
  }

  onDestroy(): void {
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onDestroy');
  }

  onWindowStageCreate(windowStage: window.WindowStage): void {
    // Main window is created, set main page for this ability
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');


    windowStage.loadContent('pages/10/SafeAreaCase', ()=>{
      // 异步结果会传到 then 的函数中当参数
       windowStage.getMainWindow().then((window)=>{
         // 1. 全局关闭安全区
         window.setWindowLayoutFullScreen(true)
       })
    })

  }


  onWindowStageDestroy(): void {
    // Main window is destroyed, release UI related resources
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');
  }

  onForeground(): void {
    // Ability has brought to foreground
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onForeground');
  }

  onBackground(): void {
    // Ability has back to background
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onBackground');
  }
}

2.指定页面开启

import { window } from '@kit.ArkUI'


@Entry
@Component
struct SafeAreaCase {
  @State message: string = 'Hello World';

  aboutToAppear(): void {
      window.getLastWindow(getContext()).then((win)=>{
        // 2. 指定页面开启
        win.setWindowLayoutFullScreen(true)
      })
  }


  build() {
    Column() {
      Image($r('app.media.background'))
        .height('100%')
        .width('100%')
    }
    .height('100%')
    .width('100%')
  }
}

参考资料：

文档中心https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-develop-apply-immersive-effects-0000001820435461