使用微信小程序控制蓝牙小车(微信小程序端)

目录

  • 使用接口
  • 界面效果
  • 界面设计
  • 界面逻辑设计

使用接口

微信小程序官方开发文档

接口说明
wx.openBluetoothAdapter初始化蓝牙模块
wx.closeBluetoothAdapter关闭蓝牙模块(调用该方法将断开所有已建立的连接并释放系统资源)
wx.startBluetoothDevicesDiscovery开始搜寻附近的蓝牙外围设备
wx.stopBluetoothDevicesDiscovery停止搜寻附近的蓝牙外围设备。若已经找到需要的蓝牙设备并不需要继续搜索时,建议调用该接口停止蓝牙搜索
wx.onBluetoothDeviceFound监听搜索到新设备的事件
wx.createBLEConnection连接蓝牙低功耗设备
wx.closeBLEConnection断开与蓝牙低功耗设备的连接
wx.getBLEDeviceServices获取蓝牙低功耗设备所有服务
wx.getBLEDeviceCharacteristics获取蓝牙低功耗设备某个服务中所有特征 (characteristic)
wx.readBLECharacteristicValue读取蓝牙低功耗设备特征值的二进制数据
wx.writeBLECharacteristicValue向蓝牙低功耗设备特征值中写入二进制数据
wx.showToast显示消息提示框

界面效果

在这里插入图片描述
图片素材库地址
项目目录
项目目录列表

界面设计

  1. app.json中添加一个新页面"pages/home/home"
{"pages":["pages/home/home","pages/index/index","pages/logs/logs"],"window":{"backgroundTextStyle":"light","navigationBarBackgroundColor": "#fff","navigationBarTitleText": "Weixin","navigationBarTextStyle":"black"},"style": "v2","sitemapLocation": "sitemap.json"
}
  1. 设计界面home.wxml
<!--pages/home/home.wxml-->
<button type="primary" class = "connectBLE" bindtap = "openBluetoothAdapter">连接蓝牙</button>
<button class = "disconnectBLE" bindtap = "closeBluetoothAdapter">断开蓝牙</button>  <button class="custom-button" style="bottom: -395px" bindtap = "btnClickDown"><image class="button-image" src="/image/doubledown.png"></image>
</button><button class="custom-button" style="bottom: -15px" bindtap = "btnClickUp"><image class="button-image" src="/image/doubleup.png"></image>
</button><view><button class="custom-button" style="bottom: -60px; left: -35%" bindtap = "btnClickLeft"><image class="button-image-1" src="/image/doubleleft.png"></image></button>
</view><view><button class="custom-button" style="bottom: 40px; left: 35%" bindtap = "btnClickRight"><image class="button-image-1" src="/image/doubleright.png"></image></button>
</view><view><button class="custom-button" style="bottom: 134px; left: 0%" bindtap = "btnClickStop"><image class="button-image-2" src="/image/remove.png"></image></button>
</view>
  1. 画面渲染home.wxss
/* pages/home/home.wxss */
.connectBLE {width: 49% !important;float: left;font-size: 100;
}.disconnectBLE {width: 49% !important;float: right;font-size: 100;color: red;
}.custom-button {position: relative;width: 100px;height: 100px;border: none;padding: 0;overflow: hidden;background: transparent;   /*设置背景颜色一致*/border-color: transparent; /*设置边框颜色一致*/
}.button-image {object-fit: contain;width: 75%;height: 110%;
}.button-image-1 {object-fit: contain;width: 75%;height: 110%;
}.button-image-2 {object-fit: contain;width: 60%;height: 100%;
}

界面逻辑设计

连接的目标蓝牙名称为ESP_SPP_SERVER

