OpenHarmony Docs開發入門
前言
不管是作為軟件開發的愛好者還是已經從事軟件開發這個行業的從業者，對于接觸一種全新的系統 OpenHarmony。學習OpenHarmony，需要清楚OpenHarmony這個系統是什么，能干什么，今日分享從設備開發和應用開發兩個方向學習OpenHarmony/docs文檔。
一、設備開發介紹
1、環境搭建與源碼獲取
- 環境搭建
搭建OpenHarmony 的系統環境，需要Windows系統與Ubuntu系統結合使用。
Windows系統負責燒錄、測試、與OpenHarmony在windows系統cmd模式下交互。
Ubuntu系統負責源碼管理、閱讀、開發、編譯。Ubuntu系統，通過在Windows系統安裝虛擬機，配置初始化虛擬機（內存推薦16GB及以上、CPU推薦4核及以上），虛擬機運行安裝Ubuntu系統。
詳細請參考：??搭建輕量與小型系統環境??
- 源碼獲取
Ubuntu環境下，更新軟件源命令sudo apt-get update。通過sudo apt_get install git git-lfs，安裝git客戶端與git-lfs，命令 git --version 查看git是否成功。 配置git客戶端 。
安裝碼云repo工具，通過mkdir命令，在固定目錄下創建存放repo的文件目錄。通過命令 curl https://gitee.com/oschina/repo/raw/fork_flow/repo-py3 -o 目錄，獲取到repo工具。安裝配置完成之后，通過一下命令步驟進行OpenHarmony源碼獲取 。
詳細請參考：??源碼獲取??
2、HarmonyOs源碼編譯
- 編譯環境搭建
Ubuntu環境下，編譯OpenHarmony源碼之前，必須進行編譯環境搭建。通過apt_get和pip3 install命令安裝配置編譯環境。通過 apt-get update -y 更新軟件源。更新成功之后，通過apt-get命令進行OpenHarmony源碼編譯之前安裝配置。
詳情請參考：??環境配置??
- 編譯命令
成功配置編譯環境，Ubuntu環境下，打開CMD命令行窗口，通過cd命令進入HarmonyOs目錄下，目錄結構如下。
OpenHarmony源碼根目錄下，通過執行命令 bash build/prebuilts_download.sh 腳本進行預編譯，安裝編譯器及二進制工具，成功提示。
接著執行命令 ./build.sh system_size=standard product_name=harmonyos 編譯OpenHarmony源碼。./build.sh 同時也支持其他多種參數。
--source-root-dir=SOURCE_ROOT_DIR # 指定路徑
--product-name=PRODUCT_NAME # 指定產品名
--device-name=DEVICE_NAME # 指定裝置名稱
--target-os=TARGET_OS # 指定操作系統
-T BUILD_TARGET, --build-target=BUILD_TARGET # 指定編譯目標，可以指定多個
OpenHarmony源碼編譯成功，OpenHarmony源碼根目錄下 out/harmonyos/packages/phone/images， Ubuntu環境的終端顯示。
詳情請參考：??編譯構建??
- 編譯出錯
編譯OpenHarmony源碼的過程中，可能出現各類問題。以下枚舉一些異常情況。
解決方法，通過執行命令 sudo apt install openjdk-11.0.16 修復這個問題。
解決方法，通過執行命令 sudo apt install libtinfo5 修復這個問題。
其它遇到的問題請參考：??常見編譯問題和解決方法??
3、OpenHarmony燒錄簡介
Ubuntu環境下，編譯OpenHarmony源碼成功，OpenHarmony鏡像文件存放的路徑，OpenHarmony源碼存放路徑/out/harmony/packages/phone/images。Windows環境下使用燒錄工具瑞芯微開發工具 v2.84（RKDevTool.exe），燒錄OpenHarmony文件到開發版3568。
windows環境下，使用瑞芯微開發工具之前需要安裝瑞芯微驅動，打開瑞芯微開發工具，同時通電開發板，插入USB。燒錄工具會顯示發現一個MASKROM設備。開發板MASKROM模式無法成功燒錄系統。開發板需要進入LOADER模式才能成功燒錄OpenHarmony系統。如何進入LOADER模式？需要先通過一個牙簽按住3568開關，再進行通電，通電之后繼續按住3568開關。
燒錄工具頁面會顯示發現一個LOADER設備，放開按住3568的開關。
瑞芯微開發工具里面選擇編譯成功后生成的OpenHarmony鏡像，每一個鏡像文件順序都不能有任何的顛倒。一旦選擇鏡像文件出現顛倒，燒錄的時候很大概率會將3568開發板直接燒壞，導致3568開發板無法使用。正確選擇OpenHarmony鏡像文件，執行3568開發板燒錄。燒錄工具會提示燒錄是否成功。
4、OpenHarmony測試用例
OpenHarmony為開發者提供了一套全面的自測試框架，開發者可根據測試需求開發相關測試用例。同時開發者也能開發單獨測試函數功能的可執行程序。
window模塊功能，創建一個cpp文件，內部編寫main函數。main函數編寫業務邏輯流程。測試用例在源碼路徑（foundation/windowmanager/snapshot）。
編寫BUILD.gn增加編譯配置。
cpp目錄上層目錄下，bundle.json文件增加需要編譯的模塊。
執行如下命令：
./build.sh system_size=standard product_name=harmonyos
生成 snapshot_display，存放目錄 out/harmonyos/window/window_manager。
在 snapshot_display 目錄下，執行如下命令：
hdc file send snapshot_display /system/bin
推送開發板 /system/bin目錄。
出現異常提示 [Fail]Error opening file: read-only file system, path:/system/bin/snapshot_display，權限不夠。執行命令：
hdc shell mount -o remount,rw /
解決權限問題。
設置執行權限 ，執行命令：
hdc shell chmod a+x /system/bin/snapshot_display
執行推送到開發板程序snapshot_display。
文件存放開發板的實際路徑。
更多測試信息請參考：??測試子系統??
5、OpenHarmony源碼閱讀
推薦使用??DevEco Studio??項目管理工具管理OpenHarmony源碼，學習OpenHarmony項目工程的整體目錄結構及進行代碼閱讀，其他項目管理工具請自行選擇適合的個人學習的工具。
二、應用開發介紹
1、項目說明
通過OpenHarmony提供的Stage模型和ArkUI的eTS聲明式開發規范，結合簡單的Demo，分享學習OpenHarmony/docs/application-dev（??應用開發文檔??）。
2、主要功能
- 目錄標題展示，目錄列表展示
- 點擊目錄列表，查看列表內容
- 點擊目錄標題的返回箭頭，返回之前的內容
- 頁面內容溢出，可上下滑動查看內容
3、效果展示
4、開發環境搭建
首先需要搭建好開發環境。
參閱應用開發文檔—??工具??：
- 下載??HUAWEI DevEco Studio For OpenHarmony??（簡稱DevEco Studio）
- ??配置開發環境??
5、創建項目
搭建開發環境后，創建項目，了解項目結構。
參閱應用開發文檔—??快速開始??：
- 掌握OpenHarmony應用的一些基本概念：
UI框架的簡單說明（方舟開發框架（ArkUI框架））
——類Web開發范式（JS）
——聲明式開發范式（eTS）
Ability的基本概念（應用所具備能力的抽象）
——FA模型
——Stage模型
- 應用包結構：FA模型結構、Stage模型結構。
項目的目錄結構：
- AppScope > app.json5：應用的全局配置信息。
- entry：OpenHarmony工程模塊，編譯構建生成一個??HAP??包。
- src > main > ets：用于存放ets源碼。
- src > main > ets > Application > AbilityStage.ts：實現AbilityStage接口。
- src > main > ets > MainAbility：應用/服務的入口。
- src > main > ets > MainAbility > MainAbility.ts：承載Ability生命周期。
- src > main > ets > pages：MainAbility包含的頁面。
- src > main > resources：用于存放應用/服務所用到的資源文件，如圖形、多媒體、字符串、布局文件等。關于資源文件，詳見??資源文件的分類??。
- src > main > module.json5：模塊配置文件。主要包含HAP包的配置信息、應用/服務在具體設備上的配置信息以及應用/服務的全局配置信息。具體的配置文件說明，詳見??應用包結構配置文件的說明（Stage模型）??。
- build-profile.json5：當前的模塊信息 、編譯信息配置項，包括buildOption、targets配置等。
- hvigorfile.js：模塊級編譯構建任務腳本，開發者可以自定義相關任務和代碼實現。
- build-profile.json5：應用級配置信息，包括簽名、產品配置等。
- hvigorfile.js：應用級編譯構建任務腳本。
6、編寫應用
本文所編寫的應用是特別基礎的內容，所以在接下來的內容更主要是對開發的步驟的說明：
- 參閱應用開發文檔—開發—??UI開發??。
- 參閱應用開發文檔—API參考—??組件參考（基于TS擴展的聲明式開發范式）??。
（1）定義組件結構
創建好項目后，開始編寫自定義組件，引入需要的文件，定義需要使用的變量，再添加上組件會使用到的生命周期函數和build方法。
// 引用需要的組件和API
import TitleBar from './components/titleBar'
import router from '@ohos.router';
// @Entry裝飾的自定義組件用作頁面的默認入口組件，加載頁面時，將首先創建并呈現@Entry裝飾的自定義組件。
@Entry
// @Component裝飾的struct表示該結構體具有組件化能力，能夠成為一個獨立的組件，這種類型的組件也稱為自定義組件
@Component
struct Index {
// @State裝飾的變量是組件內部的狀態數據，當這些狀態數據被修改時，將會調用所在組件的build方法進行UI刷新
@State title: string = 'UI組件'
@State isShowReturn: boolean = false
items: Array<Item> = []
// 函數在創建自定義組件的新實例后，在執行其build函數之前執行。允許在aboutToAppear函數中改變狀態變量，更改將在后續執行build函數中生效。
aboutToAppear() {
}
// build方法里描述UI結構
build() {
}
}
（2）繪制組件UI
組件結構編寫完成，根據需求開始繪制組件UI界面。
build() {
// Columns沿垂直方向布局的容器
Column() {
// 引入的自定義組件
TitleBar({ title: this.title, isShowReturn: this.isShowReturn })
// List包含一系列相同寬度的列表項。適合連續、多行呈現同類數據
List() {
// ForEach渲染控制語法,循環渲染
ForEach(this.items, (each) => {
ListItem() {
Row() {
// 基礎文本組件，顯示一段文本的組件
Text(each.name)
.fontSize(20)
// 基礎圖片組件，支持本地圖片和網絡圖片的渲染展示
Image($r('app.media.arrow'))
.padding(8)
.width(40)
}
.width('100%')
.justifyContent(FlexAlign.SpaceBetween)
.padding(10)
}
// 綁定通用點擊事件
.onClick(() => {
})
})
}
}
// 設置通用屬性，寬(width)高(height)
.width('100%')
.height('100%')
}
（3）添加交互邏輯
界面UI繪制完善后，接下來使用自定義組件的生命周期aboutToAppear回調函數，編寫界面數據初始化的邏輯，并把界面上的交互邏輯編寫完整。
// 編寫界面數據初始化的邏輯，aboutToAppear函數在創建自定義組件的新實例后，在執行其build函數之前執行
aboutToAppear() {
let routerParams = router.getParams();
// 條件判斷： routerParams==undefined為一級目錄界面
if (routerParams == undefined) {
// 條件判斷： routerParams!==undefined則為二級目錄界面
} else {
}
}
build(){
Row() {
}
// 編寫點擊事件的邏輯
.onClick(() => {
// 條件判斷： each.children === undefined，點擊的目錄列表無子目錄
if (each.children === undefined) {
router.push({
url: each.path,
params: {
title: each.name
}
})
// 條件判斷： each.children === undefined，點擊的目錄列表有子目錄
} else {
router.push({
url: each.path,
params: {
title: each.name,
items: each.children
}
})
}
})
}
（4）測試效果
完成應用編寫后，利用DevEco Studio 的Previewer提供的預覽效果，測試應用的運行效果是否符合預期效果。
7、項目復盤
在編寫OpenHarmony應用的過程中，踩了一些坑，總結下來有如下幾點：
- 對eTS聲明式范式開發自定義組件生疏，編寫應用的時候，梳理清楚邏輯后，難以順暢的編寫成代碼。
- DevEco Studio 的Previewer可能會因為緩存造成預覽效果出錯。
例如：新增了一個自定義組件，并同時設置了點擊跳轉到新增自定義組件的事件，但在Previewer中點擊后，無響應。
解決方案：
- 在gitee上搜索OpenHarmony應用，可檢索到許多開發者上傳的OpenHarmony應用，下載源碼，模仿代碼編寫，
同時查看文檔，保證理解每一行代碼。 - 檢測代碼是否編寫正確，如果代碼正確，則通過DevEco Studio的Build下的Clean Project清理緩存。
Clean Project示意圖：
項目源碼
https://gitee.com/chucheng42/simple-project。
其他
- third-party-components
第三方庫文件存放目錄。該目錄統一管理第三方庫的文件，例如：頭文件（.h），實現文件（.cpp），庫鏈接文件（.so）等。針對不同的第三方庫功能創建同名文件夾來實現單獨庫功能的管理。OpenHarmony如何將引入的第三方庫，融合，編譯，鏈接。
總結
- OpenHarmony設備開發，保持了C++面向對象的特性及語言的特點：
1. 面向對象三大原則（封裝、繼承、多態）。
2. C++語言API（智能指針、lambda、類型推導等）。
熟悉OpenHarmony設備開發的整體邏輯和C++語言后，了解進程間的通信技術，遠程調用等技術，可以更容易的上手OpenHarmony的設備開發。
- OpenHarmony應用開發，雖然和前端開發在寫法上有了相當大的變化，前端是運用（HTML CSS JS），但仍舊有同樣的三個過程:
1. 搭建頁面結構
2. 繪制頁面樣式
3. 添加事件交互
明白程序開發的流程后，在熟悉OpenHarmony應用開發的語法和本地API后，能在較短的時間內掌握OpenHarmony的應用開發。
