天天看點

OpenHarmony SystemUI開發記錄

作者:51CTO

作者:wx642688109bcee

最近學習 OpenHarmony 應用開發, SDK 版本是 3.2.9.2 Beta4,IDE 版本是 3.1.0.200。

OpenHarmony SystemUI開發記錄

參考官方文檔,做了個 Demo 應用,調試、運作非常順利。啟動應用後,狀态欄和導航欄占用的高度過高,顯得很奇怪,嘗試修改一下系統應用。

摸石頭過河

因為沒做過移動端開發,最初以為狀态欄和導航欄是由 Launcher 控制的。

https://gitee.com/openharmony/applications_app_samples/tree/master/ability/Launcher           

從示例中找了個 launcher,按照文檔進行編譯,放在裝置上怎麼也起不來,Google 查了半天,最後發現該版本中文檔描述不全,參考最新版本文檔進行編譯,運作成功。

有了經驗之後,使用系統 Launcher 進行編譯,報了一堆錯誤。

https://gitee.com/openharmony/applications_launcher           

哪裡報錯改哪裡,修改完之後編譯成功,因為是系統應用,不能使用自動簽名。根據官方提供的簽名方式進行簽名,放到裝置中無法顯示應用中心和 Dock。

看了系統 Launcher 代碼,感覺狀态欄和導航欄并不是由 Launcher 控制的,又下載下傳了系統 SystemUI 代碼,編譯時也有幾個報錯,不知道怎麼解決。

後來發現下載下傳的代碼不對,應該從分支中選擇版本,從标簽中選擇的版本代碼可能不全或者有問題。

編譯安裝踩坑

替換系統應用方法:

// 擷取系統目錄讀寫權限
hdc shell "mount -o remount,rw /"
// 拷貝應用到SystemUI目錄
hdc file send phone_statusbar-phone_entry-default-signed.hap /system/app/com.ohos.systemui/SystemUI-StatusBar.hap
// 應用放在/data目錄下,删除/data目錄下的所有檔案,系統會重新安裝系統應用。
hdc shell "rm -rf /data/*"
// 重新開機裝置
hdc shell reboot           

①系統應用簽名

環境:SDK:Beta4,代碼:Beta4

現象:系統應用無法使用自動簽名。

解決方案:參考​系統應用簽名​​​,我使用的是标準簽名。

下載下傳 material 檔案夾、OpenHarmony.p12 檔案、OpenHarmonyApplication.pem 檔案,放在 signature 目錄下,修改項目中的 build-profile.json5 檔案,添加以下資訊,重新編譯即可。

"products": [
      {
        "name": "default",
        "signingConfig": "default"
      }
    ],
    "signingConfigs": [{
      "name": "default",
      "material": {
        "storePassword": "00000016D9DCF063F0FC4BBD0E7FE1E3B06A67C07BECE1BDD4E2A3EFDAE20F890810EC02AA2A",
        "certpath": "signature/OpenHarmonyApplication.pem",
        "keyAlias": "OpenHarmony Application Release",
        "keyPassword": "00000016FD3897FD4C46940ED39FFC652872B7B18BEDCCA07400A6EBEE307C9C41B96DB6B64D",
        "profile": "signature/systemui.p7b",
        "signAlg": "SHA256withECDSA",
        "storeFile": "signature/OpenHarmony.p12"
      }
    }]           

②SystemUI 編譯報錯(SDK 問題)

環境:SDK:Beta4,代碼:Beta4

現象:編譯報錯

資訊如下:

> hvigor ERROR: Failed :phone_statusbar:default@CompileArkTS... 
> hvigor ERROR: Tools execution failed.
 ArkTS:ERROR File: /xxx/applications_systemui-OpenHarmony-3.2-Beta4/features/batterycomponent/src/main/ets/default/batteryModel.ts:16:25
 Cannot find module '@ohos.batteryinfo' or its corresponding type declarations.
 Module not found: Error: Can't resolve 'bundle/extensionAbilityInfo' in '/xxx/applications_systemui-OpenHarmony-3.2-Beta4/common/src/main/ets/plugindatasource'
 Module not found: Error: Can't resolve 'bundle/extensionAbilityInfo' in '/xxx/applications_systemui-OpenHarmony-3.2-Beta4/common/src/main/ets/plugindatasource/common'
 Module not found: Error: Can't resolve 'bundle/metadata' in '/xxx/applications_systemui-OpenHarmony-3.2-Beta4/common/src/main/ets/plugindatasource/common'           

排查:檢視 API 發現 bundle 目錄下沒有 extensionAbilityInfo 和 metadata 檔案,而 bundleManager 中有這兩個檔案。

