当前位置:   article > 正文

【鸿蒙 HarmonyOS】界面跳转 ( Page Ability 的 action 标识 | Page Ability 之间的界面跳转及传递数据 | 鸿蒙工程下创建 Module | 代码示例 )_鸿蒙子module跳转

鸿蒙子module跳转



参考文档 :





一、Page Ability 的 action 标识



Page Ability 标识 : action 字符串 ;

Page Ability 界面跳转 , 其中 Page Ability 是通过 action 字符串进行标记的 , 每个 Page Ability 对应的 action 字符串在 src/main/ 下的 config.json 中配置 ,

其中 “abilities” 是配置所有的 Ability , 前者是主界面的 Ability , 后者是要跳转的 Ability , 两个都配置在 “abilities”: [] 中 , 中间使用逗号隔开 ;

    "abilities": [
      {
        "orientation": "unspecified",
        "visible": true,
        "name": "com.example.ability.MainAbility",
        "icon": "$media:icon",
        "description": "$string:mainability_description",
        "label": "ability",
        "type": "page",
        "launchType": "standard"
      },
      {
        "skills":[
          {
            "actions":[
              "ability.intent.MainAbility2"
            ]
          }
        ],
        "orientation": "unspecified",
        "visible": true,
        "name": "com.example.ability.MainAbility2",
        "icon": "$media:icon",
        "description": "$string:mainability_description",
        "label": "ability",
        "type": "page",
        "launchType": "standard"
      }
    ]
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29

配置 Ability 的 action 字符串 , 在 Ability 中添加如下配置 , 即可配置该 Page Ability 的 action 字符串 ;

下面配置的 com.example.ability.MainAbility2 的界面标识是 “ability.intent.MainAbility2” 字符串 ;

        "skills":[
          {
            "actions":[
              "ability.intent.MainAbility2"
            ]
          }
        ]
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7




二、Page Ability 之间的界面跳转及传递数据



两个 Page Ability , 对应的两个 AbilitySlice , 以及两个 布局文件 ;

核心逻辑都在两个 AbilitySlice 中 ;



1. Page Ability 设置 AbilitySlice :

创建两个 MainAbility , 初始状态下进入的是 MainAbility , 然后跳转到 MainAbility2 ;


初始 AbilitySlice 如下 , 在 onStart ( ) 方法中 , 调用 super.setUIContent ( ) 方法设置 XML 布局文件 , 相当于 Android 中的 setContentView ( ) 方法 ;

XML 布局文件使用 ResourceTable.Layout_ability_main 方式引用 ;

上述实际的布局文件是在 HarmonyHelloWorld\entry\src\main\resources\base\layout 目录下的 ability_main.xml 布局文件 ;

引用时在 ability_main 文件名称前 , 加上了 ResourceTable.Layout_ 前缀 , 相当于 Android 中的 R.layout. 前缀 ;

// 设置布局文件
super.setUIContent(ResourceTable.Layout_ability_main);
  • 1
  • 2


2. 获取按钮组件 , 并设置点击事件 :

在 AbilitySlice 中 , 调用 findComponentById ( ) 方法 , 可以获取按钮组件 ;

获取的对象类型是 Component , 需要强转为 Button 对象 ;

// 获取 XML 布局中的 Button 按钮
Button button = (Button) findComponentById(ResourceTable.Id_button);
  • 1
  • 2

设置按钮点击事件 : 调用 setClickedListener ( ) 方法 , 设置 Component.ClickedListener 类型的点击监听器 , 按钮被点击后 , 会自动回调 onClick ( ) 方法 ;

        // 设置 Button 按钮点击事件
        button.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
            }
        });
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6


3. Page Ability 界面跳转 :

首先要初始化 Intent 意图对象 , 然后调用 Intent 对象的 setAction ( ) 方法设置 action 字符串 , 和 setParam ( ) 方法传递的数据 , 最后调用 startAbility ( ) 启动另外一个 action 字符串对应的 Page Ability 界面 ;

                // 初始化传递的 Intent 意图对象
                Intent intent = new Intent();
                // 设置跳转的目标 Page Ability 的 action 标识
                intent.setAction("ability.intent.MainAbility2");
                // 设置传递的数据
                intent.setParam("DATA", 888);

                // 跳转到目标 Page Ability
                startAbility(intent);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9


4. 获取 Text 组件 , 并设置显示内容 : 在跳转后的 Page Ability 中的 AbilitySlice 的 onStart ( ) 方法中 , 调用 findComponentById ( ) 方法获取 Text 组件 , 需要强制转换 ;

调用 Text 组件的 setText ( ) 方法 , 设置组件显示的文字内容 ;

        // 获取 Text 文字显示组件
        Text text = (Text) findComponentById(ResourceTable.Id_text);

        // 获取 Intent 中的数据 , 并显示到界面中
        text.setText("页面 2 数据 : " + intent.getIntParam("DATA", 0));
  • 1
  • 2
  • 3
  • 4
  • 5




三、鸿蒙工程下创建 Module



创建新的 Module , 演示 Page Ability 之间的界面跳转 ;

