uni-app 接入蓝牙扫描枪宽度异常

uni-app 接入蓝牙扫描枪宽度异常

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 win10
HBuilderX类型 正式
HBuilderX版本号 4.87
手机系统 Android
手机系统版本号 Android 14
手机厂商 小米
手机机型 小米
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

操作步骤：

  • app运行后接入蓝牙扫描枪

预期结果：

  • 获取到正常宽度

实际结果：

  • 获取到正常宽度

bug描述：

  • 连接蓝牙扫描枪后，app宽度会发生改变 此时打开新页面会出现宽度异常

Image Image


更多关于uni-app 接入蓝牙扫描枪宽度异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

该bug反馈内容不完整且存在矛盾。问题描述中"实际结果"与"预期结果"均写为"获取到正常宽度"，逻辑矛盾（若实际正常则非bug），需用户澄清实际异常现象。未提供关键信息：具体宽度变化数值、屏幕分辨率、布局代码、蓝牙连接API调用方式及扫描枪型号。
复现步骤过于简略（仅"接入蓝牙扫描枪"），缺乏操作细节（如是否调用uni.startBluetoothScan等API），官方无法复现。分类信息中未明确是uni-app还是uni-app-x项目（Vue2提示可能是uni-app），但缺少核心代码示例，且实际结果描述错误导致无法判断问题真实性。
从知识库看，蓝牙API（如ble文档）主要用于数据传输，不应直接影响UI宽度。可能原因：1) 蓝牙数据触发页面重渲染导致布局错乱；2) Android 14系统级UI适配问题（如全面屏手势冲突）。建议用户补充：1) 复现时屏幕截图及onLoad/onShow生命周期代码；2) 确认是否使用plus.screen等API获取宽度；3) 检查是否因软键盘弹出导致布局压缩（常见于扫码输入场景）。
当前反馈疑似误报或描述错误，需用户提供完整信息。建议先升级HBuilderX至最新版（4.87非最新），并参考蓝牙注意事项确保正确释放蓝牙资源。若问题仍存，请提供可复现代码片段。 内容为 AI 生成，仅供参考

更多关于uni-app 接入蓝牙扫描枪宽度异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


接入扫描枪会重新计算高度宽度 ，宽度计算的少了很多也不会弹出键盘

这是一个典型的蓝牙外设连接后触发系统UI模式变化导致的布局问题。当连接蓝牙扫描枪这类HID设备时，Android系统可能会自动启用“桌面模式”或调整显示密度，从而影响WebView的视口计算。

核心解决方案： 在应用启动时锁定屏幕方向并固定显示模式。

在 pages.json 中配置全局窗口样式：

{
  "globalStyle": {
    "pageOrientation": "portrait", // 锁定竖屏
    "rpxCalcMaxDeviceWidth": 1080, // 设置rpx计算基准
    "rpxCalcBaseDeviceWidth": 375
  }
}

关键修复步骤：

  1. 禁用自动适配： 在 manifest.json 的 app-plus 节点下添加：
"screen": {
  "immersed": false,
  "adjust": false
}
  1. 强制横屏处理（如需要）： 如果扫描枪要求横屏，使用 plus.screen.lockOrientation 主动控制：
// App.vue 或首页
onLaunch() {
  // 锁定横屏
  plus.screen.lockOrientation('landscape-primary');
  
  // 监听设备连接
  uni.onBluetoothDeviceFound(() => {
    // 重新计算布局
    this.$nextTick(() => {
      uni.createSelectorQuery().selectViewport().size(res => {
        // 根据实际尺寸调整布局
      }).exec()
    })
  })
}
  1. CSS媒体查询兜底：
/* 处理横屏样式 */
[@media](/user/media) screen and (orientation: landscape) {
  .container {
    width: 100vh; /* 使用视口高度作为宽度基准 */
    transform: rotate(0deg);
  }
}
回到顶部