当前位置：首页 > article >正文

鸿蒙开发入门之Hello World

article 2025/1/23 11:10:33

正所谓“工欲善其事，必先利其器”。搭建HarmonyOS开发环境需要满足以下基本条件。

• 操作系统：64位的Windows或macOS系统

• 内存：8GB及以上

• 硬盘：100GB及以上

• 分辨率：1280*800像素及以上

一、DevEco Studio简介

HUAWEI DevEco Studio（获取工具请单击链接下载，以下简称DevEco Studio）是基于IntelliJ IDEA Community开源版本打造，为运行在HarmonyOS系统上的应用和元服务（以下简称应用/元服务）提供一站式的开发平台。

作为一款开发工具，除了具有基本的代码开发、编译构建及调测等功能外，DevEco Studio还具有如下特点：

高效智能代码编辑：支持ArkTS、JS、C/C++等语言的代码高亮、代码智能补齐、代码错误检查、代码自动跳转、代码格式化、代码查找等功能，提升代码编写效率。更多详细信息，请参考代码编辑。
多端双向实时预览：支持UI界面代码的双向预览、实时预览、动态预览、组件预览以及多端设备预览，便于快速查看代码运行效果。更多详细信息，请参考界面预览。
多端设备模拟仿真：提供HarmonyOS本地模拟器，支持Phone等设备的模拟仿真，便捷获取调试环境。更多详细信息，请参考使用模拟器运行应用/元服务。
DevEco Profiler性能调优：提供实时监控能力和场景化调优模板，便于全方位的设备资源监测，采集数据覆盖多个维度，为开发者带来高效、直通代码行的调优体验。

二、快速开始

开发鸿蒙应用需要使用华为开发的集成开发环境 HUAWEI DevEco Studio，如果还没有安装DevEco Studio，可以到官网：下载中心 | 华为开发者联盟-HarmonyOS开发者官网，共建鸿蒙生态选择对应的版本下载并安装。

图片

安装完成后，打开DevEco Studio。

图片

三、创建和运行Hello World

身为开发者，第一课永远从 Hello World 开始。

图片

3.1 创建Hello World

打开DevEco Studio，在欢迎页单击Create Project，创建一个新工程。根据工程创建向导，选择创建Application或Atomic Service。选择Empty Ability模板，然后单击Next。

图片

配置项目参数。修改项目名称（Project name）为 QuickStart，其余保持默认即可。点击【Finish】按钮完成配置。

图片

项目创建成功后的界面。

图片

早期的HarmonyOS支持使用Stage模型和FA模型两种模型来创建ArkTS工程。不过从版本9开始，HarmonyOS仅支持使用Stage模型创建的ArkTS工程，也即是我们现在看到的工程结构。

Stage模型的ArkTS工程结构主要由AppScope、entry、hvigor、build-profile.json5以及hvigorfile.ts文件构成，说明如下。

AppScope > app.json5：应用的全局配置信息。
entry：应用/服务模块，会编译构建生成一个HAP。
oh_modules：存放应用/服务模块的第三方库依赖信息。
src > main > ets：用于存放ArkTS源码。
src > main > ets > entryability：应用/服务的入口文件。
src > main > ets > pages：应用/服务业务页面。
src > main > resources：存放应用/服务用到的资源文件，如图片、多媒体、字符串、布局文件等。
src > main > module.json5：模块配置文件，包含HAP配置信息、应用配置信息。
build-profile.json5：模块信息、编译配置文件，包括targets、buildOption配置等。
hvigorfile.ts：模块级编译构建任务脚本。
oh-package.json5：三方包声明文件的入口以及包名配置。
build-profile.json5：应用级配置信息，包括签名、产品配置等。
hvigorfile.ts：应用级编译构建任务脚本。

对于我们初学者来说，目前只需关注一个文件：entry/src/main/ets/pages/Index.ets，它包含页面布局元素。

图片

其中，@Component 装饰器用于定义和管理自定义组件，build() 函数用于定义组件的 UI 结构。组件使用 struct 关键字定义。@Entry 装饰的 @Component 是 UI 页面的入口，在单个 UI 页面中，最多使用 @Entry 定义一个自定义组件。

Text 组件展现一段文本，文本内容来自 @State 装饰器标记的响应式状态变量 message。使用 id() 为它创建唯一标识符，fontSize() 定义字号，fontWeight 定义字重。

alignRules 属性用于指定子元素相对于父容器的对齐规则，仅当父容器为 RelativeContainer 时有效。这里设置 Text 组件横向居中，纵向也居中。

点击右侧边缘的【Preview】按钮可以预览页面效果。

图片

点击右侧的【…】小按钮，弹出设备的参数设置面板，可以调节语言、分辨率等设备参数。

图片

预览时有一个细节需要注意，需要选中 @Entry 所在的文件，预览器才能顺利打开。否则，你会看到一个空白的预览面板。

3.2 运行Hello World

搭载HarmonyOS系统的真机与电脑连接。点击File > Project Structure… > Project > SigningConfigs界面勾选“Support HarmonyOS”和“Automatically generate signature”，点击界面提示的“Sign In”，使用华为账号登录。等待自动签名完成后，点击“OK”即可。

图片

当然，我们也可以使用本地模拟器来运行HarmonyOS应用，如果还没有创建模拟器，可以先创建一个。

图片

不过需要注意的是，在使用本地模拟器运行HarmonyOS应用时，需要注意DevEco Studio的版本和设备镜像的版本保持一致，否则可能出现提示“compatibleSdkVersion and releaseType of the app do not match the apiVersion and releaseType on the device.”错误信息。