Author: Han Ru

Company: Procedural Coffee (Beijing) Technology Co., LTD

Columnist for Hung Mun Bus

One, Page and AbilitySlice

Page

The Page template (hereinafter referred to as “Page”) is the only template supported by FA to provide the ability to interact with users. A Page can be composed of one or more AbilitySlice, AbilitySlice refers to the application of a single Page and its control logic.

When a Page is composed of multiple AbilitySlice, the business capabilities provided by these AbilitySlice pages should be highly relevant. For example, the news browsing function can be implemented through a Page, which contains two AbilitySlice: one for displaying news list, the other for displaying news details. The relationship between Page and AbilitySlice is shown in the following figure.

AbilitySlice

In this case, Slice means Slice. A set of related AbilitySlice in one Page.

AbilitySlice, as the basic unit of using Page templates to capabilities, provides a service logic and UI display carrier capability.

Compared with desktop scenarios, applications interact more frequently in mobile scenarios. Typically, a single application focuses on one aspect of capability development and calls capabilities provided by other applications when it needs assistance from other capabilities. For example, the food delivery app provides access to business functions. When users use this function, they will be redirected to the dial page of the calling app. Similarly, HarmonyOS supports jumping between different pages and can specify a specific AbilitySlice in the target Page.

A Ability can be composed of multiple AbilitySlice. In Ability, we must override the onStart(Intent) method to specify the default AbilitySlice via the setMainRoute(String) method.

So in AbilitySlice can override onStart (ohos. Aafwk. Content. Intent) to set to display the UI. Typically, the UI needs to be set up only once over the life of AbilitySlice.

You can use the present (ohos aafwk. Ability. AbilitySlice, ohos. Aafwk. Content. Intent) method to render the new AbilitySlice, Or use startAbility (ohos. Aafwk. Content. Intent) method to start a new AbilitySlice.

AbilitySlice must always be hosted in Ability, and its lifecycle varies with the lifecycle of Ability. AbilitySlice also has its own lifecycle changes, which occur during the switching process of AbilitySlice.

We can specify multiple action entries and a default master entry for a Ability. Each entry represents the capabilities and UI that Ability can provide. When a Ability is enabled, the system matches the action field in the Intent passed against the entry defined. If the specified AbilitySlice is found, it is started. If the action field is not specified in the Intent passed, or if the action field in the Intent does not match the defined entry, the default AbilitySlice is displayed.

AbilitySlice can also be opened by specifying an action for other abilities after registering an action.

Configure the AbilitySlice route

Although a Page can contain multiple AbilitySlice, but Page into the foreground interface default display only a AbilitySlice. The default displayed AbilitySlice is specified by the setMainRoute() method. If you need to change the default displayed AbilitySlice, you can configure a routing rule for this AbilitySlice using the addActionRoute()** method. At this point, when other Page instances expect to navigate to the AbilitySlice, you can specify the Action in the Intent. The action names used in the addActionRoute() method need to be registered in the application configuration file (config.json).

SetMainRoute () method

The setMainRoute() method, which you can call to set the default route for the Ability, the AbilitySlice to render. This method can only be used for Page Ability. Note: if the onStart (ohos. Aafwk. Content. Intent), not to set the default routing, start will fail.

We create a Harmony project, and by default it loads Mainabilitysice,

package com.example.hanrupageability;

import com.example.hanrupageability.slice.MainAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;

public class MainAbility extends Ability {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        // Set the default AbilitySlice display
        super.setMainRoute(MainAbilitySlice.class.getName()); }}Copy the code

Display the corresponding ability_main.xml layout:

Now add an XML file to the Layout directory: ability_second.xml

<? xml version="1.0" encoding="utf-8"? > <DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="center"
    ohos:background_element="#2200ffff"
    ohos:orientation="vertical">

    <Text
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:text="I am the second AbilitySlice."
        ohos:text_size="20fp"

        />
</DirectionalLayout>
Copy the code

Then create a new AbilitySlice in the slice directory: SecondAbilitySlice. Java

package com.example.hanrupageability.slice;

import com.example.hanrupageability.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;

public class SecondAbilitySlice extends AbilitySlice{
    @Override
    protected void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_second); }}Copy the code

Next we can set the display of SecondAbilitySlice by using the setMainRoute() method:

package com.example.hanrupageability;

import com.example.hanrupageability.slice.MainAbilitySlice;
import com.example.hanrupageability.slice.SecondAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;

public class MainAbility extends Ability {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        // Set the default AbilitySlice display
// super.setMainRoute(MainAbilitySlice.class.getName());
        super.setMainRoute(SecondAbilitySlice.class.getName()); }}Copy the code

Then run the project:

AddActionRoute () method

Examples of setMainRoute() and addActionRoute() methods:

