下载掌阅APP，畅读海量书库
立即打开
本章将全面介绍HarmonyOS NEXT及其ArkTS声明式UI开发规范的核心内容与应用。
首先，深入剖析HarmonyOS NEXT的创新特点，包括微内核架构、全场景覆盖、分布式创新、流畅性能、安全至上和开放生态等，展示其在智能设备领域的深远影响以及为开发者带来的巨大机遇。
接着，详细阐述HarmonyOS NEXT的整体架构，涵盖声明式UI前端、语言运行时、声明式UI后端引擎、渲染引擎和平台适配层等关键组成部分，帮助开发者更好地理解系统的工作原理和资源管理方式。
然后，系统讲解ArkTS声明式UI开发流程，为开发者提供全面的指导。同时，介绍HarmonyOS NEXT应用开发中的通用规则，如默认单位vp的使用和异常值处理，助力开发者提高编码效率和代码质量。
接下来，详细描述开发环境搭建的全过程，包括HUAWEI DevEco Studio的下载、安装、配置和开发环境诊断等，确保开发者能够顺利搭建高效、稳定的开发平台。
最后，通过编写“Hello HarmonyOS”入门程序，带领读者逐步创建ArkTS工程，构建页面，实现页面间跳转，从而深入理解ArkUI框架的UI开发范式和应用模型，掌握ArkTS开发的基本技巧和流程。
通过本章的学习，读者将全面掌握HarmonyOS NEXT及其ArkTS声明式UI开发规范的关键知识，为后续的深入学习和开发实践打下坚实的基础。
在数字化浪潮中，操作系统不仅是硬件与用户之间的桥梁，更是驱动设备智能化的核心所在。华为推出的HarmonyOS NEXT，不仅展现了对未来智能生活的憧憬，更是华为技术创新的经典之作。
HarmonyOS NEXT是华为精心研发的一款操作系统，秉承“全场景、全连接、全智能”的设计理念，为全球用户描绘了全新的数字生活图景。基于微内核架构，这一系统以卓越的性能、安全性和可扩展性，出色地适配多种设备和应用场景。
HarmonyOS NEXT的核心亮点如下。
HarmonyOS NEXT采用微内核设计，与传统宏内核相比，具备更高的安全性和更快的响应速度，使系统既轻盈又强大。
支持从智能手机到平板电脑、智能电视及穿戴设备的多种场景，HarmonyOS NEXT实现了跨设备的无缝体验，确保用户在不同设备上的操作感受始终一致。
分布式能力是HarmonyOS NEXT的核心特色之一，支持设备间资源共享和任务协同，无论是数据传输还是应用执行，均可在设备间顺畅衔接，为用户带来便捷的使用体验。
通过先进的内存管理和任务调度技术，HarmonyOS NEXT确保用户获得流畅的系统体验。此外，系统支持多语言编程，为开发者提供更大的“创作”空间和自由度。
从设计阶段起，HarmonyOS NEXT便将安全置于核心位置，采用数据加密、安全启动等多层次防护措施，全面保障用户数据安全。
华为致力于构建开放的生态系统。HarmonyOS NEXT提供丰富的API和开发工具，激励全球开发者与合作伙伴共同探索新的可能性，为生态注入更多活力。
HarmonyOS NEXT的问世标志着华为产品生态的一次重大飞跃，也将在全球操作系统市场掀起波澜。它不仅有望重塑用户对智能设备的使用习惯，还将推动行业技术不断向前发展。
HarmonyOS NEXT的普及将加速设备智能化进程，更好地满足用户的个性化需求，提升使用体验。
系统的开放性和分布式架构将激发开发者的创新潜能，催生出新技术和新应用。
HarmonyOS NEXT的加入可能重塑操作系统市场的竞争格局，为用户提供更加多元化的选择，推动行业健康发展。
对于开发者而言，HarmonyOS NEXT不仅是一个强大的平台，更是一个孕育创新与成长的广阔舞台。
HarmonyOS NEXT提供的全栈自研优势，能够助力开发者降低开发成本，提高开发效率，实现高效创新。
借助系统级AI能力，开发者可以轻松构建智能功能，为用户带来原生应用的体验。
通过“一次开发，多端适配”的生态能力，HarmonyOS NEXT简化了跨设备开发流程，提升了应用开发效率与资源利用率。
在以安全为核心的平台上开发，有助于提升用户对应用的信任度。
华为秉持开放合作的理念，积极鼓励开发者加入，共同推动生态繁荣发展。
华为提供全面的开发支持和活跃的社区资源，助力开发者快速成长。
HarmonyOS NEXT是华为推出的新一代操作系统，其创新理念和强大功能充分展现了华为对未来智能生活的深刻洞察和技术实力。随着技术的不断完善和市场认可度的逐步提升，HarmonyOS NEXT有望成为推动智能设备发展的重要引擎。
了解操作系统架构设计对于学习应用开发至关重要，主要体现在以下几个方面：
● 资源管理与优化：操作系统是计算机系统的核心，负责管理硬件和软件资源。深入理解操作系统架构设计有助于开发者掌握如何高效地利用这些资源（如内存管理、进程调度、文件系统等），从而编写出更加高效、稳定且资源占用更少的代码。
● 并发与并行处理：操作系统的并发控制机制和并行处理策略对多任务处理和数据并行处理的应用开发至关重要。掌握这些知识有助于开发者设计出响应更快、性能更优的应用程序。
● 系统调用与接口：操作系统为上层应用提供了丰富的系统调用接口（System Call Interface）和应用程序编程接口（Application Programming Interface, API），这些接口是应用与操作系统交互的桥梁。了解操作系统的架构设计有助于开发者深入理解系统调用的工作原理和性能特性，从而更准确地使用这些接口来满足应用的需求。
● 安全与稳定性：操作系统架构的设计直接决定了系统的安全性和稳定性。掌握操作系统的安全机制（如权限管理、访问控制等）以及稳定性保障措施（如错误处理、故障恢复等），有助于开发者在开发应用中有效地考虑这些因素，编写出更加安全可靠的应用。
● 深入理解技术栈：在软件开发领域，操作系统是整个技术栈的基础层。深入了解操作系统架构的设计有助于开发者全面理解技术栈的整体结构和核心逻辑，从而更好地把握应用开发的方向和关键技术点。
因此，了解操作系统架构设计对于学习应用开发意义重大。这不仅能显著提高开发效率和代码质量，还能培养开发者的系统思维能力和跨平台开发能力。
HarmonyOS NEXT操作系统整体架构如图1-1所示。
图1-1 HarmonyOS NEXT整体架构图
声明式UI前端提供了UI开发范式的基础语言规范，内置丰富的UI组件、布局和动画，支持多种状态管理机制，为开发者提供完善的接口支持。
基于ArkTS语言（即方舟语言）的运行时（runtime，也称为运行时库），具备对UI范式语法的解析能力，支持跨语言调用，并提供高性能的TypeScript语言运行环境。
后端引擎兼容多种开发范式，提供强大的UI渲染管线支持，包括基础组件、布局计算、动效处理、交互事件管理，以及状态管理和绘制能力。
渲染引擎提供高效的绘制能力，可将渲染管线生成的渲染指令快速呈现至屏幕。
平台适配层提供系统平台的抽象接口，具备接入不同系统的能力，包括支持系统渲染管线的整合与生命周期调度管理。
使用UI开发框架开发应用时，主要涉及以下开发流程：
（1）ArkTS：包括ArkTS的语法、状态管理和渲染控制的应用场景。
（2）开发布局：包括常用布局方式及其使用场景。
（3）添加组件：包括内置组件、自定义组件以及通过API支持的界面元素。
（4）设置组件导航和页面路由：配置组件间的导航及页面的路由功能。
（5）显示图形：显示图片、绘制自定义几何图形，以及使用画布绘制自定义图形。
（6）使用动画：包括组件和页面动画的典型应用场景及实现方法。
（7）绑定事件：包括事件的基本概念，以及使用通用事件和手势事件的方法。
（8）使用自定义能力：理解自定义能力的基本概念，并实现相关功能。
（9）主题设置：进行应用级和页面级的主题设置与管理。
（10）使用NDK接口构建UI：通过ArkUI提供的NDK接口，创建和管理UI界面。
（11）使用镜像能力：了解镜像能力的基本概念，并掌握其使用方法。
通用规则是指开发应用时，系统默认的处理方式。熟悉这些规则可以帮助开发者提高开发效率，并编写出更高质量的代码。在HarmonyOS NEXT应用开发中，通用规则主要包含以下两个方面。
表示长度的输入参数的单位默认为vp，即number类型的参数。对于以number类型值表示的Length类型的参数及Dimension类型的参数，其数值单位默认为vp。
vp是虚拟像素（Virtual Pixel）的缩写，指设备相对于应用的虚拟尺寸（区别于屏幕硬件像素单位）。vp是一种灵活的单位，能根据不同屏幕的像素密度进行缩放，从而在各种屏幕上保持统一的尺寸显示效果，提供一致的视觉体验。
当输入参数为异常值（undefined、null或无效值）时，系统处理规则如下：
（1）若对应参数有默认值，则按默认值处理。
（2）若对应参数无默认值，则该参数对应的属性或接口不生效。
本节介绍HarmonyOS NEXT开发环境的搭建过程，包括安装和配置HUAWEI DevEco Studio。
HUAWEI DevEco Studio基于IntelliJ IDEA Community开源版本构建，为在HarmonyOS NEXT系统上的应用和服务提供一站式开发平台。
作为一款专业的开发工具，DevEco Studio除具备代码开发、编译构建、调测等功能外，还具备如下特点：
（1）高效智能代码编辑：支持ArkTS、JavaScript、C/C++等多种语言，提供代码高亮、智能补齐、错误检查、自动跳转、格式化、查找等功能，大幅提升代码编写效率。
（2）多端双向实时预览：支持UI界面代码的双向预览、实时预览、动态预览、组件预览及多端设备预览，便于开发者快速查看代码运行效果。
（3）多端设备模拟仿真：提供HarmonyOS NEXT本地模拟器，并支持iPhone等设备的模拟仿真，便捷获取调试环境。
（4）DevEco Profiler性能调优：提供实时监控能力和场景化调优模版，支持全方位的设备资源监测和多维度数据采集，帮助开发者实现高效的性能调优和快速定位问题代码行。
从HarmonyOS Developer官网下载最新版的DevEco Studio安装包。
DevEco Studio支持Windows和macOS系统，下面分别介绍在这两种操作系统下安装DevEco Studio软件的步骤。
为确保DevEco Studio正常运行，建议计算机配置满足以下要求：
● 操作系统：Windows 10 64位、Windows 11 64位。
● 内存：推荐16GB或以上，最低8GB。
● 硬盘：100GB或以上。
● 分辨率：1280×800像素或更高。
Windows环境下安装DevEco Studio的操作步骤如下：
双击下载的deveco-studio-xxxx.exe文件，启动DevEco Studio安装向导，如图1-2所示。
图1-2 安装向导界面
单击“下一步”按钮，进入“选择安装位置”界面。默认安装路径在C:\Program Files下，也可单击“浏览”按钮指定其他安装路径，然后单击“下一步”按钮，如图1-3所示。
图1-3 Windows环境下DevEco Studio的“选择安装位置”界面
在如图1-4所示的“安装选项”界面中勾选DevEco Studio后，单击“下一步”按钮。
图1-4 Windows环境下DevEco Studio的“安装选项”界面
按照提示依次单击“下一步”按钮，直至安装完成，最后单击“完成”按钮，如图1-5所示。
图1-5 Windows环境下DevEco Studio安装完成时的界面
为确保DevEco Studio正常运行，建议计算机配置满足以下要求：
● 操作系统：macOS(X86) 10.15/11/12/13/14；macOS(ARM) 11/12/13/14。
● 内存：推荐16GB或以上，最低8GB。
● 硬盘：100GB或以上。
● 分辨率：1280×800像素或更高。
macOS环境下安装DevEco Studio的操作步骤如下：
在安装界面中，将DevEco-Studio.app拖曳到Applications文件夹中，等待安装完成，如图1-6所示。
图1-6 macOS环境下DevEco Studio的安装界面
安装完成后，按照提示配置代理并检查开发环境。
为确保开发者在应用或服务开发过程中获得良好体验，DevEco Studio提供了开发环境诊断功能，帮助开发者检查开发环境是否配置完备。开发者可以在欢迎页面单击Diagnose按钮进行诊断，如图1-7所示。如果已打开工程开发界面，也可以在菜单栏中依次单击Help→Diagnostic Tools→Diagnose Development Environment选项进行诊断。
图1-7 Windows环境下DevEco Studio进入开发环境诊断时的界面
DevEco Studio开发环境诊断项包括计算机的配置、网络的连通情况以及依赖工具的安装情况等。如果检测结果为未通过，可根据检查项的描述和修复建议进行处理，具体界面如图1-8所示。
图1-8 Windows环境下DevEco Studio开发环境显示诊断结果时的界面
在工程开发界面的主菜单栏中，依次单击File→Settings→Plugins选项，选择Installed标签，在搜索框中输入Chinese，搜索结果里将出现Chinese（Simplified），在右侧单击Enable按钮，再单击右下角的OK按钮，如图1-9所示。
图1-9 Windows环境下DevEco Studio启用简体中文设置时的界面
在弹出的对话框中单击Restart按钮（见图1-10），重启DevEco Studio后，中文设置即可生效。
图1-10 插件设置完成后提示是否立刻重启DevEco Studio的对话框
本节将带领读者编写一个简单的HarmonyOS NEXT入门程序——Hello World，让读者初步体验HarmonyOS NEXT的开发流程。
HarmonyOS NEXT提供了一套UI开发框架，即方舟开发框架（ArkUI框架）。该框架为开发者提供了丰富的UI开发能力，包括多种组件、布局计算、动画能力、UI交互、绘制功能等。
方舟开发框架针对不同开发需求和技术背景，提供了两种开发范式：基于ArkTS的声明式开发范式和兼容JavaScript的类Web开发范式。这两种开发范式的对比如表1-1所示。
表1-1 两种开发范式的对比
应用模型是HarmonyOS NEXT为开发者提供的应用程序抽象提炼和运行机制，包括应用程序必备的组件和框架。通过应用模型，开发者可以基于统一框架高效开发应用。
随着系统的演进，HarmonyOS NEXT先后提供了两种应用模型：
● Stage模型：自HarmonyOS API 9开始新增的模型，是目前主推并将长期演进的模型。该模型提供AbilityStage和WindowStage等类作为应用组件和窗口的“舞台”，因此而得名。本节的Hello World程序将基于Stage模型开发。
● FA（Feature Ability）模型：自HarmonyOS API 7开始支持的模型，目前已不再作为主要推荐的模型。
本案例将展示一个包含两个页面的开发实例，并基于Stage模型构建第一个ArkTS应用，帮助读者理解相关概念及应用开发流程。
创建ArkTS工程的步骤如下：
如果是首次打开DevEco Studio，就单击Create Project按钮创建工程。如果已经打开了一个工程，则在菜单栏中依次单击File→New→Create Project新建一个工程。
在新建工程界面，选择Application类型的应用开发，选择Empty Ability模板，然后单击Next按钮进入下一步配置，如图1-11所示。
图1-11 DevEco Studio新建工程界面
工程模板支持的开发语言及模板说明如表1-2所示。
表1-2 工程模板支持的开发语言及模板说明
进入工程配置界面，将Compatible SDK设置为5.0.0(12)，将Module name设置为entry，其他参数保持默认设置即可，如图1-12所示。
配置完成后，单击Finish按钮，DevEco Studio会自动生成示例代码和相关资源，用户只需等待工程创建完成即可。
图1-12 DevEco Studio工程配置界面
新建ArkTS工程后的目录结构如图1-13所示。
图1-13 DevEco Studio新建工程的目录结构
目录说明如下：
（1）AppScope > app.json5：应用的全局配置文件。
（2）entry：HarmonyOS工程模块，编译构建生成一个HAP包。
（3）src > main > ets：用于存放ArkTS源代码。
（4）src > main > ets > entryability：应用或服务的入口。
（5）src > main > ets > pages：应用或服务包含的页面。
（6）src > main > resources：用于存放应用或服务使用到的资源文件，如图形、多媒体、字符串、布局文件等。
（7）src > main > module.json5：Stage模型模块配置文件，主要包含HAP包的配置信息、应用或服务在具体设备上的配置信息以及全局配置信息。
（8）src > test > build-profile.json5：当前的模块信息，包括编译信息配置项（如buildOption和targets配置等）。其中，targets可配置当前运行环境，默认为HarmonyOS。
（9）src > test > hvigorfile.ts：模块级编译构建任务脚本，开发者可自定义相关任务和代码实现。
（10）oh_modules：用于存放第三方库依赖信息。
（11）oh_modules > build-profile.json5：应用级配置文件，包括签名和产品配置等信息。
（12）oh_modules > hvigorfile.ts：应用级编译构建任务脚本。
工程同步完成后，在Project窗口中依次单击entry→src→main→ets→pages选项，打开Index.ets文件。该文件定义的页面由Text组件构成，它的代码如文件1-1所示。
文件1-1 Index.ets文件中的代码
@Entry
@Component
struct Index {
@State message: string = 'Hello World'
build() {
Row() {
Column() {
Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)
}.width('100%')
}
}
}
代码说明如下：
● @Entry：装饰器（decorator），在ArkTS中用于标记当前组件为应用程序的入口点，运行应用程序时，该组件会首先被加载和显示。
● @Component：这是另一个装饰器，用于声明后续的struct为一个组件，可包含状态、方法和UI布局。
● struct Index { ... }：定义名为Index的结构体，表示应用程序的主界面。
● @State message: string = 'Hello World'：声明状态变量message，类型为string，初始值为'Hello World'。@State装饰器表示该变量的变化可以被追踪，当它变化时，会触发UI自动更新。
● build() { ... }：这是一个方法，用来构建组件的UI布局。ArkTS使用声明式方式来构建UI，开发者只需描述所需界面，不必关心具体实现。
● Row() { ... }：水平布局组件，用来水平排列子组件。
● Column() { ... }：垂直布局组件，嵌套在Row内，用于垂直排列子组件。
● Text(this.message)：文本组件，显示状态变量message的值。
● fontSize(50)：设置文本字体大小为50。
● fontWeight(FontWeight.Bold)：设置文本字体为加粗样式。
● width('100%')：设置Column的宽度为父组件（Row）的100%，意味着它将占据其父组件的全部宽度。
这段代码创建了一个应用程序的主界面，包含一个水平布局，该布局内嵌垂直排列的文本组件，显示“Hello World”，字体大小为50，字体样式加粗，宽度占满父容器。
在默认页面基础上，通过添加Button组件实现按钮的单击响应功能，用于跳转到另一个页面。修改后的Index.ets文件内的代码见文件1-2。
文件1-2 修改后的Index.ets
@Entry
@Component
struct Index {
@State message: string = 'Hello World'
build() {
Column() {
Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)
// 添加按钮，以响应用户的单击
Button() {
Text('Next').fontSize(30).fontWeight(FontWeight.Bold)
}
.type(ButtonType.Capsule)
.margin({ top: 20 })
.backgroundColor('#0D9FFB')
.width('40%')
.height('5%')
}.width('100%')
.height('100%')
}
}
下面来解释一下添加按钮的代码片段的含义：
● Button() { ... }：创建按钮组件，内部可包含文本或其他子组件。
● Text('Next')：按钮内部添加文本组件，显示文本“Next”。
● fontSize(30)：设置按钮内部文本字体大小为30。
● fontWeight(FontWeight.Bold)：设置按钮内部文本的字体样式为加粗。
● type(ButtonType.Capsule)：设置按钮样式为胶囊形状。
● margin({ top: 20 })：设置按钮的上外边距为20。
● backgroundColor('#0D9FFB')：设置按钮背景颜色为#0D9FFB。
● width('40%')：设置按钮的宽度为父组件宽度的40%。
● height('5%')：设置按钮的高度为父组件高度的5%。
ArkTS的注释语法与JavaScript或TypeScript相同，因为它们都是基于JavaScript的语法。以下是几种常见的注释方式：
（1）单行注释：从两个斜杠（//）开始到行尾的所有内容均为注释内容，都会被编译器或解释器忽略，即不会被执行。例如：
// 这是一个单行注释
let value = 10; // 这行代码后面也有一个单行注释
（2）多行注释：从斜杠加星号（/*）开始到星号加斜杠（*/）结束，包围的内容为注释内容。例如：
/*
这是一个多行注释的例子
所有这些行都不会被执行
*/
let value = 20;
（3）HTML风格的注释：虽然HTML风格的注释不是JavaScript或TypeScript的官方注释方式，但在HTML中嵌入JavaScript代码时，有时会使用HTML注释（<![CDATA[]]>）来避免被HTML解析器错误解释。例如：
<!-- 这不是 JavaScript 的官方注释方式，但可以在 HTML 中使用 --><script>
<!--
let value = 30;
// -->
</script>
在ArkUI框架中，编写UI组件时，可以通过在组件代码中添加注释来提高代码的可读性和可维护性。
接下来，在编辑窗口右上角的侧边工具栏中单击Previewer，打开预览器。第一个页面的效果如图1-14所示。
图1-14 Hello World页面在预览器中的显示效果
在Project窗口中依次单击entry→src→main→ets选项，选择pages文件夹并右击，在弹出的快捷菜单中依次选择New→ArkTS File选项，新建一个ArkTS页面，并将它命名为Second，最后单击Finish按钮。此时，文件目录结构如图1-15所示。
图1-15 添加Second.ets后的文件目录结构
开发者也可以在右击pages文件夹后，在弹出的快捷菜单中依次选择New→Page选项，这样可以自动配置相关页面路由。
在Project窗口中依次单击entry→src→main→resources→base→profile选项，打开main_pages.json文件。在src字段中为第二个页面配置路由路径pages/Second，代码见文件1-3。
文件1-3 main_pages.json文件中的代码
{
"src": [
"pages/Index",
"pages/Second"
]
}
这段代码是一个JSON对象，定义了一个包含两个元素的数组，每个元素都是指向页面路径的字符串。在Web开发或移动应用开发中，这类配置通常用于指定应用程序的页面路由。
● "pages/Index"：指向应用程序的主页，可能是一个名为Index的页面组件。在单页应用程序（SPA）或多页应用程序中，这通常是用户加载应用时看到的第一个页面。
● "pages/Second"：指向应用程序的第二个页面，可能是一个名为Second的页面组件。通常在用户导航到此页面时加载。
参照第一个页面，在第二个页面中添加Text组件、Button组件等，并设置其样式。Second.ets文件中的代码见文件1-4。
文件1-4 Second.ets文件中的代码
@Entry
@Component
struct Second {
@State message: string = 'Hi there'
build() {
Row() {
Column() {
Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)
Button() {
Text('Back').fontSize(25).fontWeight(FontWeight.Bold)
}
.type(ButtonType.Capsule)
.margin({ top: 20 })
.backgroundColor('#0D9FFB')
.width('40%')
.height('5%')
}.width('100%')
}.height('100%')
}
}
代码说明如下：
● struct Second { ... }：定义了一个名为Second的结构体，包含组件的状态和UI布局。
● @State message: string = 'Hi there'：定义了一个状态变量message，初始值为'Hi there'。状态变量用于存储动态数据，当该数据变化时UI会自动更新。
● build() { ... }：这是组件的构建函数，用于定义组件的UI布局。
● Row() { ... }：创建了Row组件，用于水平排列子组件。
● Column() { ... }：创建了Column组件，用于垂直排列子组件，它被放置在Row内部。
● Text(this.message)：在Column内部创建了Text组件，用于显示状态变量message的值。
● fontSize(50)：设置文本组件的字体大小为50。
● fontWeight(FontWeight.Bold)：将文本组件的字体样式设置为加粗。
● Button() { ... }：在Column内部创建了Button组件，用于响应用户单击事件。
● Text('Back')：在按钮内部添加文本'Back'。
● fontSize(25)：设置按钮内部文本的字体大小为25。
● fontWeight(FontWeight.Bold)：设置按钮内部文本的字体为加粗。
● type(ButtonType.Capsule)：设置按钮的样式为胶囊型。
● margin({ top: 20 })：设置按钮的上外边距为20。
● backgroundColor('#0D9FFB')：设置按钮的背景颜色为#0D9FFB。
● width('40%')：设置按钮的宽度为父组件宽度的40%。
● height('5%')：设置按钮的高度为父组件高度的5%。
● Column().width('100%')：设置Column组件的宽度占满其父组件的宽度。
● Column().height('100%')：设置Column组件的高度占满其父组件的高度。
● Row().height('100%')：设置Row组件的高度占满其父组件的高度。
这段代码定义了一个包含欢迎信息和返回按钮的页面。当用户单击Back按钮时，通常会触发一个事件，允许用户返回到上一个页面。然而，这段代码中尚未实现按钮单击事件的处理逻辑。若需要支持返回功能，可通过添加事件监听器并定义相应的处理函数来完成。
页面间的导航可以通过页面路由router来实现。页面路由router根据页面URL找到目标页面，从而完成跳转。使用页面路由需要导入router模块。
在第一个页面中，为跳转按钮绑定onClick事件，当用户单击该按钮时即可跳转到第二个页面。修改后的Index.ets文件中的代码见文件1-5。
文件1-5 Index.ets文件中的代码
关键代码的解释如下：
● import { router } from '@kit.ArkUI'：导入ArkUI框架中的router模块，用于页面路由管理。
● import { BusinessError } from '@kit.BasicServicesKit'：导入BusinessError类，用于错误处理。
● onClick(() => { ... })：为按钮添加单击事件监听器。
● console.info(...)：在控制台输出信息，表示按钮单击事件被成功接收。
● router.pushUrl({ url: 'pages/Second' })：调用路由模块的pushUrl方法，尝试跳转到pages/Second页面。
● then(() => { ... })：路由跳转成功后执行的回调函数，输出跳转成功的信息。
● catch((err: BusinessError) => { ... })：路由跳转失败后执行的回调函数，捕获错误并输出错误代码和消息。
在第二个页面中，为返回按钮绑定onClick事件，当用户单击该按钮时将返回到第一个页面。修改后的Second.ets文件中的代码见文件1-6。
文件1-6 Second.ets文件中的代码
关键代码的解释如下：
● onClick(() => { ... })：为按钮添加单击事件监听器。
● console.info(...)：在控制台输出信息，表示按钮单击事件被成功接收。
● router.back()：调用路由模块的back方法，尝试返回到前一个页面。
● console.info('成功返回到第一个页面。')：如果成功返回，则输出信息到控制台。
● catch (err) { ... }：如果返回时发生错误，则捕获错误并处理。
● let code = (err as BusinessError).code：从错误对象中获取错误代码。
● let message = (err as BusinessError).message：从错误对象中获取错误消息。
● console.error(...)：如果返回失败，则输出错误信息到控制台。
打开Index.ets文件，先单击预览器中的
按钮进行刷新，然后在预览器中单击第一个页面中的Next按钮，即可跳转到第二个页面；单击第二个页面中的Back按钮，将返回到第一个页面，如图1-16所示。
图1-16 预览器中页面显示效果
华为推出的HarmonyOS NEXT是一款面向未来的智能操作系统，具有微内核架构、全场景覆盖、分布式创新、性能流畅、安全至上、开放生态的特点。
HarmonyOS NEXT的深远影响包括加速设备智能化进程，激发技术创新活力和重塑市场竞争格局。对于开发者而言，它不仅是一个平台，更是一个充满机遇的创新舞台，提供了全栈自研能力、原生应用开发、统一生态部署、安全与隐私保障、开放合作生态和丰富的技术支持与社区资源。
在开发环境搭建方面，本章介绍了如何从HarmonyOS Developer官网下载并安装DevEco Studio，配置开发环境，并启用中文化插件。
通过入门程序示例，本章展示了创建ArkTS工程的基本流程，包括构建页面、添加组件和实现页面间跳转的具体方法。
HarmonyOS NEXT的普及将推动智能设备的快速发展，为开发者提供更广阔的创新空间，进一步促进智能生态的繁荣。
1．HarmonyOS NEXT的架构设计对开发者在资源管理方面有哪些帮助？
2．ArkTS语言在HarmonyOS NEXT中主要应用于哪些方面？
3．在HarmonyOS NEXT中，声明式UI后端引擎提供了哪些功能？
4．在HarmonyOS NEXT的应用开发中，默认的长度单位是什么？
5．DevEco Studio提供了哪些主要功能？
6．在ArkTS中，如何实现页面间的跳转？
7．请简述在HarmonyOS NEXT中创建ArkTS工程的基本步骤。