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

2020征稿-鸿蒙智能手表【纯货】教你用JS开发智能手表应用

时间:2023-03-13 03:32:57 科技观察

更多内容请访问:与华为官方共建的鸿蒙技术社区https://harmonyos.51cto.com/#zzPreface九月中旬开始接触鸿蒙。当时只是抱着尝鲜的心态,跟着官方文档,写了TV版的helloworld和LiteWearable的helloworld。现在回想起来,还是有些激动。9月下旬,该公司收到了华为的一款搭载鸿蒙系统的智能手表。出于某种原因,智能手表开发的任务落在了我身上。我是一名前端开发人员。说实话,接到这个任务的时候,我对它的了解并不多。毕竟不知道APP开发的流程。鸿蒙虽然支持JS开发,但是心里明白,应该还是有很多坑的。事实证明,坑真的很多。哈哈哈。为什么我今天有时间写这篇文章?因为我的智能手表应用已经开发、调试、测试完毕,马上就要上线了。话不多说,进入正题。配置1.准备工作(下载、安装、环境配置、项目创建等)太简单了,就不多说了。请参考官方文档生成的目录结构,大概是这样的。对于Android开发来说,应该很熟悉了,但是对于前端来说,就很迷茫了。什么gradle文件,这是什么,咦,怎么会有java,我没选js模板啊?我很困扰。算了,硬着头皮去做。2、config.json权限列表配置(fetch、network等)在鸿蒙应用中,如果图片标签要使用https外链资源,必须配置权限。fetch接口请求也是如此。我自己开发的时候配置了网络请求权限和网络状态权限。"reqPermissions":[{"name":"ohos.permission.GET_NETWORK_INFO"},{"name":"ohos.permission.GET_WIFI_INFO"},{"name":"ohos.permission.INTERNET",},]3、离线签名和签名配置(真机调试)如果不需要真机调试,这一步可以忽略。请参考文档编辑器版本不同,使用的密钥文件不同。有些是.p12,有些是.jks。如果你生成jks,那么你可能需要转换p12,作者会转换,你可以自行百度。申请开发者证书并调试Profilerequest.json如下:{"developerRequest":{"Applicant":"XXXX","ApplicationName":"XXXX","CN":"XXXX","validYear":"1"},"provisionRequest":{"debug-info":{"device-ids":[""//调试真实设备的UDID]},"permissions":{"restricted-permissions":["harmonyos.permission.ANSWER_PHONE_CALLS"]},"bundle-name":"你的包名","developer-id":"你的开发者ID"}}然后把你生成的csr,p12和这个request.json发给华为人,然后他们会给你cer和p7b文件,你直接导入就可以了。至此,我们完成了真机调试的准备工作。真机调试出的包是hap包。如果要上架,那肯定是一个.app文件,所以我们需要在项目配置中导入这些证书,操作同上一步。4.集成WearEngineSDK(手表与APP通信)。APP和手表都必须集成相应的SDK,这样通信才能添加编译依赖。1.联系华为联系人获取SDK。2、解压SDK后,将SDK中的har包放到工程\entry\libs目录下。3.打开应用级build.gradle文件。4、在“dependencies”中添加如下编译依赖,然后同步。5.在穿戴设备端生成签名证书的指纹,并进行设备检测。APP的指纹和包名需要在手表端配置。手表端指纹和包名请参考文档手表端APP包名和指纹代码配置如下6.编译构建生成HAP或生成APP,请参考文档开发而开发,没什么好说的,就是正常的前端一套,布局,风格,逻辑。需要注意的是设备分辨率为454*454,圆形屏幕需要安全距离。如果手表需要和手机APP交互,JS的能力比较弱,需要依赖JAVA进行中转。JAVA代码不是我写的,我只是复制官方文档,然后让Android客户端修改。这个项目是我做的,目录如下:另外需要注意的是JAVA不能主动给JS发送消息,需要JS主动。手机和手表信息同步时,需要填写用户信息。我们的做法是:手机登录后,会发一个用户身份信息到我的手表。手表端的JAVA代码可以接收,但是JS接收不到。这时候,我最好的办法就是在手表端的JS上做一个轮询,向JAVA询问登录信息。一般的方法是setInterval,但是我发现这个setInterval在鸿蒙中不起作用,我很绝望,最后我使用了递归。即手表在onShow生命周期中一直调用PA能力(参考文档)。如果获取到用户信息,则缓存到本地,停止调用,然后发送fetch请求到服务器获取数据。这样数据同步就完成了。说到缓存,也有个小坑。该值必须是一个字符串。本来我的res是一个字符串,但是我直接写会报错。我必须使用JSON.stringify()来转换它。调用PA能力的代码如下:JAVA先注册一个CalcInternalAbility,供JS调用。JS调用这个方法,如下,value是JAVA的返回值。调试这里主要说一下JS调试JS打印调试信息,一般是console.log(),但是本编辑器推荐使用console.info()。一旦程序开始运行,控制台就会不停的打印一些信息,完全看不懂。我们想看看我们的JS代码执行到哪里了,但是找不到很清楚。我推荐我自己的方法。.这样我们就可以在控制台上清楚的看到自己的打印信息,知道代码执行到哪一步了。整个项目开发过程到最后,坑还是蛮多的,但是也没办法,毕竟是刚出来的。但只要慢慢好起来,未来可期。虽然华为吃了不少苦头,但鸿蒙还是要背负“一点点”的使命感。颠簸多了,鸿蒙就会厚实一些。希望喜欢鸿蒙的可以继续喜欢鸿蒙,不喜欢鸿蒙的可以慢慢尝试去接受鸿蒙。了解更多请访问:与华为官方共建鸿蒙科技社区https://harmonyos.51cto.com/#zz