右键点击项目跟目录 , 选择 New / Module … 选项 ;

在这里插入图片描述

选择 " Phone " 手机应用 , " Empty Feature Ability ( Java ) " 类型的 Java 语言应用 ;

在这里插入图片描述

配置 Module ;
在这里插入图片描述
配置 Ability 界面 ;

在这里插入图片描述





四、代码示例



代码展示顺序 :

① Ability 配置文件 ;

② 主界面 Page Ability 代码 ;

③ 主界面 Page Ability 对应的 AbilitySlice 代码 ;

④ 主界面 Page Ability 对应的 AbilitySlice 对应的布局文件代码 ;

⑤ 跳转目标界面 Page Ability 代码 ;

⑥ 跳转目标界面 Page Ability 对应的 AbilitySlice 代码 ;

⑦ 跳转目标界面 Page Ability 对应的 AbilitySlice 对应的布局文件代码 ;


config.json 完整配置文件 : 主要是查看 Page Ability 的 action 是如何配置的 ;

{
  "app": {
    "bundleName": "com.example.harmony",
    "vendor": "example",
    "version": {
      "code": 1,
      "name": "1.0"
    },
    "apiVersion": {
      "compatible": 3,
      "target": 4,
      "releaseType": "Beta1"
    }
  },
  "deviceConfig": {},
  "module": {
    "package": "com.example.ability",
    "name": ".MyApplication",
    "deviceType": [
      "phone"
    ],
    "distro": {
      "deliveryWithInstall": true,
      "moduleName": "ability",
      "moduleType": "feature"
    },
    "abilities": [
      {
        "orientation": "unspecified",
        "visible": true,
        "name": "com.example.ability.MainAbility",
        "icon": "$media:icon",
        "description": "$string:mainability_description",
        "label": "ability",
        "type": "page",
        "launchType": "standard"
      },
      {
        "skills":[
          {
            "actions":[
              "ability.intent.MainAbility2"
            ]
          }
        ],
        "orientation": "unspecified",
        "visible": true,
        "name": "com.example.ability.MainAbility2",
        "icon": "$media:icon",
        "description": "$string:mainability_description",
        "label": "ability",
        "type": "page",
        "launchType": "standard"
      }
    ]
  }
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57

MainAbility 主界面 Page Ability :

package com.example.ability;

import com.example.ability.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);
        super.setMainRoute(MainAbilitySlice.class.getName());
    }
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14

MainAbilitySlice 显示内容 :

package com.example.ability.slice;

import com.example.ability.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Button;
import ohos.agp.components.Component;

public class MainAbilitySlice extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);

        // 获取 XML 布局中的 Button 按钮
        Button button = (Button) findComponentById(ResourceTable.Id_button);

        // 设置 Button 按钮点击事件
        button.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {

                // 初始化传递的 Intent 意图对象
                Intent intent = new Intent();
                // 设置跳转的目标 Page Ability 的 action 标识
                intent.setAction("ability.intent.MainAbility2");
                // 设置传递的数据
                intent.setParam("DATA", 888);

                // 跳转到目标 Page Ability
                startAbility(intent);
            }
        });
    }

    @Override
    public void onActive() {
        super.onActive();
    }

    @Override
    public void onForeground(Intent intent) {
        super.onForeground(intent);
    }
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46

MainAbilitySlice 布局文件 ability_main.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:orientation="vertical">

    <Text
        ohos:id="$+id:text"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="$graphic:background_ability_main"
        ohos:layout_alignment="horizontal_center"
        ohos:text="页面 1"
        ohos:text_size="50"
        />

    <Button
        ohos:id="$+id:button"
        ohos:height="match_parent"
        ohos:width="match_content"
        ohos:layout_alignment="bottom|horizontal_center"
        ohos:text="跳转到 2 页面"
        ohos:text_size="50"
        />

</DirectionalLayout>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27

MainAbility2 跳转目标界面 Page Ability :

package com.example.ability;

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

public class MainAbility2 extends Ability {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setMainRoute(MainAbilitySlice2.class.getName());
    }
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14

MainAbilitySlice2 显示内容 :

package com.example.ability.slice;

import com.example.ability.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Text;

public class MainAbilitySlice2 extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main2);

        // 获取 Text 文字显示组件
        Text text = (Text) findComponentById(ResourceTable.Id_text);

        // 获取 Intent 中的数据 , 并显示到界面中
        text.setText("页面 2 数据 : " + intent.getIntParam("DATA", 0));
    }

    @Override
    public void onActive() {
        super.onActive();
    }

    @Override
    public void onForeground(Intent intent) {
        super.onForeground(intent);
    }
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31

MainAbilitySlice2 布局文件 ability_main2.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:orientation="vertical">

    <Text
        ohos:id="$+id:text"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="$graphic:background_ability_main"
        ohos:layout_alignment="horizontal_center"
        ohos:text="页面 2"
        ohos:text_size="50"
        />

</DirectionalLayout>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18




五、执行效果



运行后初始主界面 :

在这里插入图片描述

点击 " 跳转到 2 页面 " 按钮 ;

在这里插入图片描述

声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号