解決方案:在報錯的地方将 bundle/extensionAbilityInfo 改為 bundleManager/extensionAbilityInfo,bundle/metadata 改為 bundleManager/metadata,編譯通過。

環境:SDK:Beta2,代碼:Beta4

現象:編譯報錯

資訊如下:

> hvigor ERROR: Failed :pc_statusbar:default@CompileArkTS... 
> hvigor ERROR: Tools execution failed.
 ETS:ERROR File: /xxx/applications_systemui-OpenHarmony-3.2-Beta4/features/batterycomponent/src/main/ets/default/batteryModel.ts:16:25
 Cannot find module '@ohos.batteryInfo' or its corresponding type declarations.           

排查:api 中 info 的 i 為小寫,而檔案中導入包的時候是大寫 I。

OpenHarmony SystemUI開發記錄

解決方案:将 batteryModel.ts 檔案中大寫I改為小寫 i,即可編譯成功。

如下:

import BatteryInfo from "@ohos.batteryinfo";           

③SystemUI 應用安裝失敗​

環境:SDK:Beta4,代碼:Beta4

現象:替換狀态欄應用後,狀态欄消失

排查:使用 bm 指令手動安裝應用報錯

手動安裝應用
bm install -p /system/app/com.ohos.systemui/SystemUI-Status.hap -u 0
// 報錯資訊
error: failed to install bundle.
error: install releaseType not same           

報錯資訊意思是裝置中 SystemUI 中 SDK 版本與我自己編譯的 SystemUI SDK 版本不一緻。

檢視一下裝置中 SystemUI 的 SDK 版本:

hdc shell cat /data/app/el1/bundle/public/com.ohos.systemui/phone_statusbar/module.json           
OpenHarmony SystemUI開發記錄

解決方案:系統中使用的是 SDK Beta2,而我編譯使用的是 SDK Beta4,是以需要将 SDK 切換到 Beta2 版本。

Beta2 編譯 Beta4 版本代碼也會有問題,參考:SystemUI 編譯報錯(SDK 問題))。

④安裝導航欄後狀态欄消失​

環境:SDK:Beta4,代碼:Beta2

現象:單獨安裝狀态欄正常,安裝導航欄後狀态欄消失

排查:檢視狀态欄日志,發現有很多日志沒有打出來,追蹤了一下,定位到 features/statusbarcomponent/src/main/ets/com/ohos/common/StatusBarConfiguration.ts 檔案中,發現卡在這裡:

OpenHarmony SystemUI開發記錄

status_bar_size_landscape 搜尋一下這個字段,發現 base/element/string.json 檔案中存在該字段,zh_CN/element/string.json 檔案中不存在該字段。

zh_CN/element/string.json 添加字段後狀态欄正常顯示,是什麼原因不清楚。

解決方案:product/phone/statusbar/src/main/resources/zh_CN/element/string.json 檔案中添加以下内容:

{
      "name": "status_bar_size_portrait",
      "value": "16"
    },
    {
      "name": "status_bar_size_landscape",
      "value": "16"
    },
    {
      "name": "phone_status_bar_size_portrait",
      "value": "16"
    },
    {
      "name": "phone_status_bar_size_landscape",
      "value": "16"
    },           

定制化開發

經過摸索,狀态欄和導航欄布局在視窗管理中控制,可以修改子產品下的 ServiceExtAbility.ts 檔案來自定義實作。

也可以修改配置檔案 resources/zh_CN/element/string.json 中的以下字段,來控制狀态欄和導航欄的高度(這裡高度不能加機關,按照官網文檔的說法預設使用的 VP 機關)。

{
      "name": "nav_bar_size_portrait",
      "value": "26"
    },
    {
      "name": "nav_bar_size_landscape",
      "value": "26"
    },
    {
      "name": "status_bar_size_portrait",
      "value": "16"
    },
    {
      "name": "status_bar_size_landscape",
      "value": "16"
    },           

總結

做普通應用 Demo 上手容易,ArkTS 做頁面布局友善,使用元件點點點即可得到想要的樣式。

​因為使用的是 Beta 版本,修改 SystemUI 過程中遇到很多坑,比如編譯報錯,應用安裝失敗,應用消失等問題。

在 Google 上基本搜不出來解決方案,隻能在官方文檔、51CTO 社群、華為開發者聯盟上搜尋、提問來解決。

​像是安裝導航欄後狀态欄消失問題,解決起來很容易,但是尋找解決方法要花很長時間,這也是寫這篇文章的原因。

希望可以幫助開發者解決問題,同時也希望 OpenHarmony 社群能夠建立起來,為開發者答疑解惑。