[[358638]]

想了解更多內(nèi)容，請(qǐng)?jiān)L問：

51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)

https://harmonyos.51cto.com/#zz

通過前面的學(xué)習(xí)：快速入門一個(gè)hello world程序和編寫一個(gè)簡(jiǎn)單的交互程序，我們已經(jīng)基本了解鴻蒙應(yīng)用開發(fā)的基本流程，這一篇，我們來細(xì)化學(xué)習(xí)下鴻蒙的UI框架(基于JAVA)。

(一)Ability

在開始之前，我們先來了解一個(gè)基礎(chǔ)概念：Ability

Ability從英文的字面上理解是“能力”的意思，同樣在鴻蒙的架構(gòu)體系里，官方的釋意：Ability表示應(yīng)用程序所具備能力的抽象，是應(yīng)用程序的重要組成部分。一個(gè)應(yīng)用可以具備多種能力(即可以包含多個(gè) Ability)，HarmonyOS 支持應(yīng)用以 Ability 為單位進(jìn)行部 署。Ability 可以分為 FA(Feature Ability)和 PA(Particle Ability)兩種類型，每種類 型為開發(fā)者提供了不同的模板，以便實(shí)現(xiàn)不同的業(yè)務(wù)功能。

Ability支持三種模版：

PageAbility : 頁面模版，用于提供與用戶交互的能力。這個(gè)也是FA唯一支持的模版。

ServiceAbility : 服務(wù)模版，用于提供后臺(tái)運(yùn)行任務(wù)的能力。

DataAbility：數(shù)據(jù)模版，用于對(duì)外部提供統(tǒng)一的數(shù)據(jù)訪問抽象。

簡(jiǎn)單說，你要做UI交互，那么就用FA。需要做非界面的服務(wù)/數(shù)據(jù)處理就用PA。

層次結(jié)構(gòu)可以參考下圖：

在配置文件(config.json)中去注冊(cè)Ability時(shí)，就可以通過配置Ability元素中的type屬性來指定當(dāng)前Ability模版的類型：

上面截圖這個(gè)指定了一個(gè)page，表示了這是一個(gè)page模版實(shí)例。

同樣的，如果你創(chuàng)建的是一個(gè)PA，還可以指定service或者data。

不管是service還是data，都是一個(gè)ability，區(qū)別在于開發(fā)者怎么定義這個(gè)類的職責(zé)(是提供服務(wù)/數(shù)據(jù)支持呢，還是作為界面交互?)，簡(jiǎn)單說，取決于你想讓你創(chuàng)建的這個(gè)ability為你提供什么能力。

(二)頁面跳轉(zhuǎn)

我們?cè)趤砑?xì)說下PageAbility，上面介紹了Page模版是FA唯一支持的模版，并且提供了與用戶交互的能力(UI)，一個(gè)Page可以由一個(gè)或者多個(gè)AbilitySlice構(gòu)成，我們?cè)谥芭躧ello world的時(shí)候，有介紹Ability是一個(gè)路由入口，而AbilitySlice則是寫交互邏輯的地方。

簡(jiǎn)單說，當(dāng)我們創(chuàng)建一個(gè)FA的時(shí)候，比如這個(gè)TestAbility，會(huì)同時(shí)自動(dòng)對(duì)應(yīng)創(chuàng)建一個(gè)TestAbilitySlice，TestAbility相當(dāng)于是對(duì)外可以調(diào)用的類，具體的邏輯實(shí)現(xiàn)則是在TestAbilitySlice中。而當(dāng)調(diào)用TestAbility時(shí)，它就通過路由自動(dòng)映射給TestAbilitySlice來提供具體的交互邏輯。

默認(rèn)情況下，一個(gè)FeatureAbility會(huì)指定一個(gè)默認(rèn)的路由，即通過setMainRoute方法來指定其對(duì)應(yīng)的AbilitySlice，當(dāng)然我們也可以通過addActionRoute方法來修改默認(rèn)的指定。具體方法示例如下：

1.在config.json文件中去添加actions:

2.在對(duì)應(yīng)的Ablity中，在onStart中使用addActionRounte方法添加路由。

addActionRoute("action.test", TestAbilitySlice.class.getName()); 

3.調(diào)用：

private void TestAction() 
 
{ 
 
    Intent intent = new Intent(); 
 
    Operation operation = new Intent.OperationBuilder().withAction("action.test") 
 
            .build(); 
 
    intent.setOperation(operation); 
 
    startAbility(intent); 
 
} 

 這里再詳細(xì)解釋下這個(gè)Intent :

Intent是對(duì)象之間傳遞信息的載體。例如，當(dāng)一個(gè) Ability 需要啟動(dòng)另一個(gè) Ability 時(shí)， 或者一個(gè) AbilitySlice 需要導(dǎo)航到另一個(gè) AbilitySlice 時(shí)，可以通過 Intent 指定啟動(dòng)的目 標(biāo)同時(shí)攜帶相關(guān)數(shù)據(jù),之前的文章有說過，它就是一個(gè)中間件。

