6
头图

目录

  • 前言
  • 关于DevEco Studio
  • 前期准备工作
  • 应用/服务运行
  • 应用/服务调试
  • 拓展:DevEco Studio配置参数列表
  • 结束语

前言

随着近两年国产操作系统的自主发展,并取得了实质性的进展,对于国内技术圈来讲是个非常重要的大事。HarmonyOS作为移动应用开发的第三个热门领域(前两个热门领域iOS原生、Android原生都已经落寞了),也是未来一段时间内大前端领域的热门,这给目前前景不行的大前端开发领域带来了新的希望,作为大前端开发者,我是比较开心的,而且我也已经入门HarmonyOS领域。同时作为HarmonyOS的开发者一员,使用HarmonyOS自带开发编辑器是必备技能,不用多说,做过HarmonyOS开发的开发者都知道,HarmonyOS的HUAWEI DevEco Studio(以下简称DevEco Studio)编辑器是一款功能强大的开发工具,专为HarmonyOS开发而设计的全功能开发工具,另外目前HarmonyOS的最新版本是HarmonyOS NEXT,那么本文就来分享一下体验使用HarmonyOS NEXT的DevEco Studio编辑器。

关于DevEco Studio

根据HarmonyOS官方的介绍,DevEco Studio是基于IntelliJ IDEA Community开源版本打造,为运行在HarmonyOS系统上的应用和服务(以下简称应用/服务)提供一站式的开发平台。DevEco Studio编辑器提供了丰富的功能和工具,帮助开发者编写、调试和部署应用程序,本文以DevEco Studio4.1版本新增特性的内容来介绍。

据我所知,DevEco Studio编辑器作为一款开发工具,除了具有基本的代码开发、编译构建及调测等功能外,DevEco Studio还具有以下的特点:

  • 高效智能代码编辑:支持ArkTS、JS、C/C++等语言的代码高亮、代码智能补齐、代码错误检查、代码自动跳转、代码格式化、代码查找等功能,提升代码编写效率。
  • 低代码可视化开发:丰富的UI界面编辑能力,支持自由拖拽组件和可视化数据绑定,可快速预览效果,所见即所得;同时支持卡片的零代码开发,降低开发门槛和提升界面开发效率。(需要注意的是:当前仅API 9支持低代码开发)
  • 多端双向实时预览:支持UI界面代码的双向预览、实时预览、动态预览、组件预览以及多端设备预览,便于快速查看代码运行效果。

前期准备工作

开始体验DevEco Studio编辑器之前,需要先完成一些准备工作,先要确保已经安装了最新版本的DevEco Studio编辑器,并且具备相应的开发环境和依赖,这里以Mac OS为例来分享, Windows系统的安装这里不在介绍,如果大家需要其他操作系统的安装步骤请参考华为鸿蒙官方的套件安装文档:https://developer.harmonyos.com/deveco-developer-suite/enabling/kit?currentPage=1&pageSize=100 ,打开该链接来查看对应的各个操作系统的安装步骤。先来分享一下关于搭建鸿蒙开发环境的流程,环境配置流程如下所示:

image.png

接下来分享一下关于Mac OS环境下安装DevEco Studio的运行环境要求,具体如下所示:

  • macOS(X86) 10.15/11/12/13 macOS(ARM) 11/12/13
  • 内存:8GB及以上
  • 硬盘:100GB及以上
  • 分辨率:1280*800像素及以上

然后再来分享一下关于Mac OS系统具体的安装步骤如下所示:

image.png

image.png

然后下载之后,打开压缩包,找到DevEco Studio安装包,直接双击打开安装即可,安装成功之后,在电脑上的图标如下所示:

image.png

双击DevEco Studio图标,打开DevEco Studio,具体如下所示:

image.png

作为开发者和使用者来说,关于DevEco Studio的具体使用文档请参见最新HarmonyOS NEXT版本的文档:
https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V2/ide-userguide-0000001054619202-V2 ,打开之后,然后找到4.1版本关于DevEco Studio的使用指南,最后就可以准备好要调试的基于HarmonyOS应用程序或服务的代码和相关资源,就可以直接开发啦。

