电子工程师技术服务社区
公告
登录
|
注册
首页
技术问答
厂商活动
正点原子
板卡试用
资源库
下载
文章
社区首页
文章
如何制作一个空气净化器
分 享
扫描二维码分享
如何制作一个空气净化器
NRF52832
蓝牙
DIY
皮皮学电子
关注
发布时间: 2020-06-18
丨
阅读: 1732
![](https://cf01.ickimg.com/bbsimages/202006/f0e1ae4a4a8d4e6b6d7ca46609fb4ab5.jpg) ------------ # 结构篇 首先我们需要给空气净化器设计一个外壳,这个外壳需要容纳所有需要的设备(滤芯,风扇,控制电路以及电源),并且有一个合适的价格并且易于加工。于是我选择了4mm厚的椴木层板,不仅价格便宜,做成净化器之后结构的刚度也十分不错。在某宝上可以找到很多家做木板激光切割的,只需要设计好图纸之后即可找厂家加工出满意的成品。 ![](https://cf01.ickimg.com/bbsimages/202006/d70925ff676088dd3734ecf94e04fbf3.jpg) 那么我们首先需要绘制出需要的图纸,这些切割厂家一般接受的都是矢量图纸,所以在这里我使用autoCAD来绘制空气净化器的图纸 ![](https://cf01.ickimg.com/bbsimages/202006/412510fed09961e51ad2780e9cd27234.png) 在打开CAD软件之后,我们简单的绘制出净化器的表面结构 ![](https://cf01.ickimg.com/bbsimages/202006/70a33a771c6cf5904cabb9e18b290472.png) 其实结构非常简单,就是几块形状,然后上面绘制出一些花纹供滤芯进气使用,同样的为了显示各种空气数据,我给显示屏预留了一个圆形窗口,如红色箭头所示。而最右侧的一块形状则是预留出的门扇,供更换滤芯时使用 ![](https://cf01.ickimg.com/bbsimages/202006/9705acf52ed1d2a65d5307b42c5edf81.png) 接下来就是绘制一下净化器的中间横向隔板,主要用来放置风扇以及滤芯。而为了契合加工厂的图纸要求(椴木层板一般在880*450mm左右),我索性在一张板子上绘制了两套净化器的横向隔板,如下图所示:主要含有两套净化器的所有横向隔板,包括承载滤芯的隔板、安装风扇的隔板以及出风口隔板。还有一些小零件主要用于整体结构加强 ![](https://cf01.ickimg.com/bbsimages/202006/fab4b5fb6afeffd725ae4ddcfb1c4fff.png) 到这里所有的图纸就绘制完毕了,这个图纸在结尾的资料链接里面可以下载,不过需要注意的是,这个图纸可以制作出两台空气净化器,并且全部断点已经打好,可以直接发给加工厂加工。 ![](https://cf01.ickimg.com/bbsimages/202006/f4f68d3a7ea7af02aae4827c97ba94e5.png) 等待了几天之后,我收到了加工厂发回的板子 ![](https://cf01.ickimg.com/bbsimages/202006/6e6f7709a861740cd4b6c899c401809a.jpg) 首先我们将零件从木板上掰下来,一套净化器的材料大约有这么多 ![](https://cf01.ickimg.com/bbsimages/202006/022dab9de94a1334a0523b6617eb6c1c.jpg) 然后准备开始安装,首先我架起两面木板,并且装上滤芯隔板以及风扇隔板(下部为滤芯隔板,上部为风扇隔板) ![](https://cf01.ickimg.com/bbsimages/202006/b1488ee51f43314fda1455e526cdc52e.jpg) 由于风扇隔板之上需要安装风扇以及其他的电子设备,所以我设计了几根加强筋辅助固定 ![](https://cf01.ickimg.com/bbsimages/202006/a23fed91b6c8ef0007a80e7a5b91b234.jpg) 接着装上背板以及出风口隔板,用胶带缠绕先做简单固定,观察看看是否有尺寸以及设计上的问题(此角度是从净化器背面拍摄,下部预留的位置方便更换滤芯用) ![](https://cf01.ickimg.com/bbsimages/202006/a73c12711fba2631c8c8404fa969b8d8.jpg) 来一张斜45度照片,从这个角度大概可以看出净化器大概的样子 ![](https://cf01.ickimg.com/bbsimages/202006/d3b597bbdd5b9fcf37bfc28b5f13f781.jpg) 滤芯隔板特写,安装了一些加强筋以及滤芯定位挡板 ![](https://cf01.ickimg.com/bbsimages/202006/3a0cd1a66b271cf741fadca3f22c9149.jpg) 净化器内部仰视照片,可以看到预留出的风扇孔 ![](https://cf01.ickimg.com/bbsimages/202006/69f94205cdad0b73b926577ac35af0a3.jpg) 拆下出风口隔板,所有的电子设备以及风扇都会安装在这里,左上角的小台子为了固定电源线用 ![](https://cf01.ickimg.com/bbsimages/202006/4e3db1bddf88a6d7320788c0b4c832ad.jpg) 将净化器翻过来,准备固定密封条,可见底板上已经刻好了密封条的安装位置 ![](https://cf01.ickimg.com/bbsimages/202006/b64a363c1a9b72792972d3388efbbafd.jpg) 网上购买的密封条,高度是12mm ![](https://cf01.ickimg.com/bbsimages/202006/43f6d5740aad7df7026e3482c6dd7f77.jpg) 直接粘接到木板刻线处 ![](https://cf01.ickimg.com/bbsimages/202006/0e389b717bd3f0a54bc0d36bb3e1a9ca.jpg) 塞入买来的标准滤芯,看到大体上没啥问题 ![](https://cf01.ickimg.com/bbsimages/202006/bce34db5d8fa44f506d0a9420dc8c873.jpg) 门板我直接用小合页+502粘上了,结实程度没啥问题 ![](https://cf01.ickimg.com/bbsimages/202006/dd0354907d0dc816c2592fdf7ea3fcec.jpg) 关门的样子 ![](https://cf01.ickimg.com/bbsimages/202006/058eb1d7dc058c1133d6e553ebe51522.jpg) 组装没发现啥设计上的问题。这个净化器在设计上基本上采用类似榫卯的结构,一是保证了结实程度,二是可以尽量减少胶水的使用,在粘接各个部件上我使用的是UHU胶,也是一种常见的模型胶水 ![](https://cf01.ickimg.com/bbsimages/202006/95304e5a4733eede39713d29d8aee927.jpg) 到这里净化器的外形结构就基本做好了,接下来我们看如何开发电路部分 ------------ # 电路篇 一个设备除了有好的外观之外,内在也是尤为重要的一环。所以选择一款好的“大脑”也是电路设计上的重中之重,我这一次用的是Nordic的一款低功耗蓝牙芯片—NRF52832,至于为什么使用蓝牙而不是wifi,主要原因在于两个方面:一是功耗低,二是后期可以和多个智能设备进行蓝牙mesh网的组建。 NRF52832作为一款多模芯片,既可以和我们日常生活中常用的NRF24L01进行通信,又可以烧录蓝牙协议栈,摇身一变成为支持低功耗蓝牙的设备。并且内置的Cortex-M4F内核,也是对于开发十分友好的,除此之外,自带NFC标签功能、众多的外设以及超低的功耗就不多赘述了。 大家都知道对于射频芯片来说,外围电路的设计着实令人头疼,迷你的外围元件焊接起来很是费劲,没有显微镜基本上无法焊接,所以这里偷了个小小的懒,直接去某宝上买了一个模块回来,这个模块集成了NRF52832的一些外围电路,留出了所有IO口,便于后期开发 ![](https://cf01.ickimg.com/bbsimages/202006/55165b1d13d25a4cbb9feedee35a1fbe.jpg) 于是紧接着,我们要明确空气净化器的功能以及选购相关的部件,有了功能需求,才好设计电路。 首先净化器的首要部件肯定是风扇,当时在绘制净化器结构图纸的时候,我给净化器预留的风扇孔位适合直径12cm的风扇,这个尺寸基本上是市面常见的风扇中最大的,于是我在某宝上买了一个回来 ![](https://cf01.ickimg.com/bbsimages/202006/2e1dad831ab5d99360fea20bc211a181.jpg) 其次,净化器当然对环境监测的功能也是必须的,对于灰尘以及Pm2.5,Pm10等等参数的测量一定要准确,在浏览了一系列Pm2.5传感器之后我选择购买了攀藤的一款传感器,这款传感器数据通过串口输出,所以调用NRF52832的串口即可接受这些数据 ![](https://cf01.ickimg.com/bbsimages/202006/41ba24d3921dbd173d3dd825708d1347.jpg) 接下来就是显示部分了,对于净化器的屏幕选择,并不用太大,足够显示信息即可,并且功耗需要尽量低。于是OLED屏幕成了一个不错的选择,和LCD屏幕相比,其没有背光灯,所以功耗可以尽量低。下面是我选择的一块1.3寸的OLED屏幕,分辨率128*64 ![](https://cf01.ickimg.com/bbsimages/202006/18dec7f914451b7ace8a3984282eed86.png) 最后即是一些辅助用的功能,我计划添加一个光照传感器,使得显示屏可以实时根据亮度调整对比度,这里使用BH1750这个光照传感器,功耗低并且读取数据容易,我经常使用到它。到这里呢,净化器的功能就基本上明了了 ![](https://cf01.ickimg.com/bbsimages/202006/0d70e95af694b5b17a2f2ee7d755be0b.png) 接着我打开AD软件开始绘制净化器的电路图 ![](https://cf01.ickimg.com/bbsimages/202006/921a888d407abc8334117dee7429fbff.png) 有了模块之后,需要我自己绘制的电路其实并不算多,主要就是电源以及显示,风扇驱动等电路。不出一会儿,电路原理图就绘制好了 ![](https://cf01.ickimg.com/bbsimages/202006/6664c0efb3fb99545f01561c83582669.png) 电路部分并不复杂,左上角则是购买的NRF52832模块,中间两部分则是风扇驱动芯片以及光照强度传感器,右侧则是预留出一路继电器以便控制其他设备,下部分就是电源以及显示屏接口 接下来就进行PCB的绘制,由于都是低频线路,所以布线没那么讲究 ![](https://cf01.ickimg.com/bbsimages/202006/e6f6f995a04c88508202c341ffed96e3.png) 不过在这个电路中有一点需要值得注意,电机转动以及预留的额外一路继电器在动作时容易产生较大干扰,这些干扰可能通过地线对NRF52832的射频性能造成干扰,所以我使用一个0欧姆电阻来对NRF52832模块的地线和电源地线进行隔离,图中绿圈处即为0欧电阻 ![](https://cf01.ickimg.com/bbsimages/202006/7aff554f43c632ce636de15b35adef0b.png) 在AD的3维模式下预览,由于有些器件没有模型,所以没办法显示 ![](https://cf01.ickimg.com/bbsimages/202006/c67c69e6a3fed3d2a0a01387276c97f9.png) 反面则是放置了显示屏以及下方的光线传感器 ![](https://cf01.ickimg.com/bbsimages/202006/8f242ac26480623038689369cb8feebd.png) 接下来就可以发给板厂打样了,这个板子的工程文件我会附到最后的资料中,大家可以下载之后直接拿去打板 现在打板速度非常快,仅仅两天就收到了制作好的板子 ![](https://cf01.ickimg.com/bbsimages/202006/3c188d852f1cfb2ac09e6a7c4416d876.jpg) 焊接过程我就不多说了,直接上焊接好的板子 ![](https://cf01.ickimg.com/bbsimages/202006/dd440a15400130a720775d89be70eef4.jpg) 反面的样子,我3d打印了一个座子用来固定显示屏 ![](https://cf01.ickimg.com/bbsimages/202006/c9ec3633f722fda2092f45db2593e282.jpg) 主板组装已经完毕,接下来开始净化器的整体组装。首先安装风扇,由于是预留好的孔位,直接使用长螺丝固定 ![](https://cf01.ickimg.com/bbsimages/202006/74e912c18767de9a4c8a9b35f62c462f.jpg) 接着就是电源的安装,由于我的风扇是12v供电的,所以我的电源也是选择的12v电源,电流是1A,足够净化器使用。某宝上购买大约不超过10元 ![](https://cf01.ickimg.com/bbsimages/202006/cbe166e4d6170612f02ce6c038fe43a9.jpg) 为了固定电源线,打印了一个小固定件 ![](https://cf01.ickimg.com/bbsimages/202006/750fca379631f89c82a9f1addf4f1cba.jpg) 可见净化器角落处预留了电源线的位置 ![](https://cf01.ickimg.com/bbsimages/202006/23787b7ed942f6f6d3f9bdaf68675891.jpg) 接着穿入导线并且用自攻螺丝固定即可 ![](https://cf01.ickimg.com/bbsimages/202006/d08ef56ba791c1fe8cb14a1563a43913.jpg) 电源同样使用自攻螺丝固定到风扇隔板上 ![](https://cf01.ickimg.com/bbsimages/202006/c7cb3aadb3a918f9bf22047567d5b241.jpg) 接下来的问题就是如何将主板固定到净化器的主体上,我设计了一个支撑座,可以将主板固定到净化器上 ![](https://cf01.ickimg.com/bbsimages/202006/6047b0343ce7fadd5c9dcf44713abb14.png) 接下来将其切片给打印机打印,打印机工作中 ![](https://cf01.ickimg.com/bbsimages/202006/e2fbdea516fca06b43ae21d78bf6abdd.jpg) 打印好的成品如下 ![](https://cf01.ickimg.com/bbsimages/202006/44d621eeee15456aeacff4c433eab5c2.jpg) 网购了一些直径4cm的茶色亚克力圆片,用来做显示屏的保护板,并使用UHU模型胶粘贴圆片到打印件上 ![](https://cf01.ickimg.com/bbsimages/202006/409d91e8be227d13255fe4d166bd247a.jpg) 最后使用自攻钉固定主板到支撑座上 ![](https://cf01.ickimg.com/bbsimages/202006/d580036a7d0be83ca99a7816c59b1a6a.jpg) 涂抹胶水到打印件的边框上,准备粘接 ![](https://cf01.ickimg.com/bbsimages/202006/01c8ed73b5691b6b5144639d1a4038d4.jpg) 粘接主板结构到净化器前面板 ![](https://cf01.ickimg.com/bbsimages/202006/acd7d794a12435456919355c14062aff.gif) 完成后的样子 ![](https://cf01.ickimg.com/bbsimages/202006/665efbc8f6930a721e48d6bfe017b872.jpg) 之所以要设计这个打印件的原因是安装上去之后主板可以拆下来,便于以后升级以及维护 ![](https://cf01.ickimg.com/bbsimages/202006/d668b7240a2fa917bb77f25345fba4f8.jpg) 接着我开始装配Pm2.5传感器,将传感器附带的线整理一下,引出接头 ![](https://cf01.ickimg.com/bbsimages/202006/5872bb205c45367eefa435c87e05c194.jpg) 3D打印了一个传感器座,方便拆装传感器。使用自攻螺钉固定Pm2.5传感器到传感器座上,如图 ![](https://cf01.ickimg.com/bbsimages/202006/575f12837327220a250d50c4157cadbd.jpg) 固定至净化器的风扇隔板下方,线束由风扇底部引出 ![](https://cf01.ickimg.com/bbsimages/202006/009deeaa09d77c44bbb2aa866bc088a2.jpg) 为了更好的净化空气,我还购买了一个负离子发生器,工作电压12V,某宝上购买十几块,据说是三星的拆机件 ![](https://cf01.ickimg.com/bbsimages/202006/614a6b8a887572b396d2012411be9bcd.jpg) 打印了一个安装座,安装到风扇旁边,负离子发生器的电源正好由预留出的一路继电器进行控制。 ![](https://cf01.ickimg.com/bbsimages/202006/f80d3d270aed698f2eabfacb8ea908f3.jpg) 在某宝上购买了一个抽油烟机用的转直径接头,可以给净化器做一个风道,我买的尺寸是120mm转160mm的尺寸,高大约78mm,材质是塑料的 ![](https://cf01.ickimg.com/bbsimages/202006/1e00cfc231f57dc85fe530f3a2ee0db4.jpg) 由于高度有些过高,我剪去了一些边缘 ![](https://cf01.ickimg.com/bbsimages/202006/fe72a43bf64ef0fcbc5565410b9616be.jpg) 用3D打印机打印了一个转接头,方便固定到风扇上 ![](https://cf01.ickimg.com/bbsimages/202006/467b0ad0614619fa3f4dbabac06af260.jpg) 接着安装转接头到风扇上 ![](https://cf01.ickimg.com/bbsimages/202006/4157c9f99d2c3f029fffbac25ccde938.jpg) 接着直接卡入转直径接头,在侧边开个孔给负离子发生器使用 ![](https://cf01.ickimg.com/bbsimages/202006/a78c30bf52ad6b64f2ba69811cc57d5c.jpg) 至此所有设备安装完毕 ------------ # 程序开发篇 硬件的基础我搭建好了,下面就是针对我的应用需求进行软件的开发了。 关于NRF52832的教程网上有许多帖子,在这里我叙述一下对官方代码修改的过程。 首先是开发环境,由于是一颗Cortex-M4F内核的芯片,自然支持常用的MDK以及IAR等工具开发,对于MDK我使用较多,故这次使用MDK来开发。至于调试以及程序下载,我使用Jlink进行烧录程序以及调试。既然NRF52832是一款蓝牙芯片,那么针对蓝牙的开发肯定是重中之重。在Nordic的官网上我下载到了官方给出的SDK,版本是15.0,打开之后我们可以看到许多文件 ![](https://cf01.ickimg.com/bbsimages/202006/2bbca785e0f7fc9c194224986cb605a4.png) 那么在我这次的开发中,需要明确在哪一个例程上进行修改。由于使用到了串口和Pm2.5传感器通信以及需要众多的控制指令,我决定在蓝牙串口的例程上进行修改,定位到如下文件即是蓝牙串口的工程样例 ![](https://cf01.ickimg.com/bbsimages/202006/8e22ddaf9575f62e9fd62d783f4fddd4.png) 打开之后进入到MDK中,这个样例实现的效果就是手机上发送什么字符串,NRF52832就可以收到什么字符串,并且把它从自己的串口输出,同样的,NRF52832的串口收到什么字符串,就会把它发送给手机 ![](https://cf01.ickimg.com/bbsimages/202006/ed5c686751137547e1acaa972e7442cf.png) 我们根据需要在蓝牙写事件回调函数中添加我们的处理代码,在这里我使用的是AT指令来控制空气净化器的各种功能。由于代码实在过于繁多,不利于大家观看,我给出逻辑图,具体代码见文章末尾的源码 ![](https://cf01.ickimg.com/bbsimages/202006/ae6904dc7bb83e5362f2c41f3af410e7.png) 而在串口输出回调函数中,我解析Pm2.5传感器发来的数据包,并且得到空气质量各项数值 ![](https://cf01.ickimg.com/bbsimages/202006/1d8ca4cf45fc29e225b42497d072075f.png) 最后由于我们需要周期性的上传空气质量数据到手机上,所以我们需要设置一个定时器来周期性的上传数据,包括进行屏幕信息的更新。在这里NRF52832手册推荐使用软件定时器,更加的省电。 ![](https://cf01.ickimg.com/bbsimages/202006/a36c0f14f5fa4e3220bd43054e9f8e23.png) 主体的所有程序大框架大概就写好了,我自己写了个简单的OLED界面,烧录程序以及协议栈进主板后效果如下图所示:左侧进度条显示的是亮度数据,右侧进度条显示的风扇转速,底部则是显示的负离子发生器是否开启,最中间则是获取到的Pm2.5浓度数据,单位是ug/m3 ![](https://cf01.ickimg.com/bbsimages/202006/81c21af598efb46fac40f938770a70cc.jpg) 打开手机,安装好Nordic的工具软件,我在手机上搜索到了设备 ![](https://cf01.ickimg.com/bbsimages/202006/4a99f75e44a7b7e34aa79dcd41144763.jpg) 打开串口服务后,手机上收到了NRF52832发送来的数据,每一次接受数据共有6个字节,我们以图中红框处的一帧数据为例,解析一下数据 ![](https://cf01.ickimg.com/bbsimages/202006/5d2bca55c8e2f62e1fa6a453330b7250.jpg) ![](https://cf01.ickimg.com/bbsimages/202006/588e586e76522953fc8b301d552cd285.png) 每两字节代表了空气质量数据,那么到现在我们已经可以正确的获取空气质量的参数了,下面试试控制功能。我在蓝牙串口服务中发送AT+off字样,可以看到,显示屏下方原本显示负离子发生器开启的字样变成了off ![](https://cf01.ickimg.com/bbsimages/202006/a3e16b5e2b4d7c5e58993f922943f8f6.gif) 再次向串口服务中发送AT+50字样,可以看到,显示屏右侧原本显示风扇转速的进度条长度变为屏幕一半,表示转速为50 ![](https://cf01.ickimg.com/bbsimages/202006/1afc643a89b70d2aa6bd004c1293e17c.gif) 到这里,大概我们所有的功能就全部实现了。最后还有一些实现低功耗相关的代码,在这里就不赘述了,具体可以参考文章末尾资料中的源码。 ------------ # 蓝牙DFU升级 做到这里,大家看上去整个过程非常流畅,一气呵成,实际上调试占据了我很多时间,每一次改动代码都需要将主板的电源线以及各种线束断开,接上Jlink才可以下载。下载好之后又需要再次接上电源线,十分繁琐。于是我在原来的程序上移植了DFU(OTA)功能,使得我可以通过空中升级的方式来更新NRF52832的程序。 对于NRF52832来说,传统的烧录方式通过Jlink接到SWD口上进行固件烧录,其缺点有两个:需要Jlink调试线以及需要将SWD接口预留到产品外部方便接线。DFU(OTA)功能实质上是将固件通过蓝牙传输到NRF52832上,然后NRF52832将固件进行更新。使得更新固件不在依赖于有线连接,大大提升了便利性。 将bootloader文件烧录到NRF52832之后,就可以在电脑上生成DFU升级所需要的ZIP压缩包,将其下载到手机上之后,就可以使用Nordic官方提供的软件进行升级了。这里对于如何实现此功能的过程就不再详述了,网上有许多此方面的教程,实现起来并不难。这里给大家展示一下DFU(OTA)升级的过程。 ![](https://cf01.ickimg.com/bbsimages/202006/0f9817b9d062326a339921b59d88dc79.gif) ------------ # 微信小程序的开发 对于手机端软件的开发,我可以说是不能再萌新的萌新了,之前一直玩单片机比较多,从来没学过相关的知识。所以这一次开发手机端软件着实对我是个巨大的挑战,我想过直接上手开发安卓APP,但是感觉自己做的APP生态,传播性可能并不是那么好,于是想着有没有类似于轻应用那种APP,开发速度快并且体积小巧。微信小程序便是我看中的平台,微信我们人人都有,所以使用起来并不需要重新下载另外的APP,界面也是比较美观的。首先给大家看下完成之后的样子,制作算不上精良,请大家指点。 首先打开小程序后看到一个蓝牙连接界面 ![](https://cf01.ickimg.com/bbsimages/202006/7c3e4bfe141fb2ed4da15ef7b1072fb4.jpg) 我们下拉屏幕之后可以搜索到空气净化器设备 ![](https://cf01.ickimg.com/bbsimages/202006/368261bf5c000f309d53cdabf0bcda11.jpg) 点击Nordic开头的设备即可连接,连接中会有正在连接的提示弹窗,连接好后会显示连接成功 ![](https://cf01.ickimg.com/bbsimages/202006/abf0d4fa2615ec4df74aaecfd113f7eb.gif) 连接成功会跳转到主界面,在界面的上有显示PM2.5的浓度数值以及PM1.0,PM10的浓度数值,并且有空气质量等级的显示以及空气污染程序的颜色划分,这些数据每秒会自动更新,或者也可以手动下拉刷新数据。 ![](https://cf01.ickimg.com/bbsimages/202006/16774bf39e7931cbbcbf7e1a6633f34c.gif) 当PM2.5浓度数值变化时,其数字颜色也会变化。下方则是控制负离子发生器的开关以及风扇速度的滑块。最底部则是导航栏,用于在不同页面间切换 ![](https://cf01.ickimg.com/bbsimages/202006/b25eaa98f0eab42b1752fa5e0cdd0e54.jpg) 在另一个页面会显示用户信息以及断开连接按钮,用于断开和NRF52832的链接。如果手机和NRF52832处在连接状态时,按下则会显示成功,否则会显示断开连接失败 ![](https://cf01.ickimg.com/bbsimages/202006/cab3bcb8f78b6558199e2f835b2b331c.jpg) 同样的对于其他所有功能,如果在操作过程中(控制负离子发生器按钮以及控制风扇转速按钮)有存在NRF52832断电或断开连接的情况,都会弹出操作失败的消息弹窗 ![](https://cf01.ickimg.com/bbsimages/202006/aad4c909dbe3fb845fe0e6a02a116756.gif) 下面呢我来讲解一下整个开发过程。微信小程序工程中有四类文件,分别是WXML,WXSS,JS以及JSON文件。 ![](https://cf01.ickimg.com/bbsimages/202006/dad7442bf95c71167030e3fbef24a3b0.png) JSON文件主要用于静态配置,例如页面配置,工程配置等等 其余的三个文件和网页编程其实比较类似,JS文件主要用来书写逻辑,比如界面上按钮的响应,和用户的交互等等。WXML文件类似于HTML,主要用来书写页面结构,WXSS则是类似CSS,书写页面样式。 在我的这个小程序中总共有三个页面,所以对于每个页面来说,都需要这4个文件来组成 ![](https://cf01.ickimg.com/bbsimages/202006/08b536adee438b0dbee89ee0e7eb4450.png) 比较重要的是逻辑代码的编写(JS文件),这里我在mine页面的JS文件中编写蓝牙搜索,蓝牙设备连接等代码。这里给出逻辑图,具体代码实现见文末资料。主要就是调用小程序提供的一些API进行设备的搜索,连接等工作。 ![](https://cf01.ickimg.com/bbsimages/202006/51103a002bec2bbd8822e74a9ef4db49.png) 至于编写页面结构的WXML文件中,我使用scroll-view来显示多个设备。 ![](https://cf01.ickimg.com/bbsimages/202006/96deff886770e7c184c60a237069eaa6.png) 在最为重要的air页面,也就是用户控制的界面,我使用了switch(开关)组件以及slider(滑块)组件,并绑定相关的事件处理函数以便在JS文件中编写用户操作组件后需要执行的功能 ![](https://cf01.ickimg.com/bbsimages/202006/72a8757ebeb0de1c76b4babe03c390a7.png) 在JS文件中,编写对应的处理函数,这里以滑块组件的事件处理函数为例,主要执行的就是给蓝牙设备写入特征值以达到控制风扇的目的 ![](https://cf01.ickimg.com/bbsimages/202006/c722d95dc612e539e2e81d52f4c3486d.png) 在空气质量数据的更新中,我使用一个定时器来动态更新数据,同时在此页面下的下拉刷新监听函数中,也写上更新空气质量数据的代码,并且配以一些音效。这样更新空气质量数据便有了用户主动刷新和小程序自动刷新两种方式。 ![](https://cf01.ickimg.com/bbsimages/202006/e02eecc1afa23680b00253466b83bcb8.png) 目前这个小程序已经发布,大家可以搜索“我的空气净化器”即可搜索到,或者扫描我附件资料中的小程序二维码使用。如果想使用这个小程序搭配其他的蓝牙芯片,我也会写一篇这个小程序的使用方法,附在文末资料中。 ![](https://cf01.ickimg.com/bbsimages/202006/4ff3b3ecd745799b5f0bb08dddd609e4.png) 最后放送两张净化器的写真照 ![](https://cf01.ickimg.com/bbsimages/202006/80ef117d0e64b5c4a340f8fd6153434f.jpg) ![](https://cf01.ickimg.com/bbsimages/202006/bf2097ac40008e190ec95af4646c2da2.jpg) ------------ # 总结 到这里,整个制作过程大概就全部叙述完了,篇幅可能过于冗长,因为这个项目涉及到的方面过于繁多所以导致了花费许久才得以完成。从结构到电路到软件程序到手机小程序开发,可谓说是一个较为综合的项目。并且涉及到许多较为专业性的软件我也是头一次使用,所以也都是摸着石头过河,有什么写的有问题的位置还请大家提出来。我把所有用到的资料全部整理了一下,附到了下方,这其中包括所有用到的图纸、3D打印件的模型、所有的代码以及我购买的所有配件的某宝链接。 当然我为什么采用NRF52832的原因还远不止此,后续蓝牙mesh功能我也会加入,但那需要更多的设备加入进来,所以后面还会有各种基于蓝牙mesh的设备会去制作。最后谢谢大家的耐心阅读,以下是资料链接: https://www.icxbk.com/download/detail/48834.html
原创作品,未经权利人授权禁止转载。详情见
转载须知
。
举报文章
点赞
(
0
)
皮皮学电子
擅长:消费电子 智能硬件
关注
评论
(0)
登录后可评论,请
登录
或
注册
相关文章推荐
MK-米客方德推出工业级存储卡
Beetle ESP32 C3 蓝牙数据收发
Beetle ESP32 C3 wifi联网获取实时天气信息
开箱测评Beetle ESP32-C3 (RISC-V芯片)模块
正点原子数控电源DP100测评
DP100试用评测-----开箱+初体验
Beetle ESP32 C3环境搭建
【花雕体验】16 使用Beetle ESP32 C3控制8X32位WS2812硬屏之二
X
你的打赏是对原创作者最大的认可
请选择打赏IC币的数量,一经提交无法退回 !
100IC币
500IC币
1000IC币
自定义
IC币
确定
X
提交成功 ! 谢谢您的支持
返回
我要举报该内容理由
×
广告及垃圾信息
抄袭或未经授权
其它举报理由
请输入您举报的理由(50字以内)
取消
提交