1. 程式人生 > 資訊 >鴻蒙手機 OS 等開發必備工具,華為 DevEco Studio 2.1 Beta 3 釋出:雙向預覽,Java UI 介面資料模擬 ...

鴻蒙手機 OS 等開發必備工具,華為 DevEco Studio 2.1 Beta 3 釋出:雙向預覽,Java UI 介面資料模擬 ...

4月1日訊息HUAWEI DevEco Studio(以下簡稱 DevEco Studio)是面向華為終端全場景多裝置的一站式整合開發環境(IDE),為開發者提供工程模板建立、開發、編譯、除錯、測試、釋出等 E2E 的 HarmonyOS 應用開發服務。獲悉,通過使用 DevEco Studio,開發者可以更高效的開發具備 HarmonyOS 分散式能力的應用,進而提升創新效率。2021 年 3 月,DevEco Studio 又迎來 2.1 Beta3 版本。

新版本的到來,究竟能給廣大 HarmonyOS 應用開發者帶來哪些不一樣的體驗?下面華為官方帶來新功能介紹。

亮點一:預覽器新增雙向預覽功能

在 HarmonyOS 應用開發過程中,開發者可通過點選 “Previewer”檢視應用的 UI 介面效果。當開發者發現 UI 介面的佈局顯示不符合預期時(eg: 控制元件的寬度不符合設定值、控制元件不顯示等),需要逐一排查 UI 介面中佈局或控制元件的異常。

為了提高排查的效率,DevEco Studio 2.1 Beta3 在已有的 “實時預覽”和 “動態預覽”基礎上,全新解鎖了雙向預覽功能。

  • 實時預覽:只要在佈局檔案中儲存了修改的原始碼,在預覽器中就可以實時檢視佈局效果。

  • 動態預覽:在預覽器介面,可以在預覽器中操作應用的互動動作,如點選事件、跳轉、滑動等,與應用執行在真機裝置上的互動體驗一致。

所謂雙向預覽,即支援程式碼編輯器、預覽器介面(含屬性列表)兩者之間的聯動,便於快速定位控制元件,從而提升解決 UI 介面問題的效率。開發者可以通過在預覽器介面,點選圖示的方式,開啟雙向預覽功能。

具體聯動效果如下:

①通過預覽器介面中的屬性列表,修改屬性或樣式後,程式碼編輯器中的原始碼會同步修改,並實時重新整理預覽器介面;

②同樣的,如果在程式碼編輯器中修改原始碼,將會實時重新整理預覽器介面及屬性列表。

但值得注意的是,若碰到以下情況,則不支援修改其屬性:

hml 佈局程式碼裡使用了資料繫結的屬性;

xml 佈局程式碼裡使用了資源引用的屬性;

UI 介面設定了動畫效果。

溫馨提示:不同的 API Version 版本,預覽器支援的功能略有不同,具體差異如下:

亮點二:預覽器新增 Java UI 介面的資料模擬功能

在預覽場景中,由於程式碼的執行環境與真機裝置上的執行環境不同,呼叫部分介面時無法獲取到有效的返回值。開發者若想根據返回值做出不同的 UI 介面展現,則需手動反覆修改程式碼邏輯,以驗證不同 UI 介面效果。

為了減少修改,DevEco Studio 提供 PreviewMock 資料模擬功能,即在不改變業務執行邏輯的前提下,模擬 API 或者業務程式碼中的各種 method(不包括構造方法)的返回值和物件中的 Field(不包括 final 欄位)的值。這樣開發者就可以在預覽時,檢視到不同返回值帶來的介面變化。

不過值得注意的是,DevEco Studio 2.1 Beta3 當前僅支援 Java UI 介面的 PreviewMock 資料模擬功能。與此同時,要想使用 PreviewMock 資料模擬功能,需先在模組的 build.gradle 中新增相關依賴,並重新同步工程。

(圖:在 build.gradle 中新增 PreviewMock 的依賴)

除了上述的兩大亮點功能,在 Java UI 介面預覽方面,開發者在預覽 Ability 或 AbilitySlice 時,儲存修改後的程式碼,即可做到實時預覽;在 JS UI 介面預覽方面,開發者可直接選擇某一個 page(頁面)進行實時動態預覽。

亮點三:編輯器新增 config.json 視覺化配置功能

作為 HarmonyOS 應用開發的入門選手,你是否為了瞭解配置項的含義,而反覆查閱 HarmonyOS 官網的資料文件?為了減少開發者反覆切換介面查閱資料文件的行為,DevEco Studio 2.1 Beta3 新增了視覺化配置功能。

