HarmonyOS 应用开发学习记录 - Hello World 跑起来

        在上篇 《HarmonyOS 应用开发学习记录 - 从Windows开发者视角看鸿蒙开发》

中讲了很多从 Windows 开发者视角对HarmonyOS 的初步印象和感受。

        这一篇直接上手HarmonyOS 开发。

        -- 没有什么比跑起来 Helloworld 更令人直观的学习方式了 🤭       

本篇目标

•  搭建开发环境
•  运行Helloworld
•  理解项目结构代码
•   初步认识鸿蒙程序

HarmonyOS应用开发旅程

         DevEco Studio 是 面向华为终端全场景多设备的一站式集成开发环境（IDE），为开发者提供工程模板创建、开发、编译、调试、发布等E2E的HarmonyOS应用/服务开发。

安装 DevEco Studio

        在华为开发者联盟-HarmonyOS开发者官网下载 DevEco Studio 当前系统对应的版本（下载前需要先注册开发者账号）。

注意

        DevEco Studio开发环境依赖于网络环境，需要连接上网络才能确保工具的正常使用。

        安装很简单，一路下一步即可

        最好勾选创建桌面快捷方式和更新 PATH 变量，这样以后更方便。 

        如果一切顺利，在桌面或开始菜单就可以看到 DevEco Studio 快捷方式了，点击启动！

        第一次启动会提示导入配置、同意协议等一路忽略、确定即可。         

配置 HarmonyOS 虚拟机

        点击菜单栏上的 Tools/Device Manage，进入设备管理界面

               点击 Yes 去选择虚拟机镜像版本去下载。

        如果只是为了开发HarmonyOS PC，选择 Tablet 即可。

        接下来选择虚拟设备时需要注意，如果选择了 Huawei_Phone 就只能跑手机端程序了，所以我们要么选择Huawei_Tabled，要么选择Huaei_2in1，即二合一版本。

        这里要花费一点时间等待镜像下载，一般十分钟左右即可。

        下载后会提示配置虚拟机，如内存、存储大小，我没有调整，使用默认配置。接下来，就可以启动虚拟机了。

        点击右侧绿色箭头按钮，启动虚拟机。

        至此，我们就拥有了一台虚拟的 HarmonyOS PC。我们的程序将跑在这个虚拟机中。

        以上的流程操作起来其实十分简单，跟着提示走即可。配置好后，后续就不会再麻烦了。

        接下来，创建 Helloworld 程序。

构建第一个ArkTS应用

         在 DevEco Studio 开发环境中，点击 Create Project 按钮，进入创建项目界面

        选择左边的 【Application】后，在选择第一个【Empty Ability】，至于什么叫Application，什么叫 Atomic Service，各种 Ability 又是什么，稍后说明。

        接下来对新建项目进行简单的配置，这里需要修改的主要就是项目名称（Project name）和 存储位置（Save location）。 其他默认，点击 【Finish】按钮

        至此，我们已经新建了一个空白的 HarmonyOS 应用。

运行 Hello World

        在 IDE 的工具栏中

        最后，点击绿色箭头按钮或 Shift+F10 ，启动程序！ 

        如果一切顺利，我们将在刚才启动的虚拟机中看到我们的第一个 HarmonyOS 的 ArkTS 程序Hello World。整个过程还是十分简单顺畅的。

        跑是跑起来了，可是看着IDE生成的一大堆文件，很困惑 Hello World 需要这么多文件吗？程序到底是怎样跑起来，入口点在哪里，HarmonyOS 的程序也有窗口概念吗？

       慢慢来，先梳理下工程目录结构。

认识ArkTS工程结构（Stage模型）

         如上图，IDE为我们创建的 Helloworld 项目生成了很多文件。 

        对比Windows开发，无论是 C++ 还是 Delphi 完成输出 Hello World ，只需要一个源码，两三个工程项目配置文件即可。

        为什么 HarmonyOS 项目需要这么多的文件，哪些是主要的代码文件，各自什么作用呢？

工程结构解析

• 核心目录

