-
移动开发
站-
热门城市 全国站>
-
其他省市
-
-
400-636-0069
凌雪
2018-08-02
来源 ：网络
阅读 2482
评论 0
摘要：本文将带你了解WEBAPP开发教程之webapp实现蓝牙串口通讯，希望本文对大家学WEBAPP有所帮助
本文将带你了解WEBAPP开发教程之webapp实现蓝牙串口通讯，希望本文对大家学WEBAPP有所帮助
开发工具
基于hbuilder打包的webapp。
所需知识
了解基本的html，css，js
了解原生android的开发
了解android蓝牙的开发
了解hbuilder的使用
代码实现
摸索了一下，自己写了一个蓝牙串口连接接收数据的小示例。还是希望有大神告知如何开启多线程来接收数据。如果要测试此代码需要自行引入vue.js。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>webapp蓝牙连接</title>
</head>
<body>
<div id="app">
<input type="button" name="" id="" value="连接蓝牙" @click="turnOnBluetooth" />
<br>
<input type="button" name="" id="" value="断开蓝牙" @click="turnOffBluetooth" />
<br>
<input type="button" name="" id="" value="已配对的设备" @click="getConnetedDevices" />
<br>
<input type="button" name="" id="" value="搜索蓝牙" @click="findDevices" />
<br>
<br> 蓝牙状态：{{bluetoothStatusDesc}}<br> 已配对的设备：
<br>
<ul>
<li v-for="device in pairedDevices">
名称：{{device.name}}<br> 地址：{{device.address}}
<br>
<input type="button" value="连接" @click="connDevice(device.address)" />
</li>
</ul>
发现的设备：<br>
<ul>
<li v-for="device in newDevices">
名称：{{device.name}}<br> 地址：{{device.address}}<br>
<input type="button" value="连接" @click="connDevice(device.address)" />
</li>
</ul>
接收的数据：
<div>
<span v-for="data in receiveDataArr">
{{data}}
</span>
</div>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
// 监听plusready事件
document.addEventListener("plusready", function() {
var bluetoothTool = new BluetoothTool();
var mainActivity = plus.android.runtimeMainActivity();
var vm = new Vue({
"el": "#app",
data: {
bluetoothStatus: false,
pairedDevices: [],
newDevices: [],
receiveDataArr: []
},
methods: {
getBluetoothStatus: function() {
this.bluetoothStatus = bluetoothTool.getBluetoothStatus();
},
turnOnBluetooth: function() {
var requestCode = 1;
bluetoothTool.turnOnBluetooth(mainActivity, requestCode);
var that = this;
setTimeout(function() {
that.getBluetoothStatus();
}, 500);
},
turnOffBluetooth: function() {
this.pairedDevices = [];
this.newDevices = [];
this.receiveDataArr = [];
bluetoothTool.turnOffBluetooth();
this.getBluetoothStatus();
},
getConnetedDevices: function() {
this.pairedDevices = bluetoothTool.getConnetedDevices();
},
findDevices: function() {
bluetoothTool.findDevices(mainActivity, this.newDevices);
},
connDevice: function(address) {
var b = bluetoothTool.connDevice(mainActivity, address);
if(b) {
this.readData();
}
},
readData: function() {
bluetoothTool.readData(mainActivity, this.receiveDataCallback);
},
receiveDataCallback: function(data) {
if(this.receiveDataArr.length >= 200) {
this.receiveDataArr = [];
}
this.receiveDataArr.push(data);
}
},
computed: {
bluetoothStatusDesc: function() {
return this.bluetoothStatus ? "已开启" : "已关闭";
}
}
});
}, false);
</script>
<script type="text/javascript">
var BluetoothTool = (function() {
function BluetoothTool() {
var BluetoothAdapter = plus.android.importClass("android.bluetooth.BluetoothAdapter");
this.mAdapter = BluetoothAdapter.getDefaultAdapter();
this.BluetoothAdapter = BluetoothAdapter;
this.BTSocket = null;
}
/**
* 是否支持蓝牙
* @return {boolean}
*/
BluetoothTool.prototype.isSupportBluetooth = function() {
var mAdapter = this.mAdapter;
if(mAdapter != null) {
return true;
}
return false;
}
/**
* 获取蓝牙的状态
* @return {boolean} 是否已开启
*/
BluetoothTool.prototype.getBluetoothStatus = function() {
var mAdapter = this.mAdapter;
if(mAdapter != null) {
return mAdapter.isEnabled();
}
return false;
}
/**
* 打开蓝牙
* @param activity
* @param requestCode
*/
BluetoothTool.prototype.turnOnBluetooth = function(activity, requestCode) {
var mAdapter = this.mAdapter;
if(mAdapter != null && !mAdapter.isEnabled()) {
var Intent = plus.android.importClass("android.content.Intent");
var intent = new Intent(this.BluetoothAdapter.ACTION_REQUEST_ENABLE);
activity.startActivityForResult(intent, requestCode);
}
}
/**
* 关闭蓝牙
*/
BluetoothTool.prototype.turnOffBluetooth = function() {
if(this.mAdapter != null && this.mAdapter.isEnabled()) {
this.mAdapter.disable();
this.BTSocket = null;
}
}
/**
* 获取已经配对的设备
* @return {Array} connetedDevices
*/
BluetoothTool.prototype.getConnetedDevices = function() {
var mAdapter = this.mAdapter;
var connetedDevices = [];
//蓝牙连接android原生对象，是一个set集合
var connetedDevicesAndroid = null;
if(mAdapter != null && mAdapter.isEnabled()) {
connetedDevicesAndroid = mAdapter.getBondedDevices();
}
if(!connetedDevicesAndroid) {
return connetedDevices;
}
//遍历连接设备的set集合，转换为js数组
var invoke = plus.android.invoke;
var it = invoke(connetedDevicesAndroid, "iterator");
while(plus.android.invoke(it, "hasNext")) {
var device = plus.android.invoke(it, "next");
connetedDevices.push({
"name": plus.android.invoke(device, "getName"),
"address": plus.android.invoke(device, "getAddress")
});
}
return connetedDevices;
}
/**
* 发现拉亚设备
* @param {Object} activity 当前活动界面
* @param {Object} newDevices 用于接收发现的设备
*/
BluetoothTool.prototype.findDevices = function(activity, newDevices) {
var mAdapter = this.mAdapter;
var IntentFilter = plus.android.importClass("android.content.IntentFilter");
var BluetoothDevice = plus.android.importClass("android.bluetooth.BluetoothDevice");
var filter = new IntentFilter();
var BroadcastReceiver = plus.android.importClass("android.content.BroadcastReceiver");
var BTReceiver = plus.android.implements("io.dcloud.android.content.BroadcastReceiver", {
"onReceive": function(context, intent) {
plus.android.importClass(context);
plus.android.importClass(intent);
var action = intent.getAction();
//发现了设备
if(BluetoothDevice.ACTION_FOUND == action) {
//从Intent中获取设备的BluetoothDevice对象
var device = intent.getParcelableExtra(BluetoothDevice.EXTRA_DEVICE);
newDevices.push({
"name": plus.android.invoke(device, "getName"),
"address": plus.android.invoke(device, "getAddress")
});
}
}
});
filter.addAction(BluetoothDevice.ACTION_FOUND);
filter.addAction(this.BluetoothAdapter.ACTION_DISCOVERY_FINISHED);
activity.registerReceiver(BTReceiver, filter);
mAdapter.startDiscovery(); //开启搜索
}
/**
* 根据蓝牙地址，连接设备
* @param {Object} address
* @return {Boolean}
*/
BluetoothTool.prototype.connDevice = function(activity, address) {
var invoke = plus.android.invoke;
var mAdapter = this.mAdapter;
var device = invoke(mAdapter, "getRemoteDevice", address);
var UUID = plus.android.importClass("java.util.UUID");
var InputStream = plus.android.importClass("java.io.InputStream");
var OutputStream = plus.android.importClass("java.io.OutputStream");
var BluetoothSocket = plus.android.importClass("android.bluetooth.BluetoothSocket");
var Toast = plus.android.importClass("android.widget.Toast");
var MY_UUID = UUID.fromString("00001101-0000-1000-8000-00805F9B34FB");
var BTSocket = null;
try {
BTSocket = invoke(device, "createRfcommSocketToServiceRecord", MY_UUID);
} catch(e) {
Toast.makeText(activity, "连接失败，获取Socket失败！", Toast.LENGTH_SHORT).show();
return false;
}
try {
invoke(BTSocket, "connect");
Toast.makeText(activity, "连接成功", Toast.LENGTH_SHORT).show();
} catch(e) {
Toast.makeText(activity, "连接失败", Toast.LENGTH_SHORT).show();
try {
BTSocket.close();
BTSocket = null;
} catch(e1) {
}
return false;
}
this.BTSocket = BTSocket;
return true;
}
/**
* 读取数据
* @param {Object} activity
* @param {Function} callback
* @return {Boolean}
*/
BluetoothTool.prototype.readData = function(activity, callback) {
var invoke = plus.android.invoke;
var BTInStream = null,
BTOutStream = null,
BTSocket = this.BTSocket;
var Toast = plus.android.importClass("android.widget.Toast");
if(!BTSocket) {
Toast.makeText(activity, "请先连接蓝牙设备！", Toast.LENGTH_SHORT).show();
return false;
}
try {
BTInStream = invoke(BTSocket, "getInputStream");
BTOutStream = invoke(BTSocket, "getOutputStream");
} catch(e) {
Toast.makeText(activity, "创建输入输出流失败！", Toast.LENGTH_SHORT).show();
try {
BTSocket.close();
BTSocket = null;
} catch(e1) {}
return false;
}
var readThreadState = false;
readData();
return true;
/**
* 模拟java多线程读取数据
*/
function readData() {
if(readThreadState) {
return;
}
var count = 0;
while(invoke(BTInStream, "available") !== 0) {
readThreadState = true;
count++;
var data = invoke(BTInStream, "read");
callback && callback(data, count);
if(count >= 100) {
break;
}
}
readThreadState = false;
requestAnimationFrame(readData);
}
}
return BluetoothTool;
})();
</script>
</body>
</html>
本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注职坐标移动开发之WebApp频道！
喜欢 | 0
不喜欢 | 0
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了，明天再试试吧！
我们会在第一时间安排职业规划师联系您！
您也可以联系我们的职业规划师咨询：
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com，All Rights Reserved.
沪公网安备 31011502005948号
索取资料
答疑解惑
技术交流
职业测评
面试技巧
高薪秘笈
