uni-app 云打包Android app在Android 11的设备上icon有白边

uni-app 云打包Android app在Android 11的设备上icon有白边

操作步骤：

  • 直接安装云打包后的apk就可以呈现

预期结果：

  • 深色logo占满整个app icon，没有白边

实际结果：

  • 深色logo被压缩，没有自适应撑满app icon，有白边

bug描述：

  • Android11中的效果 Android11的效果
  • 如上面图片所示，uniapp 云打包安卓app，安装到Android 11的设备上，logo不能占满整个应用的icon，因为logo是深色的，看起来有白边
信息类别 信息内容
产品分类 uniapp/App
PC开发环境 Mac
PC开发环境版本 macOS 15.6
HBuilderX类型 正式
HBuilderX版本 4.85
手机系统 Android
手机系统版本 Android 11
手机厂商 模拟器
手机机型 任意
页面类型 vue
vue版本 vue3
打包方式 云端
项目创建方式 HBuilderX

更多关于uni-app 云打包Android app在Android 11的设备上icon有白边的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 云打包Android app在Android 11的设备上icon有白边的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是因为Android 8.0（API 26）开始引入了自适应图标规范，要求应用图标提供前景层和背景层。在Android 11设备上，系统会强制应用遵循这一规范。

问题根源在于uni-app云打包时，默认生成的图标可能没有正确适配自适应图标规范。深色logo被当作前景层处理，而默认背景层是白色的，导致出现白边。

解决方案：

  1. 在项目的manifest.json中配置Android自适应图标
  2. 准备符合规范的图标资源：
    • 前景图：建议使用512x512像素的PNG，内容居中显示
    • 背景图：单色或简单图案，确保前景logo能完整显示
  3. 在HBuilderX中重新提交云端打包

关键配置示例（manifest.json）：

"app-plus": {
  "android": {
    "adaptiveIcon": {
      "foreground": "static/adaptive-foreground.png",
      "background": "static/adaptive-background.png"
    }
  }
}
回到顶部