RN使用蓝牙扫描

萧寂173

已于 2024-04-12 17:55:07 修改

阅读量876

点赞数 10

分类专栏： react 文章标签： react native

于 2024-04-10 20:31:41 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_68658847/article/details/137608284

版权

本文介绍了如何在ReactNative项目中使用`react-native-ble-plx`插件进行蓝牙设备扫描，获取设备电量，并处理权限请求和设备连接。开发者需在AndroidManifest.xml中添加相关权限，并封装蓝牙操作函数以实现实时电量显示。

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

我项目需要用到蓝牙模块,蓝牙扫描到设备并且获取到电量显示到页面上,因此我做了如下demo,使用了react-native-ble-plx这个插件点击进入官方文档官方文档

1.安卓环境配置(ios暂定,还没做ios,不过下面的方法是兼容的,自行配置ios权限)
android/app/src/main/AndroidManifest.xml加入以下权限代码

  <uses-permission android:name="android.permission.BLUETOOTH" />
  <uses-permission android:name="android.permission.BLUETOOTH_ADMIN" />
  <uses-permission android:name="android.permission.BLUETOOTH_SCAN" />

2.封装蓝牙相关模块工具包

import {
   BleManager} from 'react-native-ble-plx'; // 引入蓝牙模块
import {
   PermissionsAndroid, Platform} from 'react-native';
import {
   Buffer} from 'buffer';
// 下面这两个常量为了获取设备的电量信息(每个人设备不一样,这里仅作参考)
const batteryServiceUUID = '0000180f-0000-1000-8000-00805f9b34fb'; // 电量服务的UUID
const batteryLevelCharacteristicUUID = '00002a19-0000-1000-8000-00805f9b34fb'; // 电量特征的UUID

// 授权(位置,蓝牙扫描,蓝牙连接三个权限,但是我这目前有一个问题,蓝牙连接和蓝牙扫描权限会重复弹出两次框,这个bug后期再改)
const bleManager = new BleManager();
// 位置信息和蓝牙权限信息(请求权限)
export const requestPermissions = async callback => {
   
  if (Platform.OS === 'ios') {
   
    return true;
  }
  if (
    Platform.OS === 'android' &&
    PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION
  ) {
   
    const apiLevel = parseInt(Platform.Version.toString(), 10);

    if (apiLevel < 31) {
   
      const granted = await PermissionsAndroid.request(
        PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
      );
      callback(granted === PermissionsAndroid.RESULTS.GRANTED)
    }
    if (
      PermissionsAndroid.PERMISSIONS.BLUETOOTH_SCAN &&
      PermissionsAndroid.PERMISSIONS.BLUETOOTH_CONNECT
    ) {
   
      const result = await PermissionsAndroid.requestMultiple([
        PermissionsAndroid.PERMISSIONS.BLUETOOTH_SCAN,
        PermissionsAndroid.PERMISSIONS.BLUETOOTH_CONNECT,
        PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
      ]);

      callback(
        result['android.permission.BLUETOOTH_CONNECT'] ===
          PermissionsAndroid.RESULTS.GRANTED &&
          result['android.permission.BLUETOOTH_SCAN'] ===
            PermissionsAndroid.RESULTS.GRANTED &&
          result['android.permission.ACCESS_FINE_LOCATION'] ===
            PermissionsAndroid.RESULTS.GRANTED,
      );
      return
    }
  }

  this.showErrorToast('Permission have not been granted');
  callback(false);