package com.example.hanrupageability;

import com.example.hanrupageability.slice.MainAbilitySlice;
import com.example.hanrupageability.slice.SecondAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;

public class MainAbility extends Ability {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        // Set the default AbilitySlice display
        super.setMainRoute(MainAbilitySlice.class.getName());
        // super.setMainRoute(SecondAbilitySlice.class.getName());

        // Configure routing rule display
        addActionRoute("action.test.second", SecondAbilitySlice.class.getName()); }}Copy the code

The action names used in the addActionRoute() method need to be registered in the application configuration file (config.json) :

"skills": [{"entities": [
              "entity.system.home"]."actions": [
              "action.system.home"."action.test.second"]}],Copy the code

As shown in figure:

Create PageAbility

By default, a HarmonyOS application is launched, and MainAbility is loaded first according to the configuration in config.json.

{
  "app": {
    "bundleName": "com.example.hanrupageability"."vendor": "example"."version": {
      "code": 1000000."name": "1.0.0"}},"deviceConfig": {},
  "module": {
    "package": "com.example.hanrupageability"."name": ".MyApplication"."mainAbility": "com.example.hanrupageability.MainAbility"."deviceType": [
      "phone"]."distro": {
      "deliveryWithInstall": true."moduleName": "entry"."moduleType": "entry"."installationFree": false
    },
    "abilities": [{"skills": [{"entities": [
              "entity.system.home"]."actions": [
              "action.system.home"."action.test.second"]}],"orientation": "unspecified"."name": "com.example.hanrupageability.MainAbility"."icon": "$media:icon"."description": "$string:mainability_description"."label": "$string:entry_MainAbility"."type": "page"."launchType": "standard"}}}]Copy the code

In MainAbility, load MainAbilitySlice according to the set main route:

	@Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setMainRoute(MainAbilitySlice.class.getName());
    }
Copy the code

In MainAbilitySlice, we set up the XML layout file to display according to setUIContent(), finally displaying the contents of ability_main.xml on our screen.

		@Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);
    }
Copy the code

Now if we want to load our own written Ability by default, let’s do it.

Start by creating a new Ability file in Java: myability.java.

package com.example.hanrupageability;

import com.example.hanrupageability.slice.MyAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;

public class MyAbility extends Ability {
    @Override
    protected void onStart(Intent intent) {
        super.onStart(intent);
        // Set the main route
        super.setMainRoute(MyAbilitySlice.class.getName()); }}Copy the code

Create a new AbilitySlice file in your slice package: MyAbilitySlice.

package com.example.hanrupageability.slice;

import com.example.hanrupageability.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;

public class MyAbilitySlice  extends AbilitySlice {
    @Override
    protected void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_my_layout); }}Copy the code

Then create a new XML layout file under layout: my_layout.xml

<? xml version="1.0" encoding="utf-8"? > <DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:background_element="#33AA0000"
    ohos:orientation="vertical">

    <Text
        ohos:height="match_parent"
        ohos:width="match_parent"
        ohos:text="A new entrance"
        ohos:text_size="30fp"
        ohos:text_alignment="center"
        />

</DirectionalLayout>
Copy the code

Here we copy to the media a small icon t4.png:

Finally, we need to set this in config.json:

{
  "app": {
    "bundleName": "com.example.hanrupageability"."vendor": "example"."version": {
      "code": 1000000."name": "1.0.0"}},"deviceConfig": {},
  "module": {
    "package": "com.example.hanrupageability"."name": ".MyApplication"."mainAbility": "com.example.hanrupageability.MainAbility"."deviceType": [
      "phone"]."distro": {
      "deliveryWithInstall": true."moduleName": "entry"."moduleType": "entry"."installationFree": false
    },
    "abilities": [{"skills": [{"entities": [
              "entity.system.home"]."actions": [
              "action.system.home"]}],"orientation": "unspecified"."name": "com.example.hanrupageability.MyAbility"."icon": "$media:t4"."label": "$string:entry_MainAbility"."type": "page"."launchType": "standard"
      },

      {
        "orientation": "unspecified"."name": "com.example.hanrupageability.MainAbility"."icon": "$media:icon"."description": "$string:mainability_description"."label": "$string:entry_MainAbility"."type": "page"."launchType": "standard"}}}]Copy the code

Then start the project and deploy the APP:

Click in, and there is a new entrance:

AbilitySlice and THE XML layout file to be loaded by AbilitSlice will be automatically created when Ability is created:

Then fill in the information about Ability:

The config.json file is automatically configured.

More:

1. Community: Hongmeng Bus www.harmonybus.net/

2. Official account: HarmonyBus

3, technical exchange QQ group: 714518656

4. Video lesson: www.chengxuka.com