第一个鸿蒙应用-HelloWorld

吾奶习武之人2024-03-052024-03-05

DevEco Studio 配置开发环境完成后，通过运行 Hello World 工程来验证环境设置是否正确。接下来以创建一个 Phone 设备的工程为例进行介绍。

1. 创建一个新工程

步骤1：打开 DevEco Studio，在欢迎页单击 Create Project，创建一个新工程。

步骤 2 ：根据工程创建向导，选择创建 Application 或 Atomic Service。选择“[OpenHarmony]Empty Ability”模板<先基于OpenHarmony学习，可以使用最新版的sdk>，然后单击 Next。

关于工程模板的介绍和支持的设备类型，请参考工程模板

模板名称	说明
Empty Ability	用于 Phone、Tablet、TV、Wearable 设备的 Feature Ability 模板，展示了基础的 Hello World 功能。
Native C++	用于 Phone、Car、Tablet 设备的 Feature Ability 模板，作为应用/服务调用 C++代码的示例工程，界面显示“Hello World”。
[Lite]Empty Ability	用于 Lite Wearable、Smart Vision、 Router 设备的 Feature Ability 模板，包含一个简单的 Hello World 文本。该模板包含两个组件：div 和 text，同时演示了数据绑定的使用方式。使用该模板时，不能同时选择多个设备，即不能创建跨设备工程。
[OpenHarmony]Empty Ability	用于创建支持 OpenHarmony 工程的 Feature Ability 模板，展示了基础的 Hello World 功能。
About Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的关于页面。模板的上方通过基础组件 Image、Text 展示了应用的基本信息，点击中间的 List 组件可以打开详情页，下方使用 Web 组件加载了用户协议和隐私声明的 Html 文件。开发者可以在模板的基础上，补充 List 内容，替换相关显示信息。
Business Card Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的名片页面。模板底部通过 Tab 组件实现不同名片的切换，中间的详情 List 组件使用了不同的 Widget，如 Information 图标、Switch 开关、右侧箭头图标等。开发者可以根据需要替换用户名称和 List 组件内容。
Category Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的分类展示页面。模板上方是 Navigation 组件和 search 组件，下方是 Tab 组件。中间的 List 组件有联动，点击左边 List 的分类项，右边 List 会滑动到对应位置，反之亦然。开发者可以根据需要替换相关内容。
Category List Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的卡片型设置页面。模板上方是 Navigation 组件和 search 组件，中间的 List 组件参考 Settings 的界面风格，由子标题加 List 卡片组成。开发者可以根据需要替换标题和每一个设置项的内容。
Grid Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的网格布局页面。模板上方是 Navigation 组件，中间分割成两个大小不同的 Grid 组件，每个 Grid 组件的 Item 等比例显示。开发者可以通过模板学习 Grid 组件的使用方式。
List Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的列表页面。模板上方是 Navigation 组件和 search 组件，下方是 Tab 组件。中间的 List 组件使用了双行布局，点击打开详情页。开发者可以根据需要替换双行列表和辅助文本内容。
Login Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的登录页面。用户输入账号和密码之后，才能点击登录按钮。点击登录、注册和遇到问题分别会跳转到示例页面。模板底部使用 Web 组件加载了隐私声明的 Html 文件。开发者可以补充账号密码的存储逻辑，完善登录功能。
Splash Screen Ability	用于 Phone、Tablet 设备的模板，可以快速创建应用的启动过程页面。模板右上角显示倒计时图标，点击跳过按钮或者等倒计时结束都会进入应用主界面，下方提供了应用的版权信息。开发者可以设置倒计时时间，根据需要整体替换广告背景。
Empty Ability with CloudDev	端云一体化开发通用模板。更多信息请参见端云一体化开发。

步骤 3 ：在工程配置页面，需要根据向导配置工程的基本信息。

Project name：工程的名称，可以自定义，由大小写字母、数字和下划线组成。
Bundle name：应用的包名，用于标识应用的唯一性。
Save location：工程文件本地存储路径，由大小写字母、数字和下划线等组成，不能包含中文字符
Compile SDK：应用/服务的目标 API Version，在编译构建时，DevEco Studio 会根据指定的 Compile API 版本进行编译打包。
Compatible SDK：兼容的最低 API Version。
Module name：模块的名称。
Model：应用支持的模式，API Version 4~8 只支持 FA 模式。
Enable Super Visual：支持低代码开发模式。部分模板支持低代码开发，可选择打开该开关。当前仅 API 9 及以下工程支持低代码开发。
Device type：该工程模板支持的设备类型。
Node：配置当前工程运行的 Node.js 版本，可选择使用已有的 Node.js 或下载新的 Node.js 版本。

当前 DevEco Studio 需分别配置 IDE 级 Node.js 和工程级 Node.js：

IDE 级 Node.js 用于支持 DevEco Studio 整体运行。安装 DevEco Studio 时，在配置向导中对 IDE 级 Node.js 进行配置。打开工程后，如需修改 IDE 级 Node.js 配置，单击 File > Settings > Build, Execution, Deployment > Node.js and npm （macOS 为 DevEco Studio > Preferences > Build, Execution, Deployment > Node.js and npm），在 Node.js home 中选择或下载其他 Node.js 版本。

工程级 Node.js 服务于工程构建的运行过程。API Level 与 Node.js 版本配套关系请参见配套关系。如需修改工程级 Node.js 配置，单击 File > Project Structure… > Project ，在 Basic Info 页签下选择或下载其他 Node.js 版本。