标签：OpenHarmony 界面 框架 HarmonyOS 开发 UI ArkUI

一.基于OpenHarmony/HarmonyOS操作系统的ArkUI框架——Harmony原生开发

开发需要的IDE：

HUAWEI DevEco Studio

1.1 什么是ArkUI框架？

ArkUI是一套构建分布式应用界面的声明式UI开发框架。它使用极简的UI信息语法、丰富的UI组件、以及实时界面预览工具，帮助您提升HarmonyOS应用界面开发效率30%。您只需使用一套TS/JS API，就能在多个HarmonyOS设备上提供生动而流畅的用户界面体验。

ArkUI开发框架是方舟开发框架的简称，它是一套构建 HarmonyOS / OpenHarmony 应用界面的声明式UI开发框架，它使用极简的UI信息语法、丰富的UI组件以及实时界面语言工具，帮助开发者提升应用界面开发效率 30%，开发者只需要使用一套 TS / JS API，就能在多个 HarmonyOS / OpenHarmony 设备上提供既丰富又流畅的用户界面体验。

1.2 DevEcoIDE的安装与项目的创建

HarmonyOS官方文档地址，在文档地址里下载我们需要的IDE。

HarmonyOS应用开发官网 - 华为HarmonyOS打造全场景新服务

1.2.1 版本

DevEco Studio 3.0 Release:该版本适用HarmonyOS和OpenHarmony应用及服务开发，您可体验HarmonyOS 3.0 的开发能力

Command Line Tools for HarmonyOS:该版本适用于HarmonyOS开发，Command Line Tools for HarmonyOS是一系列开发工具的集合，可通过其中的sdkmgr工具查看、安装/更新和卸载多个HarmonyOS SDK包，支持通过自动化构建脚本调用。

Command Line Tools for OpenHarmony:该版本适用于OpenHarmony开发，Command Line Tools for OpenHarmony 是一系列开发工具的集合，可通过其中的sdkmgr工具查看、安装/更新和卸载多个OpenHarmony SDK包，支持通过自动化构建脚本调用。

1.2.2 系统要求

Windows操作系统：Windows10 64 位 内存：8GB 及以上 硬盘：100GB 及以上 分辨率：1280*800 像素及以上

macOS操作系统：macOS 10.15/11/12 内存：8GB 及以上 硬盘：100GB 及以上 分辨率：1280*800 像素及以上

1.2.3 下载IDE

选择：DevEco Studio 3.0

支持HarmonyOS 3.0的应用及服务开发，提供了代码智能编辑、低代码开发、界面调试双向预览、全新构建工具、模拟器等功能，同时支持OpenHarmony应用及服务开发。

随着时间的不断推移，后期版本会不断迭代，截至我目前现在是DevEco Studio 3.0版本，现在的这个IDE就已经同时支持了OpenHarmony和HarmonyOS的应用开发。

1.2.4 安装IDE

安装过程较为简单，自行百度。

安装完成之后，需要选择自己需要SDK进行下载：

安装完之后，进入IDE之后如下图：

二.三种开发方式分析比较

2.1 JS和ETS开发方式比较

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5idOCzOw-1663925667829)(https://gitee.com/shangjinzhu/personal-picture-bed/raw/master/image/view)]

引用回答：

虽然TypeScript是JavaScript的超集，但是TS和JS的开发方式仍然存在很大的差异。eTS是鸿蒙特有的响应式框架，除了性能、跨平台等优势以外，使用eTS框架能够在一个文件中实现界面的组织、样式和业务逻辑。因此，eTS更加符合直觉，实现所见即所得的效果。——董昱老师

2.2 基于js扩展的web开发范式

基于JS扩展的类Web开发范式的方舟开发框架，采用经典的HML、CSS、JavaScript三段式开发方式。使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发更新。此种开发方式，更接近Web前端开发者的使用习惯，快速将已有的Web应用改造成方舟开发框架应用。主要适用于界面较为简单的中小型应用开发。

整体架构

使用基于JS扩展的类Web开发范式的方舟开发框架，包括应用层（Application）、前端框架层（Framework）、引擎层（Engine）和平台适配层（Porting Layer）。

2.3 Java开发方式

Java的静态页面布局是layout文件夹的.xml文件里，同样跟刚才一样把页面分为三层，蓝色容器层、绿色卡片层、红色内容层。

2.4 基于TS扩展的声明式开发范式

基于TS扩展的声明式开发范式的方舟开发框架是一套开发极简、高性能、跨设备应用的UI开发框架，支持开发者高效的构建跨设备应用UI界面。

基础能力

使用基于TS扩展的声明式开发范式的方舟开发框架，采用更接近自然语义的编程方式，让开发者可以直观地描述UI界面，不必关心框架如何实现UI绘制和渲染，实现极简高效开发。开发框架不仅从组件、动效和状态管理三个维度来提供UI能力，还提供了系统能力接口，实现系统能力的极简调用。

优点

整体架构

2.5 总结

ts是js的扩展，而ets开发又是基于TS的，所以ets跟js开发是有很大的相似度，要是熟悉js学习ets也是比较容易的。而Java开发方式又是和安卓开发方式很像，所以说，这对于开发者的兼容性非常好，不管你之前做的是web开发还是安卓开发，都可以很好的上手去做鸿蒙开发。

标签：OpenHarmony,界面,框架,HarmonyOS,开发,UI,ArkUI
From： https://blog.51cto.com/u_15568258/5769002