全面屏时代的手机顶部都是状态栏,底部则是全面屏手势滑动起始区域
关于这上下两边都一般默认设置的白边,对于一些有颜色主题的页面来说就会略显生硬
以下代码可以解决顶部底部的白边问题,并且自适应padding收缩
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/Index', (err) => { // windowStage.getMainWindowSync().setWindowBackgroundColor('#ff0000') if (err.code) { hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? ''); return; } // 以下是设置沉浸式,以及获取设备导航条、状态栏高度的代码 windowStage.getMainWindow().then(w => { // 设置沉浸式 w.setWindowLayoutFullScreen(true) // 获取设备区域参数 let avoidArea = w.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM) let bottomRectHeight = avoidArea.bottomRect.height; // 获取到导航条区域的高度 AppStorage.setOrCreate('bottomRectHeight', bottomRectHeight); // 存到本地存储 let topRectHeight = avoidArea.topRect.height; // 获取状态栏区域高度 AppStorage.setOrCreate('topRectHeight', topRectHeight); // 存到本地存储 // 当区域发生改变(例如竖屏变横屏),重新获取一次再保存 w.on('avoidAreaChange', (data) => { if (data.type === window.AvoidAreaType.TYPE_SYSTEM) { let topRectHeight = data.area.topRect.height; AppStorage.setOrCreate('topRectHeight', topRectHeight); } else if (data.type == window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR) { let bottomRectHeight = data.area.bottomRect.height; AppStorage.setOrCreate('bottomRectHeight', bottomRectHeight); } }); }) hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.'); }); }
标签:沉浸,topRectHeight,windowStage,bottomRectHeight,白边,HarmonyOS,window,let,data From: https://www.cnblogs.com/mlw1814011067/p/18641827