HarmonyOS鸿蒙Next中异形屏快应用如何全屏适配

HarmonyOS鸿蒙Next中异形屏快应用如何全屏适配 问题背景：

快应用页面中设置fullscreen属性为true全屏模式下，在一些异形屏上无法完全适配，状态栏会被黑边替代，无法真正全屏显示。这部分机型如何才能完全适配变成全屏呢？

相关代码：

"display": {
    "pages": {
      "Hello": {
        "titleBarText": "TitleBar",
        "fullScreen": true,
        "menuBarData": {
          "menuBar": false
        }
      }
    }

解决方案：

在快应用1101版本上，推出了一个fitCutout属性，是否在异形区域绘制内容，可以将异形屏的黑边去点，变成真正的全屏显示。只需要在manifest文件设置属性"fitCutout": “portrait|landscape”

修改代码：

"display": {
    "pages": {
      "Hello": {
        "titleBarText": "TitleBar",
        "fullScreen": true,
        "menuBarData": {
          "menuBar": false
        },
        "fitCutout": "portrait|landscape"
      }
    }

更多关于HarmonyOS鸿蒙Next中异形屏快应用如何全屏适配的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于HarmonyOS鸿蒙Next中异形屏快应用如何全屏适配的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，异形屏快应用的全屏适配可以通过以下步骤实现：

  1. 使用系统API：调用getWindowInsets()获取屏幕的Insets信息，包括状态栏、导航栏等区域。
  2. 布局调整：根据Insets信息动态调整应用布局，确保内容不被遮挡。
  3. 沉浸式模式：启用沉浸式模式，隐藏系统UI，充分利用屏幕空间。
  4. 适配不同设备：使用DisplayMetrics获取屏幕尺寸和密度，确保布局在不同设备上表现一致。
  5. 测试与优化：在多种异形屏设备上测试，确保适配效果。

通过这些步骤，可以实现快应用在异形屏上的全屏适配，提升用户体验。

回到顶部