• AppScope/ ：应用全局配置
  • app.json5 ：应用级配置(应用名称、版本等)
  • resources/ ：全局资源文件
• entry/ ：主模块(类似Android的app模块)
  • src/main/ets/ ：核心代码目录
    • entryability/ ：Ability生命周期管理
    • pages/ ：UI页面(类似Vue/React的组件)

• 关键文件

        程序入口

• EntryAbility.ets ：Ability入口(类似Android的MainActivity)
• Index.ets ：主页面(类似Vue的App.vue)

         配置文件

• build-profile.json5 ：构建配置
• module.json5 ：模块配置

         构建系统

• hvigorfile.ts ：构建脚本(类似Gradle)
• oh-package.json5 ：依赖管理(类似package.json)

        另外还有些和测试相关的目录，我们暂且不需要关注。

        最为关键的就是 ..entry/src/main/ets/ 下的 EntryAbility.ets 、Index.ets 。它们负责了程序的生命周期，界面UI的展示。

寻找入口点

        在Windows开发中，每个程序有且仅有一个入口点，一般是 main、_WinMain（虽然也可以手动配置）。

        在 HarmonyOS 程序中，上面提到 EntryAbility.ets 是入口代码，这是如何确定的？

        EntryAbility.ets 成为程序入口是由配置声明和代码结构共同决定的，与Windows程序的入口机制既有相似又有差异：

• 配置声明（类似Windows的.def文件）

在 module.json5 中明确指定了入口Ability：

         EntryAbility.ets 作为程序入口，何时以及如何加载哪个显示界面呢？

         答案是在 onWindowStageCreate 事件中，通过 windowStage.loadContent  方法加载了   page/Index 展示界面。

        查看 EntryAbility.ets 代码，虽然不像 _tWinMain 那样有固定函数名，但也有标准生命周期方法，对比一下 Windows 程序：

// 鸿蒙Ability (EntryAbility.ets)
export default class EntryAbility extends UIAbility {
  // 类似窗口创建
  onCreate() { 
    // 相当于Win32的RegisterClass和CreateWindow
  }
  
  // 类似WM_CREATE
  onWindowStageCreate(windowStage) {
    // 加载页面 ≈ 创建子控件
    windowStage.loadContent('pages/Index')
  }

  onWindowStageDestroy(): void {
    // Main window is destroyed, release UI related resources
    hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');
  }
}

// Windows窗口类 (Win32 API方式)
LRESULT CALLBACK WndProc(HWND hWnd, UINT msg, WPARAM wParam, LPARAM lParam) {
  switch(msg) {
    case WM_CREATE: 
      // 创建子控件
      break;
    case WM_DESTROY:
      PostQuitMessage(0);
      break;
  }
  return DefWindowProc(hWnd, msg, wParam, lParam);
}

         但这只是粗略的对应，EntryAbility 继承自 UIAbility，它的生命周期机制和Windows 并不相同。

UIAbility生命周期

        现在脑海里有个印象，具体的细节后续再研究。

        接下来看UI展示部分。

界面UI展示

        由 EntryAbility 加载的 entry\src\main\ets\pages\Index.ets 负责具体的页面展现。

        看起来像是 VUE 组件的结构：

        @Component表示自定义组件

        @Entry表示该自定义组件为入口组件

        @State表示组件中的状态变量，状态变量变化会触发UI刷新。

        界面布局更像是配置，而不是“编码”，事件响应也更为简单直接，相比 Windows 程序开发，不需要关注底层窗口消息。

HarmonyOS 中的应用

        通过上面的学习，大致有了个对HarmonyOS应用的了解，那么到底什么是HarmonyOS应用呢？

        用户应用程序是指运行在设备操作系统之上，为用户提供特定服务的程序，简称“应用”。一个应用所对应的软件包文件，称为“应用程序包”。

        应用的多Module设计机制

• 支持模块化开发
• 支持多设备适配

        我的理解是，HarmonyOS应用是由一个或多个Module组成，由配置决定调用的一个灵活松散的结合体。可能有误，欢迎指正。