// pages/home/home.js
Page({/*** 页面的初始数据*/data: {connected: false,serviceId: "",},//蓝牙初始化openBluetoothAdapter() {if(this.data.connected){return}wx.openBluetoothAdapter({success: (res) => {console.log('bluetooth initialization success', res)this.startBluetoothDevicesDiscovery()},fail: (err) => {wx.showToast({title: '蓝牙适配器初始化失败',icon: 'none'})return}})},//关闭蓝牙初始化closeBluetoothAdapter() {wx.closeBluetoothAdapter({success: (res) => {console.log('bluetooth deinitialization success', res)},fail: (err) => {wx.showToast({title: '蓝牙适配器解初始化失败',icon: 'none'})return}})},//开始搜寻附近的蓝牙外围设备startBluetoothDevicesDiscovery() {wx.startBluetoothDevicesDiscovery({success: (res) => {console.log('startBluetoothDevicesDiscovery success', res)this.onBluetoothDeviceFound()},fail: (err) => {wx.showToast({title: '蓝牙适配器解初始化失败',icon: 'none'})return}})},//监听搜索到新设备的事件onBluetoothDeviceFound() {let found_device = falseconst timer = setTimeout(() => {if (!found_device) {console.error('未找到设备');wx.showToast({title: '未找到设备',icon: 'none'})}}, 2000); // 设置定时器为10秒wx.onBluetoothDeviceFound((res) => {res.devices.forEach(device => {if (device.name === 'ESP_SPP_SERVER') {console.log('find target device')found_device = true; // 找到目标设备,将标志变量设置为已找到clearTimeout(timer); // 取消定时器this.createBLEConnection(device.deviceId)}});});},//连接蓝牙低功耗设备createBLEConnection(deviceId) {wx.createBLEConnection({deviceId,success:() => {this.setData({connected: true,})console.log('connect device success')this.getBLEDeviceServices(deviceId)wx.stopBluetoothDevicesDiscovery()},fail:(err) => {wx.showToast({title: '建立蓝牙连接失败',icon: 'none'})}})},//获取蓝牙低功耗设备所有服务getBLEDeviceServices(deviceId) {wx.getBLEDeviceServices({deviceId,success:(res) => {for (let i = 0; i < res.services.length; i++) {if(res.services[i].isPrimary) {this.getBLEDeviceCharacteristics(deviceId, res.services[i].uuid)return}}},fail:(res) => {console.log('getBLEDeviceServices fail', res.errMsg)}})},//获取蓝牙低功耗设备某个服务中所有特征getBLEDeviceCharacteristics(deviceId, serviceId) {wx.getBLEDeviceCharacteristics({deviceId,serviceId,success: (res) => {for (let i = 0; i < res.characteristics.length; i++) {let item = res.characteristics[i]if(item.properties.read) {wx.readBLECharacteristicValue({deviceId,serviceId,characteristicId: item.uuid,})}if(item.properties.write){this._deviceId = deviceIdthis._serviceId = serviceIdthis._characteristicId = item.uuid}}},fail:(res) => {console.log('get characteristicId fail', res.errMsg)}})},//关闭蓝牙服务closeBluetoothAdapter() {wx.closeBLEConnection({deviceId: this._deviceId,success: (res) => {console.log('disconnect success')},fail: (res) => {console.log('disconnect fail',res.errMsg)}})wx.closeBluetoothAdapter({success: (res) => {console.log('close success')},fail: (res) => {console.log('close fail',res.errMsg)}})this.data.connected = falseconsole.log('close connection')},btnClickDown() {this.tipsBluetoothWarn()this.writeBluetoothValue('down')console.log('click down')},btnClickUp() {this.tipsBluetoothWarn()this.writeBluetoothValue('up')console.log('click up')},btnClickLeft() {this.tipsBluetoothWarn()this.writeBluetoothValue('left')console.log('click left')},btnClickRight() {this.tipsBluetoothWarn()this.writeBluetoothValue('right')console.log('click right')},btnClickStop() {this.tipsBluetoothWarn()this.writeBluetoothValue('stop')console.log('click stop')},tipsBluetoothWarn(){if(!this.data.connected){wx.showToast({title: '蓝牙未连接',icon: 'none'})}},writeBluetoothValue(value) {if(!this.data.connected){return}const buffer = new ArrayBuffer(value.length)const dataView = new DataView(buffer)for (let i = 0; i < value.length; i++) {dataView.setUint8(i, value.charCodeAt(i))}wx.writeBLECharacteristicValue({deviceId: this._deviceId,serviceId: this._serviceId,characteristicId: this._characteristicId,value: buffer,success (res) {console.log('writeBLECharacteristicValue success', res.errMsg)},fail (res) {console.log('writeBLECharacteristicValue fail', res.errMsg, res.errCode)}})},/*** 生命周期函数--监听页面加载*/onLoad(options) {},
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/187661.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

初识RabbitMQ - 安装 - 搭建基础环境

RabbitMQ 各个名词介绍 Broker&#xff1a;接收和分发消息的应用&#xff0c;RabbitMQ Server 就是 Message Broker Virtual host&#xff1a;出于多租户和安全因素设计的&#xff0c;把 AMQP 的基本组件划分到一个虚拟的分组中&#xff0c;类似于网络中的 namespace 概念。当…

基于超宽带技术的人员定位系统源码,spring boot+ vue+ mysql定位系统源码

​UWB定位技术源码 超宽带技术的人员定位系统源码 UWB人员定位系统是一种基于超宽带技术的人员定位系统&#xff0c;它通过发送和接收超短脉冲信号&#xff0c;在测距方面可以达到微米级精度。这种系统通常需要具备高精度的定位能力&#xff0c;通常需要达到微米级别&#xff0…

整治PPOCRLabel中cv2文件读取问题(更新中)

PPOCRLabel 使用PPOCRLabel对ocr预标注结果进行纠正由于PaddleOCR代码库十分混乱,路径经常乱调pip和代码库的代码&#xff08;pip库和源码冲突&#xff09;,经常报错&#xff0c;因此paddleocr和ppocrlabel都是使用pip包; 安装 pip install PPOCRLabel2.1.3启动 PPOCRLabel…

Azure 机器学习 - 使用自动化机器学习训练计算机视觉模型的数据架构

目录 一、用于训练的数据架构图像分类&#xff08;二进制/多类&#xff09;多标签图像分类对象检测实例分段 二、用于联机评分的数据架构输入格式输出格式图像分类&#xff08;二进制/多类&#xff09;多标签图像分类对象检测实例分段 在线评分和可解释性 (XAI) 的数据格式支持…

【算法与数据结构】93、LeetCode复原 IP 地址

文章目录 一、题目二、解法三、完整代码 所有的LeetCode题解索引&#xff0c;可以看这篇文章——【算法和数据结构】LeetCode题解。 一、题目 二、解法 思路分析&#xff1a;参照【算法与数据结构】131、LeetCode分割回文串的思路&#xff0c;需要将IP字符串进行分割&#xff0…

Clickhouse学习笔记(4)—— Clickhouse SQL

insert insert操作和mysql一致 标准语法&#xff1a;insert into [table_name] values(…),(….)从表到表的插入&#xff1a;insert into [table_name] select a,b,c from [table_name_2] update 和 delete ClickHouse 提供了 Delete 和 Update 的能力&#xff0c;这类操作…

[LeetCode]-225. 用队列实现栈-232. 用栈实现队列

目录 225. 用队列实现栈 题目 思路 代码 232. 用栈实现队列 题目 思路 代码 225. 用队列实现栈 225. 用队列实现栈 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/problems/implement-stack-using-queues/description/ 题目 请你仅使用两个队列实现一个后…

另辟奚径-Android Studio调用Delphi窗体

大家都知道Delphi能调用安卓SDK&#xff0c;比如jar、aar等&#xff0c; 但是反过来&#xff0c;能在Android Studio中调用Delphi开发的窗体吗&#xff1f; 想想不太可能吧&#xff0c; Delphi用的是Pascal&#xff0c;Android Studio用的是Java&#xff0c;这两个怎么能混用…

SFTP远程终端访问

远程终端访问 当服务器部署好以后&#xff0c;除了直接在服务器上操作&#xff0c;还可以通过网络进行远程连接访问CentOS 7默认支持SSH(Secure Shell, 安全Shell 协议),该协议通过高强度的加密算法提高了数据在网络传输中的安全性&#xff0c;可有效防止中间人攻击(Man-in-th…

机器学习算法——线性回归与非线性回归

目录 1. 梯度下降法1.1 一元线性回归1.2 多元线性回归1.3 标准方程法1.4 梯度下降法与标准方程法的优缺点 2. 相关系数与决定系数 1. 梯度下降法 1.1 一元线性回归 定义一元线性方程 y ω x b y\omega xb yωxb 则误差&#xff08;残差&#xff09;平方和 C ( ω , b ) …

快速修复因相机断电导致视频文件打不开的问题

3-5 本文主要解决因相机突然断电导致拍摄的视频文件打不开的问题。 在日常工作中&#xff0c;有时候需要使用相机拍摄视频&#xff0c;比如现在有不少短视频拍摄的需求&#xff0c;如果因电池突然断电的原因&#xff0c;导致拍出来的视频播放不了&#xff0c;这时候就容易出大…

Linux系统初步了解

Linux系统由4个主要部分组成&#xff1a;内核、Shell、文件系统和应用程序。 本专题主要是围绕这四个来展开的。 POSIX&#xff08;可移植操作系统接口&#xff09;定义了操作系统应该为应用程序提供的标准接口&#xff0c;其意愿是获得源码级别的软件可移植性。所以Linux选择…

ubuntu上如何移植thttpd

thttpd的特点 thttpd 是一个简单、小巧、便携、快速且安全的 HTTP 服务器。 简单&#xff1a; 它只处理实现 HTTP/1.1 所需的最低限度。好吧&#xff0c;也许比最低限度多一点。 小&#xff1a; 请参阅比较图表。它还具有非常小的运行时大小&#xff0c;因为它不会分叉并且非…

Springboot+vue的高校办公室行政事务管理系统(有报告)。Javaee项目,springboot vue前后端分离项目。

演示视频&#xff1a; Springbootvue的高校办公室行政事务管理系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot vue前后端分离项目 项目介绍&#xff1a; 本文设计了一个基于Springbootvue的高校办公室行政事务管理系统&#xff0c;采用M&#xff08;m…

5 Paimon数据湖之表数据查询详解

更多Paimon数据湖内容请关注&#xff1a;https://edu.51cto.com/course/35051.html 虽然前面我们已经讲过如何查询Paimon表中的数据了&#xff0c;但是有一些细节的东西还需要详细分析一下。 首先是针对Paimon中系统表的查询&#xff0c;例如snapshots\schemas\options等等这些…

【每日OJ—— 206. 反转链表(链表)】

每日OJ—— 206. 反转链表&#xff08;链表&#xff09; 1.题目&#xff1a;206. 反转链表&#xff08;链表&#xff09;2.方法讲解&#xff1a;2.1解法&#xff1a;2.1.1.图文解析2.1.2.代码实现2.1.3.提交通过展示 1.题目&#xff1a;206. 反转链表&#xff08;链表&#xff…

LoRAShear:微软在LLM修剪和知识恢复方面的最新研究

LoRAShear是微软为优化语言模型模型(llm)和保存知识而开发的一种新方法。它可以进行结构性修剪&#xff0c;减少计算需求并提高效率。 LHSPG技术&#xff08; Lora Half-Space Projected Gradient&#xff09;支持渐进式结构化剪枝和动态知识恢复。可以通过依赖图分析和稀疏度…

Sentinel网关限流

背景 在微服务架构下&#xff0c;每个服务的性能都不同&#xff0c;为避免出现流量洪峰将服务冲垮&#xff0c;需要依赖限流工具来保护服务的稳定性。sentinel是阿里提供的限流工具&#xff0c;社区活跃&#xff0c;功能也很全面&#xff0c;包含实时监控、流控、熔断等功能。…

基于SpringBoot+Redis的前后端分离外卖项目-苍穹外卖(二)

新增员工功能开发 1. 新增员工1.1 需求分析和设计1.1.1 产品原型1.1.2 接口设计1.1.3 表设计 1.2 代码开发1.2.1 设计DTO类1.2.2 Controller层1.2.3 Service层接口1.2.4 Service层实现类1.2.5 Mapper层 1.3 功能测试1.3.1 接口文档测试 1.4 代码完善1.4.1 问题一1.4.2 问题二1.…

PyGWalker :数据分析中最优秀工具库!

假设你在 Jupyter Notebook 中有一堆数据需要分析和可视化。PyGWalker 就像一个神奇的工具&#xff0c;使这一切变得非常容易。它接受你的数据并将其转换成一种特殊的表格&#xff0c;你可以像使用 Tableau 一样与之交互。 你可以通过视觉方式探索数据&#xff0c;进行互动&am…