HUAWEI DevEco Studio(以下简称DevEco Studio)是面向华为终端全场景多设备的一站式集成开发环境(IDE),为开发者提供工程模板创建、开发、编译、调试、测试、发布等E2E的HarmonyOS应用开发服务。通过使用DevEco Studio,开发者可以更高效的开发具备HarmonyOS分布式能力的应用,进而提升创新效率。

 

3月佳期,DevEco Studio又迎来更新,2.1  Beta 3版本强势来袭。新版本的到来,究竟能给广大HarmonyOS应用开发者带来哪些不一样的体验?请看下文,便可知晓。

 

点击此处,下载使用DevEco Studio 2.1 Beta 3

 

亮点一:预览器新增双向预览功能

 

在HarmonyOS应用开发过程中,开发者可通过点击“Previewer”,查看应用的UI界面效果。当开发者发现UI界面的布局显示不符合预期时(eg:控件的宽度不符合设定值、控件不显示等),需要逐一排查UI界面中布局或控件的异常。

 

为了提高排查的效率,DevEco Studio 2.1 Beta 3在已有的 “实时预览”(只要在布局文件中保存了修改的源代码,在预览器中就可以实时查看布局效果)和“动态预览”(在预览器界面,可进行应用的交互操作,如点击事件、跳转、滑动等,其交互体验与应用运行在真机设备上的交互体验一致)基础上,全新解锁了“双向预览”功能。

 

所谓双向预览,即支持代码编辑器、预览器界面(含属性列表)两者之间的联动,便于快速定位控件,从而提升解决UI界面问题的效率。开发者可以通过在预览器界面,点击 图标的方式,打开双向预览功能。

 

具体联动效果如下:①通过预览器界面中的属性列表,修改属性或样式后,代码编辑器中的源码会同步修改,并实时刷新预览器界面;②同样的,如果在代码编辑器中修改源码,将会实时刷新预览器界面及属性列表。

预览器和编辑器双重发力,DevEco Studio 2.1 Beta 3强势来袭但值得注意的是,若碰到以下情况,则不支持修改其属性:①hml布局代码里使用了数据绑定的属性;②xml布局代码里使用了资源引用的属性;③UI界面设置了动画效果。

 

 

温馨提示:不同的API Version版本,预览器支持的功能略有不同,具体差异如下:

预览器和编辑器双重发力,DevEco Studio 2.1 Beta 3强势来袭

 

亮点二:预览器新增Java UI界面的数据模拟功能

 

在预览场景中,由于代码的运行环境与真机设备上的运行环境不同,调用部分接口时无法获取到有效的返回值。开发者若想根据返回值做出不同的UI界面展现,则需手动反复修改代码逻辑,以验证不同UI界面效果。

 

为了减少修改,DevEco Studio提供了PreviewMock数据模拟功能,即在不改变业务运行逻辑的前提下,模拟API或者业务代码中的各种method(不包括构造方法)的返回值和对象中的Field(不包括final字段)的值。这样开发者就可以在预览时,查看到不同返回值带来的界面变化。

 

不过值得注意的是,DevEco Studio 2.1 Beta 3当前仅支持Java UI界面的PreviewMock数据模拟功能。与此同时,要想使用PreviewMock数据模拟功能,需先在模块的build.gradle中添加相关依赖,并重新同步工程。

 

预览器和编辑器双重发力,DevEco Studio 2.1 Beta 3强势来袭

(图:在build.gradle中添加PreviewMock的依赖)

 

除了上述的两大亮点功能,在Java UI界面预览方面,开发者在预览Ability或AbilitySlice时,保存修改后的代码,即可做到实时预览;在JS UI界面预览方面,开发者可直接选择某一个页面进行实时动态预览。

 

亮点三:编辑器新增config.json可视化配置功能

 

作为HarmonyOS应用开发的入门选手,你是否为了了解配置项的含义,而反复查阅HarmonyOS官网的资料文档?为了减少开发者反复切换界面查阅资料文档的行为,DevEco Studio 2.1 Beta 3新增了可视化配置功能。

 



文章后续内容和相关附件可以点击下面的原文链接前往学习

原文链接:   https://harmonyos.51cto.com/posts/3733#bkwz


想了解更多关于鸿蒙的内容,请访问:

51CTO和华为官方战略合作共建的鸿蒙技术社区

https://harmonyos.51cto.com/#bkwz