# harmonyOS_learn1

**Repository Path**: li_2433/harmony-os_learn1

## Basic Information

- **Project Name**: harmonyOS_learn1
- **Description**: 该仓库记录学习鸿蒙开发中遇到的知识点、笔记，助于理解、学习，学不会鸿蒙就搬砖！
- **Primary Language**: TypeScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-09-12
- **Last Updated**: 2025-09-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# harmonyOS_learn1

#### 介绍
该仓库记录学习鸿蒙开发中遇到的知识点、笔记，助于理解、学习，学不会鸿蒙就搬砖！

#### 软件架构
根据学习的进度完成HarmonyOS介绍、DevEco Studio的使用、ArkTS语法介绍、应用程序框架基础、从简单的页面开始、构建更加丰富的页面、从网络获取数据、保存应用数据等8个基础板块的学习。


#### 一：HarmonyOS介绍

1.  当前移动应用开发中遇到的主要挑战包括：


- 针对不同设备上的不同操作系统，重复开发，维护多套版本。
- 多种语言栈，对人员技能要求高。
- 多种开发框架，不同的编程范式。
- 命令式编程，需关注细节，变更频繁，维护成本高。

2.  新的应用生态应该具备如下特征：


- 单一设备延伸到多设备：应用一次开发就能在多个设备上运行，软件实体能够从单一设备转移到其他设备上，且多个设备间能够协同运行，给消费者提供全新的分布式体验。
- 厚重应用模式到轻量化服务模式：提供轻量化的服务，最小化资源消耗，一步直达，快速完成消费者特定场景的任务。
- 集中化分发到AI加持下的智慧分发：为消费者提供智慧场景服务，实现“服务找人”。
- 纯软件到软硬芯协同的AI能力：提供软硬芯协同优化的AI能力，全面满足应用高性能诉求。

3.  三大理念：

- 一次开发，多端部署
- 可分可合，自由流转
- 统一生态，原生智能


#### 二：DevEco Studio的使用

1.  编辑器的使用(常见快捷键和操作)：

