当前位置: 首页 > 科技观察

北向js应用:从点亮LED到原创嵌入式小项目——鸿蒙智能水表

时间:2023-03-15 00:26:56 科技观察

想了解更多开源内容,请访问:开源基础软件社区https://ost.51cto.com.本文分享一个简单完整的鸿蒙小项目的编写过程。以本文制作智能水表的demo为例:首先你需要学习:打开一个Led灯(是的,你只需要一个可以打开灯的北向代码,很简单,还有这个文章也是以此为模板制作的)声明:本文编译的sdk版本为api7,IDE环境为3.0.0.800(3.0Beta2),语言基于JSUI结果展示。确定功能待确定功能如下:获取传感器数据(水流传感器),实时渲染到屏幕上。可以控制水阀(发送控制命令)。自动(手动)上报数据并发送给服务器/上位机进行后续处理。其他(如统计数据、计算费用等)。所有功能实现的代码都会贴在文末,供大家编译参考。2、添加南向接口并调用注意:南向部分需要自己实现。本项目内容可参考基于OpenHarmony的水流监测系统。它的本质还是gpio操作和一些基础知识的结合。知道怎么点LED之后,就可以大胆上手了。根据物联网项目的基本结构:设备-管道-云用,我们也可以按照北向类比中的这四点进行功能设计(不涉及后端)。End:感知识别层,用于信息生??成。管理:信息传输,用于信息传输,具体调用通信接口与上位机进行通信。云:信息处理。用途:信息应用:如微信小程序设计。我们引用了Ledlighting的接口,在@system.app.d.ts末尾添加如下接口声明:staticledcontrol(options:{code:number;success?:(res:string)=>void;失败?:(res:string,code:number)=>void;complete?:()=>void;}):void;没错,led灯的接口连名字都不改,我们使用回调函数返回的对象,在res对象中添加传感器数据:值作为数据内容,命令码发送是水阀的控制开关命令。在处理页面逻辑的文件上,我们还需要添加主动调用接口的方法:/*index.js*/app.ledcontrol({code:led.open,success(res){//解析数据andsaveit},fail(res,code){},complete(){}})3.添加通信接口(可选)。如果需要,可以加粗体的网络请求接口。在api7(及之前)可以使用@system.fetch,aip6最后推荐使用@ohos.net.http(fetch不维护,建议弃用)//先导入鸿蒙的网络请求模块导入fetchfrom'@system.fetch';try{fetch.fetch({url:'http://127.0.0.1'+'?data='+this.rate,//填写服务器地址responseType:'json',成功:res=>{this.code3="connected"letdata=JSON.parse(res.data);//必须加上console.log(res.data)}});console.log("手动上报数据")}catch(e){console.log(e);this.code3="Connectionfailed"}如果报错,尝试修改配置文件config.json中的网络权限。默认模块下module:"reqPermissions":[{"name":"ohos.permission.GET_NETWORK_INFO"},{"name":"ohos.permission.SET_NETWORK_INFO"},{"name":"ohos.permission.INTERNET"}],轻量级穿戴设备好像不支持网络通信接口,最后弃用,改为南向上传(此处代码仅供参考)。温馨提示:由于需要传输的是南向部分传来的传感器数据,建议在南向部分也处理数据上传,以减少延迟和精度误差。4、其他上位机(这里以微信小程序为例)主要负责远程监控管理,设计如下:控制面板页面设计统计页面设计页面只代表功能演示,不代表实际数据。项目源码:index.hml退出运行时间0d0h{{min}}m{{sec}}s设备{{info}}

