HarmonyOS鸿蒙Next中UI的低代码开发工具在哪里？

HarmonyOS鸿蒙Next中UI的低代码开发工具在哪里？ 网上搜到说DEVECO Studio有可视化UI设计的工具，官网上也提到低代码开发工具但是没有有效的链接，就几张图片放那里，我在5.1.1版本里都没看到，啥情况？被官网忽悠了？

7 回复

您好：

Deveco Studio HarmonyOS 5.0起已切换底层版本依赖，短期内暂无低代码开发相关规划。

更多关于HarmonyOS鸿蒙Next中UI的低代码开发工具在哪里？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


感觉如果能拖拽随意更换组件位置，还是挺香的

不是低代码开发不好用，而实低代码开发工具要做的好用需要下功夫。Qt Creator的低代码开发就非常好用，开发PC端的软件几乎只需要专注于逻辑部分，关于UI的代码几乎不用写

ArkTS后没有了。声明式编程不用可视化UI工具，个人感觉效率更高

就算是有的吧，预览器，你没写一行代码它都会直接刷新页面。非常的方便写布局。

cke_854.png

在HarmonyOS Next中，低代码开发工具为DevEco Studio。您可在华为开发者联盟官网下载该IDE，安装后创建项目时选择“Low-Code”模板即可使用可视化界面进行UI开发。

在HarmonyOS Next开发中，UI的低代码开发能力已深度集成在DevEco Studio中，但形式与传统的独立“工具”或“面板”有所不同，并非被官网误导。

核心要点如下：

  1. 入口与形式：低代码开发并非一个完全独立的可视化设计器。您需要在DevEco Studio中创建一个 “Empty Ability” 项目时，在工程模板选择界面，必须勾选“Enable Super Visual”选项。创建完成后，项目中的 .visual 文件即为低代码开发页面。

  2. 操作界面：打开 .visual 文件后，编辑器界面将切换为可视化模式。您会看到：

    • 画布（Canvas）：中央区域，用于拖拽组件和预览UI。
    • 组件库（Component Library）：左侧面板，提供ArkUI组件（如按钮、文本、列表等）供拖拽使用。
    • 属性/样式/事件面板（Attributes/Styles/Events）：右侧面板，用于配置选中组件的属性、样式和绑定事件。
    • 组件树（Component Tree）：左下方面板，展示页面的组件层级结构。

  3. 版本确认：请确保您使用的是 DevEco Studio 5.0.1 (或更高) Release 版本，并安装了对应的HarmonyOS Next SDK。低代码（Super Visual）是HarmonyOS Next版本的核心特性，旧版本或配置不正确可能无法使用。

简要操作步骤：

  1. 打开DevEco Studio，选择 Create Project。
  2. 选择 “Empty Ability” 模板。
  3. 在项目配置页面，务必勾选 “Enable Super Visual”。
  4. 完成创建后，在 entry > src > main > supervisual > default > pages 目录下即可找到 .visual 页面文件进行可视化开发。

如果按此流程仍未找到，请检查DevEco Studio版本及SDK配置是否针对HarmonyOS Next。

回到顶部