uniapp实现蓝牙自动连接并获取心电图（代码篇）

原创

已于 2024-06-04 09:37:42 修改 · 949 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#uni-app #javascript #开发语言

于 2024-05-29 11:05:59 首次发布

我们最近的项目是需要写一个app和公司设备通过蓝牙连接，并且获取到心电图，这次是实现自动的，用户在第一次的时候需要点击连接蓝牙实现自动连接，后续更是不需要点击直接获取心电图，直接上代码，供大家参考！

<template>
	<view>
		<page-head :title="title"></page-head>
		<!-- 心电图显示区 -->
		<view class="displayarea">
			心电图显示区
			<view class="container">
				<canvas canvas-id="grids" style="width: 750rpx; height: 750rpx;"></canvas>
			</view>
			</view>
		<!-- <view style="background-color: red;">心率：{
   
   {
   
   heartRateData[heartRateData.length-1]}}</view> -->
		<canvas canvas-id="waveform" id="waveform" style="width: 500px; height: 400px; margin: 0 auto"></canvas>
		<view class="uni-padding-wrap uni-common-mt">
			<!-- button class="heartrate">心率</button> -->
			<view class="uni-btn-v">
				<button type="primary" :disabled="disabled" @click="openBluetoothAdapter">连接蓝牙</button>
				<button type="primary" :disabled="!disabled" @click="closeBLEConnection">断开蓝牙设备</button>
				<button type="primary" :disabled="!disabled" @click="closeBluetoothAdapter">关闭蓝牙模块</button>
			</view>
		</view>
		<!-- 遮罩 -->
	</view>
</template>
<script>
	let num = 0;
	let timer = null;
	export default {
   
   
		data() {
   
   
			return {
   
   
				title: 'bluetooth',
				disabled: false,
				deviceId: '',
				serviceId: '0000FFF0-0000-1000-8000-00805F9B34FB',
				writeCharacteristicsId: '',
				connectCharacteristicsId: '',
				characteristicId: '0000FFF1-0000-1000-8000-00805F9B34FB',
				heartRateData: [],
				macAddress: '',
				macValue: '',
				valueChangeData: {
   
   
					value: ''
				},
				extraLine: [],
			};
		},
		
		onLoad() {
   
   
			this.setOnBLECharacteristicValueChange();
			
			this.openBluetoothAdapter()
		},
		onShow() {
   
   
			const ctx = uni.createCanvasContext('waveform', this);
			if(timer != null){
   
   
				clearInterval(timer);
			}
			timer = setInterval(() => {
   
   
				if (this.heartRateData.length) {
   
   
					this.drawLine(ctx, this.heartRateData)
				}
			}, 50)
		},
		beforeDestroy() {
   
   
			clearInterval(timer);
			timer = null;
			this.closeBLEConnection()
			uni.closeBluetoothAdapter()
			
		},
		methods: {
   
   
			moveHandle() {
   
   },
			/**
			 * 关闭遮罩*/
			maskclose() {
   
   
				this.maskShow = false;
			},
			/**
			 * 选择设备*/
			queryDevices() {
   
   
				// this.newDeviceLoad = true;
				this.showMaskType = 'device';
				this.maskShow = true;
			},
			tapQuery(item) {
   
   
				if (this.showMaskType === 'device') {
   
   
					this.$set(this.disabled, 4, false);
					if (this.equipment.length > 0) {
   
   
						this.equipment[0] = item;
					} else {
   
   
						this.equipment.push(item);
					}
					this.newDeviceLoad = false;
				}
				if (this.showMaskType === 'service') {
   
   
					this.$set(this.disabled, 6, false);
					if (this.servicesData.length > 0) {
   
   
						this.servicesData[0] = item;
					} else {
   
   
						this.servicesData.push(item);
					}
				}
				if (this.showMaskType === 'characteristics') {
   
   
					this.$set(this.disabled, 7, false);
					if (this.characteristicsData.length > 0) {
   
   
						this.characteristicsData[0] = item;