应用/服务运行

在介绍应用/服务运行之前,先来了解一下DevEco Studio的使用,只需要按照如下几步,即可轻松开发并上架一个应用/服务到华为应用市场,具体如下所示:

image.png

HarmonyOS应用/服务的运行,分为:运行HarmonyOS应用/服务、运行OpenHarmony应用/服务。据我所知运行HarmonyOS应用/服务是有三种情况的,即:使用本地真机运行应用/服务、使用模拟器运行应用/服务、使用远程真机运行应用/服务,这里只介绍运行HarmonyOS应用/服务。

1、本地真机运行HarmonyOS应用/服务

由于本地真机运行HarmonyOS应用/服务有多种情况,因为是基于华为的多种设备的,所以这里只以华为Phone的运行来讲,其实在Phone和Tablet中运行HarmonyOS应用/服务的操作方法一致,可以采用USB连接方式或者IP Connection的连接方式。我们可以采用IP Connection连接方式要求Phone/Tablet和PC端在同一个网段,建议将Phone/Tablet和PC连接到同一个WLAN下。又由于华为Phone的本地真机运行也是分为两种连接方式在,这里只以USB连接方式来讲,具体步骤如下所示:

首先在Phone或者Tablet中,打开“开发者模式”,可在设置 > 关于手机/关于平板中,连续多次单击“版本号”,直到提示“您正处于开发者模式”即可,然后在设置的系统与更新 > 开发人员选项中,打开“USB调试”开关。

image.png

还需要在Phone或者Tablet中运行应用/服务,需要提前对应用/服务进行签名。

然后进行具体的操作步骤,使用USB方式,将Phone或者Tablet与PC端进行连接,在Phone或者Tablet中,USB连接方式选择“传输文件”,接着在Phone或者Tablet中,会弹出“是否允许USB调试”的弹框,单击确定。在菜单栏中,单击Run>Run'模块名称'或绿色三角形,或使用默认快捷键Control+R(仅适用于Mac OS)运行应用/服务。

image.png
image.png

最后,DevEco Studio启动HAP的编译构建和安装,安装成功之后,Phone或者Tablet会自动运行安装的HarmonyOS应用/服务。

另外,除了USB方式连接之外,还可以使用TCP方式连接,但是由于篇幅有限,这里就不再过多介绍。

2、模拟器运行HarmonyOS应用/服务

关于使用模拟器运行HarmonyOS应用/服务,据官方显示DevEco Studio提供模拟器供开发者运行和调试HarmonyOS应用/服务,对于Phone、TV和Wearable可以使用本地模拟器(Local Emulator)和远程模拟器(Remote Emulator),对于Tablet可以使用Remote Emulator运行应用/服务,对于Lite Wearable和Smart Vision可以使用Simulator运行应用/服务。同时,DevEco Studio的Remote Emulator还提供超级终端模拟器(Super Device),开发者可以利用超级终端模拟器来调测跨设备应用/服务。

本文以本地模拟器为例来介绍,创建和运行Local Emulator的操作方法如下:

单击DevEco Studio > Preferences > SDK,下拉框选择HarmonyOS,勾选并下载Platforms下的System-image和Tools下的Emulator资源。

image.png

单击菜单栏的Tools > Device Manager,在Local Emulator页签,单击Edit设置本地模拟器的存储路径Local emulator location,默认存储在/Users/用户/.Huawei/HarmonyOSEmulator/deployed。然后在Local Emulator页签中,单击右下角的New Emulator按钮,创建一个本地模拟器。

image.png

在创建模拟器界面,可以选择一个默认的设备;同时也可以单击New Hardware,添加一个新设备,以便自定义设备的相关参数,如尺寸、分辨率、内存等参数。

image.png

然后就是一路点击“Next”,到最后一步核实确定需要创建的模拟器信息,同时也可以在该界面修改模拟器信息,然后单击Finish创建本地模拟器。最最后点击运行按钮,选择模拟器选项,即可运行起来,这里不在过多介绍。

