微信小程序蓝牙温度数据采集陈拓 2019/6/2-2019/6/150.概述本文是树莓派蓝牙温度传感器的后续文章，请按先后顺序看，该文档的网址是:https:/wenku.baidu.com/view/423628b3905f804d2b160b4e767f5acfa0c783c1o本文不讲述小程序的基本知识和编程语法，需要事先熟悉。下面本文的最后效果：16：27mi中田电信令传感器散据采壕已发观1个外国设备:传感需数据来笑停止扫描201/06/14 16.02.07 2010/06/14 16:02:07 2Q19/06/14 160215 2D19/05/14 16：J2:24 201/06/14 16:02:35 2010/06/14 16:02:47 2Q19/08/14 16:J2:59 2019/06/14 16:03:17 201/06/14 1E：3：23 20ISA16/14 ie：d3:29 2019/08/14 16: 微信web开发者工具微信开发者工具V1.02.1902010欢迎使用微信开发者二套用手机微信扫描登录 在电脑屏幕上打开小程序开发工具: 点击大“ + ”号项目名称：ble-data-acquisitionO不使用躇小程序元开发序云开发方开绿牲牛蛙庠.耳褂0云团gHNl云虽持.无整 程滞,固宅二缠供的AH进行枝心业勘崔,即可族小程序宝逗上芸和 造代.了桩三乞J5tY5lSCnp1新建 填写AppID 打开网页 https:/mp.weixin.qq.com/登录 用小程序账号（不是公众号账号）登录微信公众平台，进入小程序后台 如果没有账号就去申请注册。 点击开发 开发设置就可以看到你自己的AppID（小程序ID）在“新建项目”界面填写AppID，其他保持默认。注意：小程序名称和图标也在这里设置。注意：微信只支持低功耗蓝牙BLE，不支持经典的蓝牙。 熟悉开发工具的目录和文件打开开发工具index目录： 点击“新建”按钮归 ps.gsst 巳 iid exEm邛f idax.j：5Cn1G& utilsj uti sapp.js非叩如aDp.wosM praj&;t.ccnfi-; sen我们可以看到最上面有一个pages (页面)目录，这个目录里面包括了小程序所有的界面， index目录是起始页面。每个页面包括4个文件3个必须文件： index.wxml对应index.htm 1，主要负责本页面的界面展示 以及事件的绑定等等。 index.wxss对应index.css，主要负责页面的样式，与wxml文件一起使用，优 化wxml页面。 index.js就是js文件，主要负责本页面的业务逻辑，包括生命周期，事件的绑 定处理，数据的初始化等等。1个可选文件：index.json：主要是负责本界面的基本配置，设置页面标题等功能。json文件不是必须的 一般情况下我们只需要用全局配置的app.json文件配置就可以了。在图中还有一个utils的目录：可以看出utils和pages文件是并列的，所以他就不代表 页面的信息了，里面只有一个js文件。这个js文件其实就是把代码模块化了，已经有的 代码是将日期的转换封装好了，直接引入使用就可以了。最后剩下一系列app的文件，app.js app.wxss app.json代表的信息和上面的pages里 面的页面文件夹中的其实差不多，只是pages里面的代表的仅仅是某个界面的配置，而app 的代表的是这个项目的配置。 找一个官方DEMO测试 wx.getBLEDeviceServices(Object object)https:/developers.weixin.qq.Com/miniprogram/dev/api/device/bluetooth/w x.getBLEDeviceServices.html简易教程框架 沮彳牛 API 工童小程序，云丑发wx.getBLEDeviceServices(ObJect object)支持场本=1.1.0获取蓄牙设备巨斤有服努servicejo滚动到最后面:在开发者工具U预览效果 点击“在开发工具中预览效果”，导入代码片段:ffirfaBI*.O2.1Ki20W朗 S+t J0U H MB 切 B齐却IMd+S-az：-WF= 戚珂止 -U p fl*十 Q11:12iw% Ml-曲cC心每开始杉瓶* & bdswJS- nMxjft t 1 fW 网 r4Qe,WHTil! E#忡啊M 3PPIBU apptnnF脚州女闻rorAjjMTi序止丘瓶蛇束vt程a项J 电iFhWtTH.S -I * - S切就在 M字底t：言理己醐0朴bffi玻1 RCanisia gsuvnn hlftworkLtKuilyApCaha Aurii B |I心0%cf，| Fih-民 In-rla *0*Vca-ODH Ahil、Khw MM因为涉及到蓝牙硬件，所以不能用模拟器调试，下面我们把这个代码片段添加到前面创建的 项目中。图片位置 在pages下面建一个文件夹images，把图片集中放在这里。名称afflDDDDpagesapp-jsapp.jsonapp.wxsssitemap.json名称displays.i images.indxIS 归Ecsnbleb-a cks.jpgmffter.png添加页面下面我们添加一个目录scanble和一组4个页面文件scan，我们不用去创建scan页面相 关的文件scan.js、scan.wxss和scan.wxml，点击打开app.json文件就可以自动创建 一个小程序空白页面。app.json 是一个数组，由pages和window组成。找到pages数组，它里面所存放的就是一个个页面的名称了，如图：appjsor? X2 -pages-!：3 pa ses/inte x/i index4 pa ges/logs / logs15 backgrou 1 ight118 na visat ion Ba r Baclcero un dCo lorn:也闩干、snavigatIm阮ftitieiext-： ,BheriatB,】10rn 口 UtilEwE( app.jsflnwm aop.wxssW przject.cinfic .sonapp.json文件中的windows用于设置小程序的状态栏、导航条、标题、窗口背景色。修改 导航栏标题将“WeChat”改为“传感器数据采集”，保存（trl+s），模拟器界面自动刷新。 修改scan页面代码把导入的代码片段index页面的4个文件内容复制到相应的scan页面代码中。 页面跳转前面我们说过了，pages数组里面，哪个路径在第一个就先显示那个路径对应的界面，index 在第一个，所以小程序先显示页面index.wxml，我们再转到scan.wxml。为了实现点击跳转，我们把“ Hello World ”改造成“开始”按钮。修改 index.wxml：ie11 12 text cla&s=u.er-motto/text）13 15jsermctte- contain erIE17修改 index.wxss：19 . usennotto |