和 Windows 开发对比

        可以看出来，HarmonyOS 程序的项目组织方式和现有的移动端（尤其是Android）开发极为相似，UI代码对前端也是十分熟悉：

• Gradle-like的构建系统（Hvigor）
• 类似Flutter的声明式UI（ArkUI）
• 前端友好的开发体验（ETS语法）

        相比，和 Windows 开发的差异就很大。如果一定要和Windows开发做类比，简单粗暴的如下理解：

• 组件概念对比
  • (module) ≈ DLL，Ability ≈ EXE
  • Hvigor ≈ MSBuild + NuGet
  • ArkUI组件 ≈ WinUI控件 + XAML

• 开发范式对比
  • 模块化 ：
    • Windows：通常通过DLL实现
    • 鸿蒙： module.json5 声明式配置（更灵活但更复杂）
  • 资源管理 ：
    • Windows：.rc文件集中管理
    • 鸿蒙：分目录的多语言/多分辨率资源（适应移动端需求）
  • 生命周期：
    • Windows：手动处理 WM_CREATE 等消息
    • 鸿蒙 ：由系统托管

ArkTS 应用代码组织

• 在module.json5 （entry\src\main\）中配置指定入口Ability（entry\src\main\ets\entryability\EntryAbility.ets）
• EntryAbility.ets  中在 onWindowStageCreate 事件中，通过 windowStage.loadContent 加载页面（类似动态创建窗口）
• pages\Index.ets 以声明式的方式展现界面及响应事件

        如此一来，我们简单的把 ArkTS 的项目结构、启动流程大致掌握了。这其中很可能有些错误遗漏，欢迎大家评论指出，我在后续学习中也会回头纠正的。

        需要说明的是：关于 ArkTS 应用和 Windows 程序的对比，只是为了方便学习理解 HarmnonyOS 程序，但二者本质上是极为不同的，不能一一对应，例如关于程序的定义，程序的生命周期都有着巨大的差异。

        为了更好的理解 HarmnonyOS 中的程序生命周期，大家可以阅读这一篇

ArkUI 生命周期（UIAbility、WindowStage、AbilityStage、Page、Component） | 华为开发者联盟

回顾总结

        在这一篇中，安装了 HarmonyOS 开发工具 DevEco Studio、下载配置并运行起来HarmonyOS 虚拟机。完成以上基础的环境搭建工作后，新建了个HelloWorld项目，一行代码没写，跑起来了！最后我们针对IDE自动生成的目录结构、代码流程有了个初步的认识，并和Windows 开发做了对比，便于理解。

        总的来说，过程是顺利的，但困惑和不适很多，还需要持续地学习去消除困惑，逐渐适应 HarmonyOS 的理念。

        继续努力 (ง •_•)ง

预告

        下一篇我们要更为深入的了解 HarmonyOS 下的应用模型，尤其是 Stage 模型。

参考

• HarmonyOS应用开发快速入门
• 构建第一个ArkTS应用（Stage模型）-快速入门-基础入门 - 华为HarmonyOS开发者
• 应用程序包概述-应用程序包基础知识-开发基础知识-基础入门 - 华为HarmonyOS开发者
• ArkTS简介-ArkTS（方舟编程语言）-应用框架 - 华为HarmonyOS开发者
• Stage模型开发指导-Ability Kit（程序框架服务）-应用框架 - 华为HarmonyOS开发者
• 应用开发准备-应用开发准备 - 华为HarmonyOS开发者
• ArkUI 生命周期（UIAbility、WindowStage、AbilityStage、Page、Component） | 华为开发者联盟
• 基本语法概述-学习UI范式基本语法-UI开发 (ArkTS声明式开发范式)-ArkUI（方舟UI框架）-应用框架 - 华为HarmonyOS开发者
• 相对布局 (RelativeContainer)-构建布局-开发布局-UI开发 (ArkTS声明式开发范式)-ArkUI（方舟UI框架）-应用框架 - 华为HarmonyOS开发者应用配置文件（Stage模型）-开发基础知识-基础入门 - 华为HarmonyOS开发者