应用/服务调试

DevEco Studio提供了丰富的HarmonyOS应用/服务调试能力,使用本地模拟器支持ArkTS和C++的调试。另外,本地模拟器功能从DevEco Studio 4.0 Release版本开始提供,还有就是当前仅macOS(ARM)版本DevEco Studio支持该功能。HarmonyOS应用/服务调试支持使用模拟器设备调试,可以支持运行已签名或未签名的应用/服务,使用模拟器调试应用/服务的流程如下图所示:

image.png

1、调试前的设置

根据HarmonyOS官方介绍,设置调试代码类型工程调试类型默认为ArkTS/JS,关于各调试类型的说明如下表所示:

image.png

修改调试类型的方法如下,点击Run > Edit Configurations > Debugger,选择相应模块,设置Debug type即可。

image.png

2、设置HAP安装方式

在调试阶段,HAP在设备上的安装方式有2种,可以根据实际需要进行设置,具体的安装方式如下:

方式一:先卸载应用/服务后,再重新安装,该方式会清除设备上的所有应用/服务缓存数据(这是默认安装方式)。从DevEco Studio 4.1 Canary2版本开始,支持当代码无变化时,不进行推包安装。即根据模块有无变化来判断是否重新推送安装模块包,在运行调试时仅将有变化的模块及依赖它的模块重新推送安装至设备上。如entry依赖了HSP模块,当HSP模块有变化,运行调试时将同时推送安装HSP模块和entry模块。

方式二:采用覆盖安装方式,不卸载应用/服务,该方式会保留应用/服务的缓存数据。具体的设置方法:单击Run > Edit Configurations,设置指定模块的HAP安装方式,勾选“Keep Application Data”,则表示采用覆盖安装方式,保留应用/服务缓存数据。

image.png

3、启动Debug调试

(1)在工具栏中,选择调试的设备,并单击Debug 启动调试。

(2)如果需要设置断点调试,则需要选定要设置断点的有效代码行,在行号的区域后,单击鼠标左键设置断点(如下图的红点所示)。

image.png

(3)设置断点后,调试能够在正确的断点处中断,并高亮显示该行。

(4)启动调试后,开发者可以通过调试器进行代码调试,调试器的功能说明具体如下所示:

image.png

注意:对于元服务,由于元服务在设备中没有桌面图标。

拓展:DevEco Studio配置参数列表

通过上文关于DevEco Studio的主要功能和特点的介绍,最后再来分享一下关于DevEco Studio的配置参数,上面也介绍到了DevEco Studio是基于IntelliJ平台开发,在原生的IntelliJ参数的基础上新增了部分参数,这些参数可在idea.properties中进行配置,具体的参数列表内容如下所示:

image.png

具体参数表格上面已经列出来了,但是我们在使用的时候一定要注意一点:关闭证书校验,很有可能会带来安全风险,所以大家一定要谨慎使用!

image.png

结束语

通过本文深入体验了HarmonyOS的DevEco Studio编辑器,想必读者可以更直观地了解HarmonyOS的运行状态和交互行为,并快速定位和修复问题,而且DevEco Studio编辑器提供了丰富的功能和工具,帮助我们开发者提高开发效率和调试过程的便捷性。作为开发者的我们,也期待大家能够通过充分利用DevEco Studio编辑器的可视化调试功能,为华为鸿蒙生态系统的应用开发贡献更多优秀的应用作品。最后值得一提的是,无论是布局调试、数据查看和修改,还是事件监视和调试,DevEco Studio编辑器都为开发者们提供了强大的工具和功能,助力我们开发出高质量、稳定可靠的鸿蒙应用程序和服务。让我们一起享受DevEco Studio编辑器带来的便捷和效率,共同创造出更美好的开发体验吧!

参考文献

HarmonyOS NEXT(4.1)官方文档: https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V2/ide-tools-overview-0000001558763037-V2


三掌柜
20.1k 声望6.6k 粉丝

一分耕耘,不一定有一分收获,但十分耕耘,一定会有一分收获!