应用低代码开发利用或服务有以下两种开发方式：

  • 创立一个反对低代码开发的新工程，开发利用或服务的UI界面。
  • 在已有工程中，创立Visual文件来开发利用或服务的UI界面。

ArkTS工程和JS工程应用低代码的步骤雷同，接下来以JS工程为例别离解说这两种开发方式。

创立新工程反对低代码开发

在工程模板中，提供了低代码开发的工程模板，您能够间接抉择一个反对低代码开发的工程模板来开发利用或服务的UI界面。

NOTE
该性能在DevEco Studio 3.0 Beta2及更高版本中反对，且compileSdkVersion必须为7或以上。ArkTS低代码要求compileSdkVersion必须为8或以上。

接下来咱们以创立一个Empty Ability工程模板为示例进行阐明。

1.关上DevEco Studio，创立一个新的工程，抉择Empty Ability模板。

2.关上Enable Super Visual，示意应用低代码开发性能开发利用/服务。单击Finish期待工程同步实现。

同步实现后，工程目录中主动生成低代码目录构造。


pages > index > index.js：低代码页面的逻辑形容文件，定义了页面里所用到的所有的逻辑关系，比方数据、事件等，详情请参考JS语法参考。如果创立了多个低代码页面，则pages目录下会生成多个页面文件夹及对应的js文件。

NOTE
应用低代码页面开发时，其关联js文件的同级目录中不能蕴含hml和css页面，例如上图中的js > MainAbility > pages > index目录下不能蕴含hml与css文件，可能呈现报错。
  • pages > index >index.visual：visual文件存储低代码页面的数据模型，双击该文件即可关上低代码页面，进行可视化开发设计。如果创立了多个低代码页面，则pages目录下会生成多个页面文件夹及对应的visual文件。

3.关上“index.visual”文件，即可进行页面的可视化布局设计与开发。

NOTE
应用低代码开发界面过程中，如果界面须要应用到其它暂不反对可视化布局的控件时，能够在低代码界面开发实现后，单击按钮，将低代码界面转换为hml和css代码。留神，代码转换操作会删除visual文件及其父目录，且为不可逆过程，代码转换后不能通过hml/css文件反向生成visual文件。
多设施开发的场景，能够单击界面画布右上角设施/模式切换按钮，进行设施切换或模式切换。其中，单击按钮，切换到Media Query模式，能够针对不同设施和屏幕状态设置专属的款式和属性值，如下图，以后模式仅针对P40竖屏状态无效

在已有工程中增加Visual反对低代码开发

在已有的HarmonyOS工程中，能够通过创立Visual文件的形式，应用低代码开发利用或服务的UI界面，要求compileSdkVersion必须为7或以上。ArkTS低代码要求compileSdkVersion必须为8或以上。

1.在关上的工程中，选中模块的pages文件夹，单击鼠标右键，抉择New > Visual > Page。

2.在弹出的对话框中，输出Visual name，单击Finish。创立Visual后，会在工程中主动生成低代码的目录构造，如下图所示：


pages > page > page.js：低代码页面的逻辑形容文件，定义了页面里所用到的所有的逻辑关系，比方数据、事件等，详情请参考JS语法参考。如果创立了多个低代码页面，则pages目录下会生成多个页面文件夹及对应的js文件。

NOTE
应用低代码页面开发时，其关联js文件的同级目录中不能蕴含hml和css页面，例如上图中的js > MainAbility > pages > page目录下不能蕴含hml与css文件，否则可能报错。
  • pages > page >page.visual：visual文件存储低代码页面的数据模型，双击该文件即可关上低代码页面，进行可视化开发设计。如果创立了多个低代码页面，则pages目录下会生成多个页面文件夹及对应的visual文件。
NOTE
DevEco Studio预置了JS Visual模板，该模板对应的SDK版本为API 7。因而，在创立JS Visual文件时，如果模块的compileSdkVersion低于7，则会对新建的JS Visual文件对应的SDK版本进行降级解决，使其与模块对应的SDK版本保持一致。
不倡议通过文本编辑的形式更改visual文件，否则，可能导致不能失常应用低代码性能。

3.关上“page.visual”文件，即可进行页面的可视化布局设计与开发。

NOTE
应用低代码开发界面过程中，如果界面须要应用到其它暂不反对可视化布局的控件时，能够在低代码界面开发实现后，单击按钮，将低代码界面转换为hml和css代码。留神，代码转换操作会删除visual文件及其父目录，且为不可逆过程，代码转换后不能通过hml/css文件反向生成visual文件。
多设施开发的场景，能够单击界面画布右上角设施/模式切换按钮，进行设施切换或模式切换。其中，单击按钮，切换到media query模式，能够为组件设置不同的款式和属性。以后media query模式仅针对不同设施类型和不同屏幕状态（横屏\竖屏）无效。


为了可能让大家跟上互联网时代的技术迭代，在这里跟大家分享一下我本人近期学习心得以及参考网上材料整顿出的一份最新版的鸿蒙学习晋升材料，有须要的小伙伴自行支付，限时开源，先到先得~~~~

支付以下高清学习路线原图请点击→《鸿蒙全套学习指南》纯血鸿蒙HarmonyOS根底技能学习路线图

支付以上残缺高清学习路线图，请点击→《鸿蒙 (Harmony OS)开发学习手册》小编本人整顿的局部学习材料（蕴含有高清视频、开发文档、电子书籍等）

以上分享的学习路线都适宜哪些人跟着学习？
-应届生/计算机专业通过学习鸿蒙新兴技术，入行互联网，将来高起点待业。
-0根底转行提前布局新方向，抓住风口，自我晋升，取得更多就业机会。
-技术晋升/进阶跳槽倒退瓶颈期，晋升职场竞争力，疾速把握鸿蒙技术，享受蓝海红利。

最初

鸿蒙开发学习是一个系统化的过程，从基础知识的学习到实战技能的锻炼，再到对前沿技术的摸索，每一环节都至关重要。心愿这份教程材料能帮忙您疾速入门并在鸿蒙开发之路上步步攀升，成就一番事业。让咱们一起乘风破浪，拥抱鸿蒙生态的广大将来！

如果你感觉这篇内容对你有帮忙，我想麻烦大家动动小手给我：点赞，转发，有你们的 『点赞和评论』，才是我发明的能源。

关注我，同时能够期待后续文章ing，不定期分享原创常识。

想要获取更多残缺鸿蒙最新VIP学习材料，请点击→《鸿蒙根底入门学习指南》