uni-app 安卓APP云打包后不显示midbuttonicon图标

uni-app 安卓APP云打包后不显示midbuttonicon图标

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Mac
PC开发环境操作系统版本号 macOS Sonoma 14.4
HBuilderX类型 正式
HBuilderX版本号 3.99
手机系统 Android
手机系统版本号 Android 11
手机厂商 小米
手机机型 Redmi Note 10
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

操作步骤：

无

预期结果：

安卓包云打包后可以显示midbutton的icon图片，在IOS中运行到APP基座可以显示Icon图片

实际结果：

安卓包云打包后不显示midbutton的icon图片，在IOS中运行到APP基座也无法显示Icon图片

bug描述：

app端midbutton在运行到安卓模拟器中可以显示icon图片，但是在进行云打包后的图片不显示，文字可以显示，icon的宽高单位都使用了px。
在IOS中运行到APP基座也无法显示Icon图片

Image 1
Image 2


更多关于uni-app 安卓APP云打包后不显示midbuttonicon图标的实战教程也可以访问 https://www.itying.com/category-93-b0.html

8 回复

用最新版本HX试下，appid提供下

更多关于uni-app 安卓APP云打包后不显示midbuttonicon图标的实战教程也可以访问 https://www.itying.com/category-93-b0.html


已经是最新版的HX，appid：UNIA502C40

回复 c***@163.com: 提出问题之后，将版本升级到了4.14

回复 c***@163.com: midButton配置项里iconPath配置的路径 路径拼错了tabbar b需要大写

回复 DCloud_Android_ST: 还真是这个问题，为啥运行的时候使用自定义基座和标准基座模拟都可以啊

回复 c***@163.com: 正式版运行路径区分大小写，调试模式路径不区分 系统底层限制

我也不可以，我是uniapp-x H5可以显示，android手机基座就不显示，位置是空出来了的。 Hbuilder 版本号是最新的4.45 代码： “tabBar”: { “color”: “#1F1F1F”, “selectedColor”: “#1F1F1F”, “borderStyle”: “white”, “backgroundColor”: “#FFFFFF”, “list”: [ { “pagePath”: “pages/index/index”, “iconPath”: “/static/images/tabbar/home.png”, “selectedIconPath”: “/static/images/tabbar/home-full.png”, “text”: “首页” }, { “pagePath”: “pages/login/login”, “iconPath”: “/static/images/tabbar/point.png”, “selectedIconPath”: “/static/images/tabbar/point-full.png”, “text”: “同城” }, { “pagePath”: “pages/login/login”, “iconPath”: “/static/images/tabbar/message.png”, “selectedIconPath”: “/static/images/tabbar/message-full.png”, “text”: “消息” }, { “pagePath”: “pages/login/login”, “iconPath”: “/static/images/tabbar/mine.png”, “selectedIconPath”: “/static/images/tabbar/mine-full.png”, “text”: “我的” } ], “midButton”: { “height”: “90rpx”, “iconWidth”: “108rpx”, “iconPath”: “/static/images/tabbar/mai-full.png”, “backgroundImage”: “/static/images/tabbar/mai-full.png” }


在 uni-app 中，如果你在安卓 APP 云打包后发现 midButtonIcon 图标不显示，可能有以下几种原因和解决方法：

1. 图标路径问题

  • 原因: 图标路径可能不正确，导致打包时无法找到图标文件。
  • 解决方法:
    • 确保 midButtonIcon 的路径是正确的，并且图标文件存在于项目中。
    • 使用相对路径或绝对路径时，注意路径的写法是否正确。例如：/static/icon.png。

2. 图标格式问题

  • 原因: 图标格式可能不被支持，或者图标文件损坏。
  • 解决方法:
    • 确保图标格式为常见的图片格式，如 PNG、JPG 等。
    • 检查图标文件是否损坏，尝试重新生成或替换图标文件。

3. 图标大小问题

  • 原因: 图标大小可能不符合要求，导致显示异常。
  • 解决方法:
    • 确保图标的大小符合要求，通常建议使用 24x24 或 48x48 等标准尺寸。
    • 如果图标过大或过小，可能会导致显示问题。

4. 打包配置问题

  • 原因: 打包时可能未正确包含图标文件。
  • 解决方法:
    • 检查 manifest.json 文件中的配置，确保 midButtonIcon 的路径正确。
    • 确保在云打包时，图标文件被正确打包到应用中。

5. 平台兼容性问题

  • 原因: 某些平台可能对图标的显示有特殊要求或限制。
  • 解决方法:
    • 检查 manifest.json 中的平台配置，确保图标配置适用于目标平台。
    • 尝试在不同平台上测试，确认问题是否特定于某个平台。

6. 缓存问题

  • 原因: 打包后的应用可能存在缓存问题，导致图标未更新。
  • 解决方法:
    • 清除应用缓存，或重新安装应用，确保最新的图标文件被加载。

7. 代码逻辑问题

  • 原因: 代码中可能存在问题，导致图标未正确显示。
  • 解决方法:
    • 检查代码逻辑，确保 midButtonIcon 被正确设置和加载。
    • 使用调试工具检查图标是否被正确加载和显示。

示例代码

以下是一个简单的示例，展示如何在 manifest.json 中配置 midButtonIcon：

{
  "app-plus": {
    "midButton": {
      "icon": "/static/icon.png"
    }
  }
}
回到顶部