- Alt+7打开代码树
- 两次shift打开代码文件查找器
- 输入/**后回车，快速生成函数声明
- 无需格式化代码块前//@formatter:off，代码块后//@formatter:on
- 接口代码上悬浮可快捷查询api文档
- Ctrl+alt+o 快速清除未使用import
- 未导入模块可直接悬浮在模块名上点击导入完成自动导入
- 代码重构，选择对应的组件，右键refactor>Extract Method进行代码的重构
- 快速覆写父类，通过右侧菜单进行覆写，单击Generate...，选择Override Methods，快捷键：Ctrl+O
- 快速生成构造器，右侧菜单选择Generate...，在弹窗中选择Constructor，快捷键：Alt+Insert
- 快速生成get/set方法，右键选择Generate...>Getter and Setter，快捷键Alt+Insert
- 快速生成声明信息到Index文件，在HSP或HAR模块内的文件编辑界面，单击右键选择Generate...>Declarations，或者使用快捷键Alt+Insert

2.  配置代码检查规则：
- [跳转至对应章节内容](https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101717494752698457?isFrom=studyRecord)

3.  预览器的使用：
- Arkts/js编译的代码会实时进行刷新
- ArkUI删除或者添加新的UI组件时需要进行ctrl+s保存后，进行刷新
- 启动预览器：菜单栏，单击View > Tool Windows > Previewer，编辑窗口右上角的侧边工具栏，单击Previewer

- ArkUI页面浏览需要在工程的ets文件头部添加@Entry实现
- 组件预览支持实时预览，不支持动态图和动态预览。组件前添加注解@Preview实现，单个文件最多10个。参考：

```
@Preview({
  title: 'ContentTable'
})
@Component
struct ContentTablePreview {
  build() {
    Flex() {
      ContentTable({ foodItem: getDefaultFoodData() })
    }
  }
}
```
@Preview具有参数：

```
@Preview({
  title: 'Component1',  //预览组件的名称
  deviceType: 'phone',  //指定当前组件预览渲染的设备类型，默认为Phone
  width: 1080,  //预览设备的宽度，单位：px
  height: 2340,  //预览设备的长度，单位：px
  colorMode: 'light',  //显示的亮暗模式，当前支持取值为light
  dpi: 480,  //预览设备的屏幕DPI值
  locale: 'zh_CN',  //预览设备的语言，如zh_CN、en_US等
  orientation: 'portrait',  //预览设备的横竖屏状态，取值为portrait或landscape
  roundScreen: false  //设备的屏幕形状是否为圆形
})
```

- Profile自定义：打开右上角四个小方块按钮，然后点击+ New Profile按钮，添加自定义设备
- 在Previewer窗口中，打开Profile Manager中的Multi-profile preview开关
- 通过右上角双t按钮，打开双向预览

- 模拟器状态下。调用部分接口时无法获取到有效的返回值。此时鸿蒙提供了Hamock，Hamock使用需要有以下限制：
1. 需要在工程或模块的oh-package.json5

```
"devDependencies": {
    "@ohos/hamock": "1.0.0"
}
```
2. Hamock提供了@MockSetup用于修饰Mock方法，在组件初始化时执行被@MockSetup修饰的方法。
首先引入

```
import { MockKit, when, MockSetup } from '@ohos/hamock';
```
在目标组件中定义一个方法，并用@MockSetup修饰该方法。在这个方法中，使用MockKit模拟目标方法。简单说就是函数级mock。注意，非组件当前属性无法使用函数级mock方式，只能使用模块/代理函数实现mock数据（比如电量信息）

```
import { MockKit, when, MockSetup } from '@ohos/hamock';

@Entry
@Component
struct Index {
 ...
 @MockSetup
 randomName() {
  let mocker: MockKit = new MockKit();
  let mockfunc: Object = mocker.mockFunc(this, this.method1);
  // mock 指定的方法在指定入参的返回值
  when(mockfunc)('test').afterReturn(1);
 }
 ...
 // 业务场景调用方法
 const result = this.method1('test'); // in previewer, result = 1
}
```

接下来是利用模块替换的mock效果：
首先在src/mock目录下新建一个ArkTS文件，在这个文件内定义目标模块的Mock实现。

```
// src/mock/MeasureText.mock.ets
import MeasureText from '@ohos.measure'

// 类的mock使用继承(extends)的方式实现
class MockMeasureText extends MeasureText {
  // 定义mock实现
  static measureText(): number {
    console.log('Return value of the mock measureText function')
    return 100;
  }
};

export default MockMeasureText;
```
暴露对应的新类后，在Mock配置文件src/mock/mock-config.json5中定义目标模块与Mock实现的替换关系。

```
{
  "@ohos.measure": { // 待替换的moduleName
    "source": "src/mock/MeasureText.mock.ets" // Mock代码的路径，相对于模块根目录
  },
 ...
}
```
最后是在原调用处中添加Hilog日志，方便在预览时，在Log中打印获取返回值，从而验证Mock是否生效。

```
hilog.debug(DomainNumber, logTag, 'Mock %{public}s', `${MeasureText.measureText({textContent: 'Hello World'})}`)
```
[支持使用预览器的api清单](https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101717494752698457?isFrom=studyRecord)

3.  模拟器和真机调试：
首先创建模拟器>点击菜单栏的Tools > Device Manager，点击右下角的Edit设置模拟器实例的存储路径Local Emulator Location，Windows默认存储在C:\Users\xxx\AppData\Local\Huawei\Emulator\deployed下。
在Local Emulator页签中，单击右下角的New Emulator按钮，创建一个模拟器。
在模拟器配置界面，可以选择一个默认的设备模板，首次使用时请点击设备右侧的下载模拟器镜像，您也可以在该界面更新或删除不同设备的模拟器镜像。单击Edit可以设置镜像文件的存储路径。Windows默认存储在C:\Users\xxx\AppData\Local\Huawei\Sdk下。单击Next，设置设备相关的参数。
创建完成后>在设备管理器页面，单击启动模拟器。

注意：每次更新后都会上传对应的用户数据，如果想清除上一次运行时的用户数据，点击Actions >  > Wipe User Data。在模拟器运行期间，可以点击Actions >  > Show on Disk显示模拟器在本地生成的用户数据。点击Actions >  > Generate logs可以生成模拟器自启动到此刻的所有日志信息。

模拟器运行时，可以通过鼠标模拟手指操作，按住crtl可进行放大缩小，[参考模拟操作链接](https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101717494752698457?isFrom=studyRecord)

关于工具栏：工具栏上集成了模拟器的各种调试工具和控制选项，其中的扩展菜单栏包含了更加丰富的扩展功能。注意，部分工具栏按键需要在模拟器开机亮屏后才能使用。

安装应用程序包和上传文件：
您可以将本地的HAP包安装到模拟器上，只需要将本地的HAP包拖动到屏幕上即可进行安装，支持一次性拖拽安装多个HAP包。模拟器也支持安装包含HSP文件的应用，只需要将HSP和HAP一起拖动到屏幕上即可进行安装。也可以在命令行窗口进入DevEco Studio安装目录的sdk\default\openharmony\toolchains目录下，使用hdc app install命令安装包。安装完成后，可在应用列表里查看已安装的应用。
同时模拟器也支持上传，对应目录为：虚拟设备的/storage/media/100/local/files/Docs/Download/，此外，您也可以在命令行窗口进入DevEco Studio安装目录的sdk\default\openharmony\toolchains目录下，使用hdc file send命令上传文件。

扩展功能介绍：
电池：可通过模拟器模拟电量、状态，在应用中，您可以通过@ohos.batteryInfo模块查询模拟器的剩余电量以及充电状态。


#### 三：ArkTS语法介绍

#### 参与贡献

1.  Fork 本仓库
2.  新建 Feat_xxx 分支
3.  提交代码
4.  新建 Pull Request


#### 特技

1.  使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
2.  Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
3.  你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
4.  [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
5.  Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
6.  Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)