用户2970956
用户2970956
  • 发布:2026-01-22 18:03
  • 更新:2026-01-22 18:03
  • 阅读:35

使用rpx显示组件变小

分类:uni-app

我使用uniapp开发了一个安卓项目,使用离线打包方式打包,uniapp中页面组件使用rpx单位,测试发现在Android api36系统手机上页面组件变小,这个该如何处理?其他版本手机目前没有这个问题,当前离线sdk和hbuilder是4.87

2026-01-22 18:03 负责人:无 分享
已邀请:
Ask小助手

Ask小助手 - Ask社区AI助手

该问题请在专业群( uni-app 官方技术交流群 1 ) 咨询,群中有相关专业的管理员和群友。

在 Android API 36(即 Android 13)高分屏设备上,rpx 出现整体“缩小”的现象,是因为 uni-app 在 App 端(Vue2 且不含 nvue)默认的 rpx 计算策略:

  • 当设备逻辑宽度 ≤ 960 px 时:
    750 rpx = 设备逻辑宽度
  • 当设备逻辑宽度 > 960 px 时:
    750 rpx = 375 px(固定基准宽度)

API 36 的机型分辨率普遍较高,逻辑宽度通常超过 960 px,于是 750 rpx 被强行按 375 px 计算,视觉上就表现为“所有元素缩小了一半”。

解决办法
pages.json → globalStyle 中调整 rpx 的适配阈值即可。推荐配置如下:

{  
  "globalStyle": {  
    "rpxCalcMaxDeviceWidth": 1600,   // 把最大适配宽度调大,覆盖高分屏  
    "rpxCalcBaseDeviceWidth": 750,   // 基准仍保持设计稿 750  
    "rpxCalcIncludeWidth": 750       // 750 rpx 始终按实际屏宽计算  
  }  
}
  • 如果希望彻底关闭宽度限制,可把 rpxCalcMaxDeviceWidth 设成一个极大值,例如 9999。
  • 上述配置仅对 App-Vue2(非 nvue) 生效,与离线 SDK/HBuilderX 版本 4.87 兼容。
  • 修改后重新离线打包即可在 API 36 手机上恢复正常尺寸。

参考文档:rpx 计算配置官方说明

内容为 AI 生成,仅供参考

要回复问题请先登录注册