uni-app 安卓15 APP底部导航栏被系统导航按键遮盖

uni-app 安卓15 APP底部导航栏被系统导航按键遮盖

开发环境 版本号 项目创建方式
Mac 15.1 HBuilderX 
产品分类：uniapp/App

PC开发环境操作系统：Mac

HBuilderX类型：正式

HBuilderX版本号：4.75

手机系统：Android

手机系统版本号：Android 15

手机厂商：小米

手机机型：小米14，小米15

页面类型：vue

vue版本：vue3

打包方式：离线

App下载地址或H5网址：[https://www.pgyer.com/VcDwiPBx](https://www.pgyer.com/VcDwiPBx)

### 操作步骤：
- 必现

### 预期结果：
- 离线打包真机运行结果和模拟器相同，自动撑开底部导航栏安全区域。

### 实际结果：
- 模拟器正常，安卓15机型显示异常，安卓14机型显示正常。

### bug描述：
客户反馈小米14，小米15，oppo reno9等安卓15机型上，使用虚拟按键导航栏，遮盖了app自定义的tabbar组件。在模拟器上不会出现这个问题，模拟器能够撑开安全区域，离线打包上真机出现。
在安卓14机型上表现正常。
离线打包-安卓SDK版本-4.66.82418_20200520

![](https://www.itying.com/uniimg.php?url=https://img-cdn-tc.dcloud.net.cn/uploads/questions/20250814/31770399f105fabf395104f1b7f25863.png)

更多关于uni-app 安卓15 APP底部导航栏被系统导航按键遮盖的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

一样。有人回答么

更多关于uni-app 安卓15 APP底部导航栏被系统导航按键遮盖的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我的解决方案是用原生代码获取底部安全距离，自定义tabbar组件添加padding。目前测试可以。

这是一个典型的 Android 15 系统导航栏适配问题。Android 15 引入了新的手势导航和系统栏行为，导致原有的安全区域计算方式失效。

解决方案：

  1. 检查 manifest.json 配置 确保已启用沉浸式状态栏和导航栏适配：

    "plus": {
  "safearea": {
    "background": "#ffffff",
    "bottom": {
      "offset": "auto"
    }
  }
}

  2. 更新 uni-app 安全区域变量 在页面样式中使用：

    padding-bottom: calc(env(safe-area-inset-bottom) + 50px);

    或通过 JS 动态获取：

    const safeArea = uni.getSystemInfoSync().safeAreaInsets

  3. 检查原生配置 离线打包需在 AndroidManifest.xml 中添加：

    <meta-data 
    android:name="android.max_aspect" 
    android:value="2.1" />

  4. 升级 SDK 版本 当前使用的 4.66.82418 版本较旧，建议升级到最新版 HBuilderX 和对应的离线 SDK，新版已针对 Android 15 进行适配。

  5. 临时解决方案 可通过 CSS 强制设置底部间距：

    .tabbar {
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}
回到顶部