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%')
  }
}
相关推荐
HwJack201 天前
HarmonyOS 6APP开发之摸透ArkUI FrameNode
华为·harmonyos
求学中--1 天前
状态管理一文通:@State、@Prop、@Link、@Provide/Consume全解析
人工智能·小程序·uni-app·wpf·harmonyos
求学中--1 天前
ArkUI组件库完全指南:从基础组件到自定义装饰器
低代码·华为·小程序·uni-app·harmonyos
●VON1 天前
鸿蒙原生APP开发实战指南:三套低成本AI辅助方案全解析
人工智能·华为·chatgpt·大模型·harmonyos·image
枫叶丹41 天前
【HarmonyOS 6.0】Data Augmentation Kit 智慧化数据检索 C 接口解析:向量化、知识检索与知识问答
c语言·开发语言·华为·harmonyos
2301_815279521 天前
鸿蒙原生开发的“硬核通道”:ArkTS 与 C/C++ 高性能互操作全栈指南 —— FFI 机制深度解析与实战精要
c语言·c++·harmonyos
前端不太难2 天前
鸿蒙 App 的“无状态 System”设计
华为·状态模式·harmonyos
UnicornDev2 天前
【Flutter x HarmonyOS 6】魔方计时APP——计时逻辑实现
flutter·华为·harmonyos·鸿蒙·鸿蒙系统
AlbertZein3 天前
ImageKnifePro 源码解读:鸿蒙图片加载框架全貌
harmonyos
AlbertZein3 天前
鸿蒙工程化:build-profile.json5 逐字段解析
harmonyos