這樣就能實(shí)現(xiàn)Page間訪問到此AbilitySlice了。頁面跳轉(zhuǎn)分兩種情況：Page內(nèi)(Ability)跳轉(zhuǎn)和Page之間跳轉(zhuǎn)。當(dāng)然不管哪種情況，都需要借助中間件Intent來實(shí)現(xiàn)跳轉(zhuǎn)，同時(shí)Intent也支持?jǐn)y帶參數(shù)來傳遞Page間或者Ability間的數(shù)據(jù)參數(shù)。

(1)Page內(nèi)跳轉(zhuǎn)

同一個(gè)Page內(nèi)進(jìn)行跳轉(zhuǎn)時(shí)，即發(fā)起跳轉(zhuǎn)的AbilitySlice和跳轉(zhuǎn)目標(biāo)的AbilitySlice處于同一個(gè)Page時(shí)，可以使用present()方法進(jìn)行跳轉(zhuǎn)。

如果跳轉(zhuǎn)需要返回結(jié)果，可以使用presentForResult()方法來實(shí)現(xiàn)跳轉(zhuǎn)。用戶從跳轉(zhuǎn)目標(biāo)返回時(shí)，系統(tǒng)將會(huì)回調(diào)onResult()來接收和處理返回的結(jié)果。此時(shí)需要重寫該方法。返回結(jié)果是由跳轉(zhuǎn)目標(biāo)AbilitySlice在其生命周期內(nèi)通過setResult方法進(jìn)行設(shè)置。

(2)Page間跳轉(zhuǎn)

不同Page中的AbilitySlice是相互不可見的，所以無法通過present或者presentForResult方法直接跳轉(zhuǎn)到其他Page的AbilitySlice中。但是可以通過配置Intent的Action方式導(dǎo)航到目標(biāo)的AbilitySlice。Page間的導(dǎo)航則可使用startAbility或者startAbilityForResult方法來切換。類似的startAbilityForResult方法有onAbilityResult方法來獲取返回結(jié)果的回調(diào)。在Ability中通過使用setResult方法來設(shè)置返回結(jié)果，參見上面添加action的部分。

(三)UI框架

回到UI框架(JAVA)，我們可以有兩種方式進(jìn)行UI結(jié)構(gòu)的創(chuàng)建：Java代碼和XML方式。

1.使用代碼來構(gòu)建UI界面步驟：

(1)定義布局：

DirectionalLayout layout = new DirectionalLayout(this); 

(2)定于布局配置：

LayoutConfig config = new LayoutConfig(LayoutConfig.MATH_PARENT,LayoutConfig.MATH_PARENT); 

(3)設(shè)置布局的配置：

layout.setLayoutConfig(config); 

(4)配置布局背景：

ShapeElement element = new ShapeElement(); 
 
element.setRgbColor(new RgbColor(255,255,255)); 
 
layout.setBackground(element); 

 (5)在布局中添加組件(這里以文本為例)：

Text text = new Text(this); 
 
text.setLayoutConfig(config); 
 
text.setText(“你好，鴻蒙”); 
 
text.setTextColor(new Color(0xFF000000)); 
 
text.setTextSize(50); 
 
text.setTextAligment(TextAligment.CENTER); 
 
layout.addComponent(text); 

 (6)設(shè)置UI內(nèi)容

super.setUIContent(layout); 

完成以上這些捕捉，就能通過代碼形式來創(chuàng)建界面。

2.使用XML來構(gòu)建頁面：

(1)構(gòu)建一個(gè)XML文件：在base目錄右鍵創(chuàng)建布局文件：

(2)創(chuàng)建完成后，會(huì)在base->layout目錄下生成對(duì)應(yīng)的XML文件，初始內(nèi)容如下：

(3)創(chuàng)建組件元素：

xmlns:ohos="http://schemas.huawei.com/res/ohos" 
 
ohos:height="match_parent" 
 
ohos:width="match_parent" 
 
ohos:orientation="vertical"> 
 
 
ohos:height="match_content" 
 
ohos:width="match_content" 
 
ohos:text="你好，鴻蒙" 
 
/> 

 Text標(biāo)簽下還有其他很多參數(shù)，同樣的大部分組件都有類似或接近的標(biāo)簽設(shè)置參數(shù)，大家可以輸入ohos自動(dòng)補(bǔ)全去嘗試即可，基本都可以通過字面意思直接明白用途，這里就不再贅述了。

(4)使用資源映射ResourceTable來設(shè)置UI內(nèi)容：

super.setUIContent(ResourceTable.Layout_mytest); 

OK，本篇的內(nèi)容比較多,從Ability講到UI框架，但是它們關(guān)聯(lián)性很大，所以，我就都放在了一起。

想了解更多內(nèi)容，請(qǐng)?jiān)L問：

51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)

https://harmonyos.51cto.com/#zz