開發者可通過開啟 config.json 檔案,點選按鈕,開啟設定介面,檢視該專案所需填寫的重要屬性及其含義,完善應用名稱、應用版本號、應用型別、Ability、裝置型別、應用許可權等配置項。

然而,在開發過程中,可能存在配置項層級過多的場景,例如:配置 “Module › Ablilities › Meta Data › Merge Rule › Replace”欄位時,使用者可通過搜尋框快速定位到該屬性,點選 add 按鈕,輸入相關合並規則,觸發系統在 config.json 檔案中自動建立配置項的樹型結構,完成合並規則的配置,節省配置時間。

亮點四:編輯器新增資源建立嚮導功能

開發者在建立帶限定詞的資源目錄時,需考慮限定詞的取值、不同限定詞相互搭配時的先後順序等,稍有偏差則會導致應用在執行時,HarmonyOS 檢測不到合適的資源,無法呈現預期效果。

為了降低開發者在建立帶限定詞的資源目錄時的出錯機率,DevEco Studio 2.1 Beta3 新增了資源建立嚮導功能,使用者根據介面提示進行選擇或輸入,即可完成資源目錄及檔案的建立,無需思索各種限定詞之間的組合關係。

除了上述的兩大亮點功能,DevEco Studio 2.1 Beta3 在編輯器方面,還做了其它優化,具體優化細節如下:

亮點五:新增 Java 測試框架

為了減化繁瑣的人工測試環節,DevEco Studio 2.1 Beta3 新增了 Java 測試框架,提供 Java 程式碼白盒測試能力,幫助開發者高效編寫和執行測試用例,保障應用基礎質量。

在開發階段,開發者可藉助由 Java 測試框架提供的 IAbilityDelegator,進行 APP 元件操控測試(如:啟動 / 關閉 FA、獲取介面 UI 元素、注入 UI 點選事件等),及時發現 UI 互動問題。或使用 JUnit 4 語法正規化,編寫測試用例、呼叫系統介面,獲得 API 返回值或觸發業務流程,根據介面返回值或業務狀態,判斷業務邏輯的正確性。

Java 測試框架在真機或遠端模擬器裝置上執行的前提:

①遠端模擬器需註冊開發者賬號並完成實名認證;

②真機裝置需搭載 HarmonyOS 作業系統,並開啟除錯模式,且有相應的簽名檔案。

亮點六:新增了 5 個手機(Phone)工程模板

DevEco Studio 支援手機 (Phone)、平板 (Tablet)、車機 (Car)、智慧屏 (TV)、智慧穿戴 (Wearable)、輕量級智慧穿戴 (Lite Wearable)和智慧視覺 (Smart Vision)七種裝置的 HarmonyOS 應用開發,支援 Java、JS 和 C/C++ 程式語言。

為了方便開發者的使用,DevEco Studio 提供了多裝置型別、不同開發語言的 Ability 模板。本次的新版本,在原有的基礎上,新增了 5 個手機 (Phone)工程模板,目前手機 (Phone)工程模板共 19 個。開發者們可根據工程嚮導,挑選合適的模板,輕鬆建立適用於各類裝置的工程,並自動生成對應的程式碼和資源模板。

除了以上的六大亮點,DevEco Studio 2.1 Beta3 還能給廣大開發者帶來哪些細節的優化?

在開發者開啟歷史工程時,DevEco Studio 2.1 Beta3 會提示開發者將歷史工程進行升級適配,點選提示中的 “Update”,即可一鍵自動化修改工程中的配置資訊,省去開發者逐一修改相關配置的煩惱。

除此之外,DevEco Studio 2.1 Beta3 還在不少細節上進行了優化。下面請看細節清單:

①升級 IntelliJ IDEA 底座至 IntelliJ IDEA CommunityEdition 2020.2.4 版本(溫馨提示:由於底座升級,開發者需要手工升級不可用的三方外掛,避免出現已安裝的三方外掛不相容情況)

②在除錯階段,開發者可設定 hap 包的安裝方式。若選擇覆蓋安裝,則會保留已安裝應用內的快取資料,無需重灌應用後再重新構建相關資料,方便除錯。

③解決了部分開發者下載 Node.js 緩慢或者失敗的問題。通過整合 Node.js 並預置華為公有云的 npm 倉,進一步縮短搭建 HarmonyOS 應用開發環境的時間。

④已適配支援 macOS11.2.2 版本。

⑤解決了 XML 裡面的 drawable 的資源無法聯想的問題。