{{title}}{{rate_L}}L{{rate}}ml
运行状态工作状态:{{code1}}<textclass="text_s">水阀状态:{{code2}}主机:{{code3}}
手动上报关闭水阀打开阀门测量水量index.css.container{width:100%;高度:100%;弹性方向:列;对齐项目:中心;}swiper{高度:60%;宽度:100%;背景色:绿色nyellow;}.main{边距:10px;宽度:100%;高度:60%;弹性方向:行;对齐项目:居中;/*背景颜色:cadetblue;*/}.title_l{宽度:50%;高度:280px;字体大小:40px;文本对齐:居中;flex-direction:column;}.title_r{margin-top:10px;宽度:40%;高度:240px;字体大小:40px;文本对齐:居中;背景色:黑色;边界半径:50px;弹性方向:列;不透明度:0.9;边框颜色:白色;边框宽度:2px;填充:10px;边距:10px;}.text{字体大小:40px;文本对齐:居中;宽度:100%;高度:35%;}.text_small{字体大小:33px;文本对齐:居中;宽度:100%;高度:20%;}.text_s{字体大小:30px;左:12px;宽度:100%;margin-left:10px;}.ledImg{宽度:200px;高度:150px;顶部边距:10px;字体大小:40px;}.ledAction{高度:50px;宽度:100%;弹性方向:行;只是化内容:空间周围;对齐项目:居中;}.ledAction-view{宽度:120px;高度:50px;弹性方向:列;证明内容:居中;对齐项目:居中;}.ledAction-img{宽度:60px;高度:60px;}.ledAction-btn{宽度:120px;顶部边距:10px;字体大小:30px;文本对齐:居中;}.title-view{宽度:100%;高度:60px;边距:1px;弹性方向:列;显示:弹性;背景颜色:午夜蓝;}.title{宽度:100%;高度:300px;边距:1px;弹性方向:行;显示:弹性;背景颜色:深蓝色;}.top-view{高度:60px;宽度:100%;弹性方向:行;证明内容:居中;对齐项目:居中;显示:弹性;文本对齐:居中;}.back-img{高度:30px;宽度:30px;margin-left:10px;}.back-btn{字体大小:30px;宽度:25%;填充:20px;}.date{字体大小:30px;宽度:50%;}.deviceid{字体大小:30像素;width:20%;}index.jsvarled={open:1,close:0,change:2}从'@system.app'导入应用程序;从“@system.router”导入路由器;导出默认{数据:{title:'当日累计:',statu:'0',rate:0,rate_L:0,sec:0,min:0,info:"正常",tmp_rate:-1,curr_rate:0,code1:0,code2:"关闭",code3:"未连接",timer:0,time:0,},onInit(){//初始化//this.openDoor()this.startTimer()this.info="初始化.."},exit(e){console.log("terminate!")app.terminate()},startTimer(){this.time=setInterval(()=>{//this.getRate()this.runtime()},1000);},runtime(){this.sec++if(this.sec===60){this.sec=0this.min++}},getRate(){letthat=thistry{//that.rate++app.ledcontrol({code:led.open,success(res){//console.log("datashow1")that.tmp_rate=that.ratethat.rate=(Number(JSON.stringify(res.led_status)))that.curr_rate=that.rate-that.tmp_ratethat.code1=that.curr_rate},fail(res,code){console.log("getfail")},complete(){}})}catch(e){控制台.log(err)this.device_id="err"}},openDoor(e){console.log("open")this.info="运行中"this.code2="开启"//functionfunctioncloseapp(){console.log("close")//clearInterval(定时器);//数据归0}constShowRate=()=>{this.time++这个.device_id++;//console.log(this.time)//if(this.time===300)closeapp()letthat=thisapp.ledcontrol({code:led.open,success(res){//console.log("datashow1")that.rate=(Number(JSON.stringify(res.led_status)))},fail(res,code){},complete(){}})}this.rate=-1;尝试{this.timer=setInterval(function(){ShowRate()},100);}catch(e){console.error("err"+e)this.info="timerfailure"}/*这里是关于类中This指向的问题。这里不能使用匿名函数处理()=>{}。function(),因为类的特性,函数中的this指向change_per_second的rate变量,不能访问到默认类的rate变量,但是匿名函数中的this会一层层找*/},close(e){console.log("closetimer")this.info="close"this.code2="close"try{clearInterval(this.timer)}catch{this.info="fault"}//this.rate=0;letthat=thisapp.ledcontrol({//关闭水阀命令code:led.close,success(res){that.statu=res.led_status},fail(res,code){},complete(){}})},datalist(){},senddata(){try{fetch.fetch({url:'http://127.0.0.1'+'?data='+this.rate,//填写服务器地址responseType:'json',success:res=>{this.code3="connected"letdata=JSON.parse(res.data);//必须加上console.log(res.data)}});console.log("手动上报数据")}catch(e){console.log(e);this.code3="Connectionfailed"}},}了解更多开源请访问:开源基础软件社区https://ost.51cto.com