低代码平台开发手机蓝牙调试助手

原创

已于 2025-04-25 10:01:17 修改 · 1k 阅读

24 ·

CC 4.0 BY-SA版权

文章标签：

#低代码 #flutter #智能硬件

于 2025-04-24 21:45:02 首次发布

项目介绍

蓝牙调试助手是一个用于蓝牙低功耗（BLE）设备开发和调试的移动应用程序，旨在帮助开发者更高效地进行蓝牙相关项目的调试和分析。

主要功能包括：

蓝牙数据捕获：实时捕获蓝牙设备之间的通信数据，包括连接状态、传输数据等。
数据包分析：解析蓝牙数据包，显示详细信息如信号强度、设备地址、数据内容等。
设备管理：支持对蓝牙设备的扫描、连接、数据收发和断开操作。
实时监控：提供实时的蓝牙设备状态监控，帮助开发者快速定位问题。
配置管理：支持对蓝牙设备的配置参数进行调整和管理。

该工具以图形化界面呈现，操作简单，适用于需要进行蓝牙通信测试和调试的场景。

平台支持

Android
iOS

AiFlutter市场链接：蓝牙调试助手App

蓝牙调试助手APP源码链接：源码下载

平台实现步骤

一、注册登录

打开低代码平台登录网页，使用微信快捷登录或者扫描二维码登录。

二、创建项目

点击【新增项目】>【手动添加】，在平台内部创建项目
在跳出的弹窗中输入项目名称、项目描述，建议结合项目功能描述命名，便于检索
输入完成后点击确定

三、创建页面

（1）点击已经创建好的项目进入到操作界面，默认会存在一个HomePage页面，操作界面相关详情可查看教程操作界面

（2）创建三个页面 AddBleDevice、SetBleName、DeviceNetWork

点击【添加页面】> 【创建页面】
在跳出的弹窗中输入页面名称、页面描述
最后点击确定即可

（4）删除HomePage页面，在【页面管理】中右击要删除的页面，并点击【删除】

（5）设置AddBleDevice为主页面，在【页面管理】中单击要删除的页面，并在右侧的属性编辑器中设置页面路由为/

四、页面设计

AddBleDevice页面设计

效果图

实现流程

1. 在【页面管理】中单击AddBleDevice页面，在右侧的属性编辑器中配置页面描述和功能详情，内容如下

名称

内容

页面描述

整个页面的布局可以是垂直分区的，上半部分是设备扫描区，下半部分是设备列表区。

功能详情

1. 在页面初始化时，会依次执行以下操作

（1）监听蓝牙扫描状态，接收到状态变化后重新构建页面

（2）蓝牙扫描结果监听，接收到扫描结果后进行存储并重新构建页面

（3）开始蓝牙扫描，扫描时长8秒

2. 连接设备，在设备列表中选择设备进行连接，连接成功后跳转到数据收发页面

3. 重新扫描，蓝牙扫描结束后，点击【重新扫描】开始扫描，此时会断开已连接的蓝牙设备

2. 在【页面管理】中单击AddBleDevice页面，在右侧的属性编辑器中添加页面变量

需要定义的变量如下

变量名称	变量类型	是否为数组	默认值	变量描述
devices	Map	是		设备原始数据列表，用来去重
scaning	Bool	否	false	蓝牙扫描状态 true 正在扫描 false 未扫描
deviceList	Map	是		页面显示的设备列表

操作成功如下

3. 添加页面初始化动作，在右侧的属性编辑器中点击【动作】> 【打开】

在操作流程编辑器中，页面初始化 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

动作类型 --【自定义代码块】，添加customCode1自定义代码块并选择

customCode1内容如下

void function() {
    // 控制雷达扫描的动画  
    waterRippleController = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 2),
    );
    radarViewController = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 5),
    );
    // 蓝牙扫描结果处理  
    ble.onScanResults(callbackLast: (event) {
      String name = event.advertisementData.advName;
      // 设备名称过滤  
      String DEVICE_NAME = StorageUtil().read('DEVICE_NAME') ?? '';
      if ((DEVICE_NAME.isNotEmpty &&
              (name == '' || !name.contains(DEVICE_NAME))) ||
          devices.contains(event)) {
        return;
      }
      // 去重操作，防止重复设备添加  
      devices.add(event);
      if (mounted) {
        setState(() {
          // 添加至设备列表  
          deviceList.add({
            "name": event.device.platformName,
            "rssi": event.rssi,
            "mac": mac,
            "raw": event
          });
        });
      }
    });
    // 扫描状态处理  
    ble.isScaning((event) {
      if (mounted) {
        setState(() {
          scaning = event;
        });
        if (event) {
          waterRippleController?.repeat();
          radarViewController?.repeat();
        } else {
          waterRippleController?.stop();
          radarViewController?.stop();
        }
      }
    });
    // 开始扫描  
    ble.status(timeout: const Duration(seconds: 8));
  }

操作成功如下