uni-app HBuilderX 4.29 云打包应用页面在红米K70至尊版上出现异常

uni-app HBuilderX 4.29 云打包应用页面在红米K70至尊版上出现异常

操作步骤:

  • 打开软件就可以看到

预期结果:

  • 显示正常样式

实际结果:

  • 出现黑色样式

bug描述:

  • 首先软件并未适配暗黑模式
  • 使用云打包后出现强制黑色模式
  • 正常应该是白色的

相关图片

Image 1 Image 2

项目信息

信息
产品分类 uniapp/App
PC开发环境 Windows
PC开发环境版本号 Windows 10
HBuilderX类型 正式
HBuilderX版本号 4.29
手机系统 Android
手机系统版本号 Android 15
手机厂商 小米
手机机型 红米k70至尊版
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX
App下载地址 点击这里

更多关于uni-app HBuilderX 4.29 云打包应用页面在红米K70至尊版上出现异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

19 回复

更多关于uni-app HBuilderX 4.29 云打包应用页面在红米K70至尊版上出现异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


手机只要开启神色模式软件里面的白色页面都会变成黑色
现在发现的问题机型有红米 还有 vivo 子品牌 iqoo 别的我没有那么多机型所以没有测试

有工作人员能给处理下么?社区里面也有别人在反馈了

谁能给看一下啊!手动设置关闭也不行

谁来看下呀!

可能是手机系统给强制转了,并不是框架自身的 darkmode。ios 是不是正常的?

我也发现了这个问题,红米机型,回退到4.24版本就不会

并不是系统强制转的,之前的版本都没有问题,就升级到4.29会有问题,辛苦查下原因,不然之后hbx都不敢升级了

ios暂时正常,vivo 和红米都出问题了,退回到4.24就没问题

有进展了么?着急上线,都卡了5天了

回复 碎时UP: 已经和相关同事说了,本地调试的时候有问题吗?

回复 碎时UP: 你重新打包试试看

回复 DCloud_UNI_LXH: 本地调试没有试过,之前重新打包好多遍了都有问题

回复 DCloud_UNI_LXH: 是已经修复了么?

回复 碎时UP: 你云打包试试看

此问题10月16晚已更新云端打包机修复此问题,请勾选“传统打包”重新提交云端打包。

好的感谢

终于给解决了

在处理uni-app在特定设备(如红米K70至尊版)上云打包后出现的页面异常问题时,通常需要考虑设备兼容性、系统特性以及uni-app框架本身的一些特性。以下是一些可能的解决思路和相关的代码案例,帮助你定位并解决问题。

1. 检查设备兼容性

首先,确保你的uni-app项目已经适配了红米K70至尊版的屏幕分辨率和DPI设置。你可以在manifest.json文件中配置屏幕的适配参数:

"window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "UniApp",
    "enablePullDownRefresh": false,
    "onReachBottomDistance": 50,
    "usingComponents": true,
    "pageOrientation": "portrait",
    "statusBarStyle": "light",
    "safeAreaInsetBottom": "auto",
    "autoBackButton": true,
    "system": {
        "autoDarkMode": false, // 是否开启系统暗黑模式
        "statusBarText": "white" // 状态栏文字颜色
    }
}

2. 针对特定设备调整样式

如果页面布局在红米K70至尊版上出现错乱,可能需要针对该设备调整CSS样式。你可以使用媒体查询或者通过JavaScript检测设备型号来动态调整样式。

示例:使用媒体查询调整字体大小

@media only screen and (device-width: 720px) and (device-height: 1600px) and (-webkit-device-pixel-ratio: 2.75) {
    body {
        font-size: 16px; /* 根据实际设备调整 */
    }
}

3. 检查组件和插件的兼容性

确保你使用的所有uni-app组件和第三方插件都支持红米K70至尊版的Android版本。有时候,某些组件或插件可能只在特定版本的Android系统上运行正常。

4. 调试和日志记录

使用HBuilderX的调试工具,在红米K70至尊版上真机调试你的应用。观察控制台输出的日志信息,看是否有错误或警告提示。

5. 更新uni-app和HBuilderX

确保你的uni-app框架和HBuilderX编辑器都更新到最新版本,以获取最新的功能和修复。

结论

由于无法直接获取红米K70至尊版的详细异常信息,以上建议是基于常见问题的通用解决策略。如果问题仍然存在,建议详细记录异常现象,并在uni-app社区或相关论坛寻求更具体的帮助。

回到顶部