📘 第16章 拓展阅读——Flutter 与 鸿蒙（HarmonyOS）

本章是拓展内容，帮助你了解当前最主流的跨平台技术 Flutter 与国产操作系统鸿蒙（HarmonyOS）的基础知识和入门开发流程。

---

📑 目录

• 一、初识 Flutter

  • 1.1 Flutter 的诞生

  • 1.2 Flutter 的发展历史

  • 1.3 Flutter 框架结构

  • 1.4 Flutter 的特性

  • 1.5 Flutter 的开发语言：Dart

  • 1.6 Dart 语言简介

  • 1.7 Dart 语言优势

• 二、初识鸿蒙（HarmonyOS）

  • 2.1 鸿蒙的诞生

  • 2.2 鸿蒙系统概述

  • 2.3 鸿蒙的技术架构

  • 2.4 搭建鸿蒙开发环境

    • 下载与安装 DevEco Studio

    • 下载 Node.js 与 SDK

    • 创建模拟器

  • 2.5 开发第一个鸿蒙程序

  • 2.6 鸿蒙应用的程序结构

---

一、初识 Flutter

---

1.1 Flutter 的诞生

Flutter 是 Google 于 2017 年正式推出的跨平台 UI 开发框架，目标是实现：

“一套代码，同时运行在 Android、iOS、Web、桌面等多个平台。”

它最早的内部代号是 Sky，后更名为 Flutter。

---

1.2 Flutter 的发展历史

时间	事件
2015	Google 宣布 Sky，最高可达 120fps
2017	Flutter Alpha 发布
2019	Flutter 1.0 正式版发布
2021	Flutter 2：支持 Web、桌面端
2023	Flutter 3：性能大幅提升
今天	Flutter 是最流行的跨平台开发框架之一

---

1.3 Flutter 框架结构

Flutter 主要由三层组成：

-------------------------------------
|  应用层：Dart 代码（Widget、业务） |
-------------------------------------
|  框架层：Material、Cupertino 风格  |
-------------------------------------
|  引擎层：Skia 图形引擎、文本引擎   |
-------------------------------------

特点：界面渲染不依赖原生控件，全由 Skia 绘制。

---

1.4 Flutter 的特性

✔ 跨平台性强：一套代码多端运行
✔ 性能接近原生：使用 Skia 渲染引擎
✔ 开发效率高：Hot Reload 热重载
✔ 组件丰富：Material / Cupertino
✔ 社区强大：生态完善

---

1.5 Flutter 的开发语言：Dart

Flutter 不使用 Java/Kotlin 或 Swift，而是使用 Dart 语言。

为什么选择 Dart？

• 编译速度快

• 适合高帧率渲染

• 支持 JIT（开发快）与 AOT（运行快）

• 语法简单，类似 Java + JavaScript

---

1.6 Dart 语言简介

Dart 是 Google 推出的现代化编程语言，特点：

• 面向对象

• 强类型

• 支持异步 async/await

• JIT 和 AOT 双编译

---

1.7 Dart 语言优势

🌟 1）语法简单易学

类似 Java：类、继承、泛型都很熟悉。

🌟 2）支持异步编程

Flutter 界面渲染必须大量异步操作。

Future<void> main() async {
  var data = await loadData();
  print(data);
}

🌟 3）性能强

UI AOT 编译后运行很流畅。

---

二、初识鸿蒙（HarmonyOS）

---

2.1 鸿蒙的诞生

华为在 2019 年发布 HarmonyOS（鸿蒙），目标是：

面向全场景的分布式操作系统。

能够运行在：

• 手机

• 手表

• 平板

• 电视

• 车机

• 家电 IoT

---

2.2 鸿蒙系统概述

HarmonyOS 特点：

特性	说明
分布式能力	可跨设备协同运行（如手机控制电视）
方舟编译器	自研编译器，运行效率提升明显
多端部署	一套代码运行多设备
全栈自研	包含系统内核、框架、编译器等

---

2.3 鸿蒙的技术架构

HarmonyOS 的结构一般分为三层：

----------------------------------------
| 应用层（FA/Stage 模型）              |
----------------------------------------
| 框架层（UI、路由、网络、媒体）       |
----------------------------------------
| 系统基础层（内核、驱动、调度）        |
----------------------------------------

• 早期使用 FA/PA 模型

• HarmonyOS 3 以后使用 Stage 模型（更接近安卓的 Activity/Ability 模式）

---

2.4 搭建鸿蒙开发环境

---

下载与安装 DevEco Studio

鸿蒙使用官方 IDE：

DevEco Studio（类似 Android Studio）

步骤：

1. 官网下载（根据系统选择 Windows / Mac）

2. 安装并启动

3. 登录华为开发者账号

4. 配置 SDK 目录

---

下载 Node.js 与 SDK

• 部分构建工具依赖 Node.js

• DevEco 会提示你安装 HarmonyOS SDK

• 根据需要选择 API 版本（常见为 API 7、API 8、API 9）

---

创建模拟器

在 DevEco 内置的 HVD Manager 中：

1. 选择设备类型（手机/手表/平板）

2. 下载系统镜像

3. 创建模拟器并启动

---

2.5 开发第一个鸿蒙程序

---

1）创建新项目

• 选择 Stage Model

• 选择模板（Empty Ability）

• 填写包名和项目名称

---

2）运行项目

点击 ▶ Run
程序将在：

• 模拟器

• 华为真机（USB）

运行。

---

3）界面代码示例（ArkTS）

@Entry
@Component
struct Index {
  build() {
    Column() {
      Text("Hello HarmonyOS")
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
    }
    .width("100%")
    .height("100%")
    .justifyContent(FlexAlign.Center)
  }
}

类似 Flutter + 前端 JSX 的语法。

---

2.6 鸿蒙应用的程序结构

典型 Stage 模型目录：

entry/
 ├── src/main/
 │    ├── ets/               → 页面代码（ArkTS）
 │    │      ├── entryability
 │    │      └── pages
 │    ├── resources/         → 资源文件
 │    ├── module.json5       → Ability 配置
 │    └── config.json        → 应用配置
 └── build-profile.json

核心能力组件：

目录	作用
pages	UI 页面的代码（ArkTS 编写）
entryability	应用入口 Ability
resources	图片、字符串、本地化等
config.json	应用权限、图标等配置

---

📌 本章总结

技术	关键点
Flutter	Google 跨平台框架，基于 Dart，跨 Android/iOS/Web/桌面
Dart	简单易学，既 JIT 又 AOT，适合 UI 框架
鸿蒙	国产自研操作系统，分布式能力强，多端统一
HarmonyOS 开发	使用 DevEco Studio 和 ArkTS