鴻蒙HarmonyOS應用開發-Component體系介紹(一)
https://harmonyos.51cto.com/#zz
在HarmonyOS的UI框架中,Component為用戶界面提供基本組件,Component類位于ohos.agp.components包中,直接派生自java.lang.Object,并且是HarmonyOS中所有界面組件的直接或間接父類。每一個組件在屏幕上占用一個矩形區域,在這個區域中對繪制和事件處理做出響應。Conpoment是其他控件的基類,用于創建交互式的各類組件。Component的直接子類ComponentContainer是所有布局的基類,為其他組件或組件組定義布局屬性。下面來看一下Component在HarmonyOS中的繼承體系(橙色邊框類只列出部分子類):

Component的直接子類組件有6個,這6個組件在功能上可劃分為兩類,一類是顯示類交互組件如Text、Image、IindexBar、ProcessBar和PageSliderIndicator,另一類是容器類組件ComponentContainer及其子類,用于容納其他布局或者組件,值得注意一點,ComponentContainer類是一個抽象類,是所有布局或容器組件的父類。為便于理解,下圖展示一個簡易的網站頁面的組成結構:

在上圖中可以看出,最外層Layout1是一個布局組件,用來容納其他種類的組件;頭部是一個Image組件,用來展示圖片,在中間部分的左側是一個列表類的容器組件,用于容納多個Text組件;在中間部分右側又是一個Layout組件,以此類推,最下面的Layout3組件中,容納了兩個Button組件。上面只是一個簡單頁面組成元素的示例,在實際開發過程中,正式編碼之前也要做一個頁面規劃,這樣才能夠在開發中對自己頁面有一個整體的清晰認識。
在了解Component類是什么之后,接下來為大家介紹Component類的內部組成。首先Component類是一個嵌套類(其他組件類也是嵌套類),在Component類內部定義了眾多內部類/接口,除此之外還定義了各種獲取和設置組件屬性信息的方法。
1. Component的內部類/接口
Component的內部類通常是監聽器(大多以Listener結尾),,用于回調從而對界面元素變化做出響應,在Harmony OS中,為組件注冊監聽器由統自動注冊,并且響應事件的回調方法也有操作系統自動調用。其次,這些監聽器主要用于監聽如單擊、雙擊、長按、以界面元素繪制等事件,在這些事件中,編程人員可以在回調方法中自定義事件處理邏輯來對這些事件做出響應。以下代碼片段展示如何為Button設置事件監聽器:
- //為按鈕設置點擊回調:第一種寫法,直接實例化監聽器接口并實現回調方法onClick
- Button button = (Button) findComponentById(ResourceTable.Id_button);
- button.setClickedListener(new Component.ClickedListener() {
- @Override
- public void onClick(Component component) {
- /*
- 開發人員可以自定義事件處理邏輯,如獲取組件、啟動新的bility等
- */
- Text text = (Text) component.findComponentById(ResourceTable.Id_type_text);
- }
- });
- /*
- 為按鈕設置點擊回調:第二種寫法,lambda表達式寫法,前提要知道監聽器中方法的參數列表:如下面的“(component)”的參數個數與監聽器里的方法onClick的參數個數相同即可
- */
- Button button = (Button) findComponentById(ResourceTable.Id_button);
- button.setClickedListener((component) -> {
- /*
- 開發人員可以自定義事件處理邏輯,如獲取組件、啟動新的bility等
- */
- Text text = (Text) component.findComponentById(ResourceTable.Id_type_text);
- });
在上面的代碼片段中,分兩種方式演示了如何獲取組件元素并且設置組件的點擊事件監聽器。
在第一種方式中,通過實例化Component的內部靜態接口ClickedListener來為button設置監聽器,同時開發人員需要實現監聽器的方法onClick來編寫具體業務邏輯代碼。在第二種方式種,使用lambda表達式寫法,setClickedListener的參數為函數,這種寫法相對簡潔,但前提是開發者需要知道組件監聽器的回調方法的參數列表,如button的onClick方法只有一個參數Component,當為其他組件添加監聽器時,同樣推薦使用lambda的方式,為加強理解,下面再以ListContainer為例,為ListContainer的列表元素添加點擊事件:
- ListContainer newsListContainer = findComponentById(ResourceTable.Id_news_container);
- newsListContainer.setItemClickedListener((listContainer, component, i, l) -> {
- /*
- 開發人員可以自定義事件處理邏輯,如獲取組件、啟動新的bility等
- */
- Text text = (Text) component.findComponentById(ResourceTable.Id_type_text);
- });
在上述的代碼片段中,setItemClickedListener同樣使用lambda表達式設置監聽器,而如果使用普通方式,則如下代碼片段,需要實例化ListContainer.ItemClickedListener接口并且實現onItemClicked方法:
- ewsListContainer.setItemClickedListener(new ListContainer.ItemClickedListener() {
- @Override
- public void onItemClicked(ListContainer listContainer, Component component, int i, long l) {
- /*
- 開發人員可以自定義事件處理邏輯,如獲取組件、啟動新的bility等
- */
- Text text = (Text) component.findComponentById(ResourceTable.Id_type_text);
- }
- });
細心的朋友可能會發現,在獲取Button組件時直接使用findComponentById方法,而獲取Text組件時是使用component.findComponentById方法,這兩種方式由何不同呢?其實在Component類中,定義了獲取指定組件的方法findComponentById;而在Ability類中也聲明了獲取組件的方法findComponentById,只不過Ability的findComponentById方法內部依然通過調用Component類中的findComponentById來獲取組件。知道這兩種獲取組件的方法后,可以根據實際需要選擇合適的方式來獲取組件信息。
2. Component方法簡介
在Component類中定義了幾十種方法用于設置和獲取組件信息,方便開發人員創造自己應用,這些方法大體可歸納如下幾類,處于篇幅原因不一一列舉:
1)設置和獲取組件布局信息,如位置、邊距等
(1) public int getBottom();Obtains the bottom edge position of a component relative to the parent layout.
(2) public int[] getMargins();Obtains the left, top, right, and bottom margins of this component.
(3) public int[] public int getPaddingLeft();Obtains the left padding of the component.
2)設置和獲取組件繪制屬性信息,如大小尺寸、邊角樣式、可見性等
(1) public int getHeight();獲取組件高度.
(2) public void setFocusBorderRadius(float[] radii);設置獲得焦點的邊框圓角
(3) public void setVisibility(int visibility);設置組件的可見性.
3)設置和獲取組件狀態信息,如焦點、是否可點擊、是否可用等
(1) public int getFocusable();獲取組件是否可以獲得焦點
(2) public void setClickable(boolean clickable);設置組件是否可以點擊.
(3) public void setEnabled(boolean enabled);設置組件是否可用
4)設值組件監聽器以及上下文等信息
(1) public void setClickedListener(Component.ClickedListener listener);給組件設置點擊事件監聽器
(2) public Context getContext();獲取由當前組件持有的上下文信息
二、總結
在HarmonyOS應用開發過程中,對組件的繼承體系以及組件所具有的能力有一個整體認知是十分必要的,這樣在開發過程中可以做到心中有數,在學會一個組件的使用方式之后,也會順其自然的學會其他組件的使用,從而不必受到眾多組件的特性所困擾。在未來幾期文章中,會注意對Component的直接子類組件進行講解。出于個人水平有限,如文章知識點有錯誤或不當之處,歡迎各位小伙伴積極指正并深入交流。微信公眾號:架構派
https://harmonyos.51cto.com/#zz