HarmonyOS:获取屏幕顶部状态栏、底部导航栏和导航条的高度

获取屏幕顶部状态栏、底部导航栏和导航条的高度
可以使用window的getWindowAvoidArea方法获取

测试结果图

示例TestGetWindowAvoidArea.ets文件代码

typescript 复制代码
import { window } from '@kit.ArkUI'
import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct TestGetWindowAvoidArea {
  @State message: string = '获取屏幕顶部状态栏、底部导航栏和导航条的高度';

  getAvoidAreaHeight() {
    let type1 = window.AvoidAreaType.TYPE_SYSTEM;
    let type2 = window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR;
    window.getLastWindow(getContext(this)).then((data) => {
      // 获取系统默认区域,一般包括状态栏、导航栏
      let avoidArea1 = data.getWindowAvoidArea(type1);
      // 顶部状态栏高度
      let statusBarHeight = avoidArea1.topRect.height;
      // 底部导航栏高度
      let bottomNavHeight = avoidArea1.bottomRect.height;
      // 获取导航条区域
      let avoidArea2 = data.getWindowAvoidArea(type2);
      // 获取到导航条区域的高度
      let indicatorHeight = avoidArea2.bottomRect.height;
      console.info(`屏幕顶部状态栏 statusBarHeight = ${statusBarHeight}`);
      console.info(`底部导航栏 bottomNavHeight = ${bottomNavHeight}`);
      console.info(`导航条的高度 indicatorHeight = ${indicatorHeight}`);
    }).catch((err: BusinessError) => {
      console.error(`获取屏幕顶部状态栏、底部导航栏和导航条的高度 出现异常 Failed to obtain the window. Cause: ${JSON.stringify(err)}`);
    });
  }

  build() {
    Column({ space: 10 }) {
      Text(this.message)
        .id('TestGetWindowAvoidAreaHelloWorld')
        .fontSize(20)
        .fontWeight(FontWeight.Bold)
        .onClick(() => {
          this.getAvoidAreaHeight()
        })

    }
    .height('100%')
    .width('100%')
  }
}
相关推荐
想你依然心痛2 分钟前
HarmonyOS 6(API 23)实战:基于Face AR情绪反馈与Body AR手势操控的“光影剪辑台“——PC端沉浸式影视后期系统
华为·ar·harmonyos·悬浮导航·沉浸光感
leon_teacher21 分钟前
HarmonyOS 6 Navigation 实战:NavPathStack 路由架构与 onShown 跨页状态同步方案
华为·架构·harmonyos
KKei16381 小时前
Flutter for OpenHarmony 编程技能树APP技术文章
flutter·华为·harmonyos
想你依然心痛1 小时前
HarmonyOS 6(API 23)实战:基于Face AR呼吸监测与Body AR姿态引导的“静界空间“——PC端沉浸式冥想疗愈系统
华为·ar·harmonyos·悬浮导航·沉浸光感
KKei16381 小时前
Flutter for OpenHarmony 个人财务管理与记账APP
flutter·华为·harmonyos
nashane2 小时前
HarmonyOS 6学习:Web组件与JavaScript交互的三大高频问题与终极解决方案
前端·学习·harmonyos
Swift社区2 小时前
鸿蒙 PC 构建体系详解:从 DevEco 到发布
华为·harmonyos
KKei16382 小时前
Flutter for OpenHarmony 本地音乐播放器APP
flutter·华为·harmonyos
largecode2 小时前
怎么让手机显示公司名?来电显示公司名称认证实现品牌外显
linux·ubuntu·华为od·华为·智能手机·华为云·harmonyos
KKei16382 小时前
Flutter for OpenHarmony 外语单词背诵与听力训练APP
flutter·华为·harmonyos