uniapp 安卓端如何去除默认底部安全距离

在uniapp开发的安卓端应用中，如何去除默认的底部安全距离？我在manifest.json中尝试过设置"safearea": {“bottom”: {“offset”: “none”}}，但似乎没有效果。请问有没有其他方法可以彻底移除这个底部空白区域？需要适配不同安卓机型。

2 回复

在 pages.json 中配置：

{
  "globalStyle": {
    "app-plus": {
      "safearea": {
        "bottom": {
          "offset": "none"
        }
      }
    }
  }
}

在 UniApp 中，安卓端默认会预留底部安全区域（例如适配全面屏设备），但可以通过以下方法去除：

方法一：全局配置（推荐）

在 pages.json 中配置 "safearea" 属性：

{
  "globalStyle": {
    "safearea": {
      "bottom": {
        "offset": "none"
      }
    }
  }
}

这会全局禁用底部安全区域占位。

方法二：单页面配置

在特定页面的 style 中配置：

{
  "pages": [
    {
      "path": "pages/index/index",
      "style": {
        "safearea": {
          "bottom": {
            "offset": "none"
          }
        }
      }
    }
  ]
}

方法三：CSS 覆盖

在页面的样式文件中添加：

page {
  padding-bottom: 0 !important;
}

或针对具体元素：

.content {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

注意事项：

  1. 移除安全区域可能导致内容被底部导航栏或手势条遮挡，建议测试全面屏设备。
  2. 若需动态控制，可使用 uni.getSystemInfo() 判断设备类型，通过条件样式调整。
  3. 使用 !important 确保覆盖默认样式。

根据需求选择合适的方法，通常推荐方法一或二进行统一配置。

回到顶部