React Native 蓝牙4.0 BLE开发

本文介绍如何使用react-native-ble-plx库实现React Native应用中的蓝牙功能,包括安装配置、权限申请、蓝牙设备的扫描、连接及数据交互等关键步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

使用react-native-ble-plx库进行开发

安装

yarn add react-native-ble-plx
// 辅助数据发送接收buffer工具类
yarn add buffer
react-native link react-native-ble-plx
复制代码

android

修改build.gradle中的最低sdk版本为18

android {
    ...
    defaultConfig {
        minSdkVersion 18
        ...
复制代码

添加权限

<uses-permission android:name="android.permission.BLUETOOTH"/>
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
<uses-permission-sdk-23 android:name="android.permission.ACCESS_COARSE_LOCATION"/>

<!-- Add this line if your application always requires BLE. More info can be found on:
     https://developer.android.com/guide/topics/connectivity/bluetooth-le.html#permissions
  -->
<uses-feature android:name="android.hardware.bluetooth_le" android:required="true"/>
复制代码

使用

android权限申请

const permissions: Permission[] = ['android.permission.ACCESS_COARSE_LOCATION'];

if (Platform.OS == "android") {
  for (const permission of permissions) {
    const check = await PermissionsAndroid.check(permission);
    console.log(`permission ${permission} check ${check}`);
    if (!check) {
      await PermissionsAndroid.request(permission);
    }
  }
}
复制代码

实例初始化

const bleManager = new BleManager();
复制代码

打开蓝牙

const state = await this.bleManager.state();
if (state == State.PoweredOff) {
  if (Platform.OS == 'android') {
    const enable = await this.bleManager.enable();
    console.log(await this.bleManager.state());
  } else if (Platform.OS == 'ios') {
    // ios不能直接打开,用对话框提示打开蓝牙
  }
}
复制代码

扫描设备

bleManager.startDeviceScan(null, null, async (error, device) => {
    if (error) return console.error(error);
    // 打印设备名称
    console.log(device.name);
});
复制代码

连接设备

uuid连接

bleManager.connectToDevice(id);
复制代码

device连接

device.connect();
复制代码

获取characteristic

const serviceDevice = await device.discoverAllServicesAndCharacteristics();
const services = await serviceDevice.services();
for (const service of services) {
  const serviceUUID = service.uuid;
  // 判断service是否符合
  if (match) {
      const characteristics = await service.characteristics();
      for (const characteristic of characteristics) {
          const characteristicUUID = characteristic.uuid;
          // 判断characteristic是否符合
          if (match) {
              // 获取读或者写characteristic
          }
        }
  }
}
复制代码

数据发送

const array = [0x00, 0x01, ...];
const openValueBase64 = new Buffer(array).toString('base64');
await writeCharacteristic!.writeWithoutResponse(openValueBase64);
复制代码

数据接收

// 监听
readCharacteristic.monitor((error, characteristic) => {
    if (error) return console.error(error);
    const value = characteristic!.value!;
    const buffer = Buffer.from(value, 'base64');
    // 打印读取到的数据
    console.log('read', buffer);
});
复制代码
前言 xi 第1章 初识React Native 1 1.1 React Native 的优点 2 1.2 风险和缺点 4 1.3 小结 4 第2章 React Native 工作原理 5 2.1 React Native 是如何工作的 5 2.2 渲染周期 7 2.3 在React Native 中创建组件 2.4 宿主平台接口 11 2.5 小结 12 第3章 构建你的第一个应用 13 3.1 搭建环境 13 3.2 创建一个新的应用 17 3.3 探索示例代码 24 3.4 开发天气应用 27 3.5 小结 404移动应用组件 42 4.1 类比HTML 元素与原生组件 42 4.2 处理触摸和手势 46 4.3 使用结构化组件 58 4.4 平台特定组件 69 4.5 小结 74 第5章 样式 75 5.1 声明和操作样式 75 5.2 组织和继承 79 5.3 定位和设计布局 81 5.4 小结 91 第6章 平台接口 92 6.1 使用定位接口 93 6.2 使用用户图片与摄像头 6.3 AsyncStore 持久化数据存储 108 6.4 智能天气应用 109 6.5 小结 119 第7章 模块 120 7.1 使用npm 安装JavaScript 类库 120 7.2 iOS 原生模块 121 7.3 Android 原生模块 130 7.4 跨平台原生模块 139 7.5 小结 141 第8章 调试与开发者工具 142 8.1 JavaScript 调试实践和解释 142 8.2 React Native 调试工具 147 8.3 JavaScript 之外的调试方法 152 8.4 测试代码 158 8.5 当你陷入困境 160 8.6 小结 160 第9章 学以致用 161 9.1 闪卡应用 161 9.2 模型与数据存储 168 9.3 使用Navigator 177 9.4 探索第三方依赖 180 9.5 响应式设计与字体尺寸 180 9.6 小结及任务 183 第10章 部署至iOS 应用商店 184 10.1 准备Xcode 工程 184 10.2 上传应用 192 10.3 使用TestFlight 进行Beta 测试 199 10.4 提交应用审核 200 10.5 小结 201 第11章 部署Android 应用 203 11.1 设置应用图标 203 11.2 生成release 版本的APK 205 11.3 通过邮件或链接发布 207 11.4 提交应用至Play 商店 207 11.5 小结 214 总结 215 附录A ES6 语法 216 附录B 命令与快速入门指南 219 作者简介 221 关于封面 221
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值