HarmonyOS4.0系统性深入开发10卡片事件能力说明

卡片事件能力说明

ArkTS卡片中提供了postCardAction()接口用于卡片内部和提供方应用间的交互,当前支持router、message和call三种类型的事件,仅在卡片中可以调用。

点击放大

接口定义:postCardAction(component: Object, action: Object): void

接口参数说明:

参数名参数类型必填参数描述
componentObject当前自定义组件的实例,通常传入this。
actionObjectaction的具体描述,详情见下表。

action参数说明:

KeyValue样例描述
“action”stringaction的类型,支持三种预定义的类型:“router”:跳转到提供方应用的指定UIAbility。“message”:自定义消息。触发后会调用提供方FormExtensionAbility的onFormEvent()生命周期回调。“call”:后台启动提供方应用。触发后会拉起提供方应用的指定UIAbility(仅支持launchType为singleton的UIAbility,即启动模式为单实例的UIAbility),但不会调度到前台。提供方应用需要具备后台运行权限(ohos.permission.KEEP_BACKGROUND_RUNNING)。
“bundleName”string“router” / “call” 类型时跳转的包名,可选。
“moduleName”string“router” / “call” 类型时跳转的模块名,可选。
“abilityName”string“router” / “call” 类型时跳转的UIAbility名,必填。
“params”Object当前action携带的额外参数,内容使用JSON格式的键值对形式。"call"类型时需填入参数’method’,且类型需要为string类型,用于触发UIAbility中对应的方法,必填。

postCardAction()接口示例代码:

Button('跳转').width('40%').height('20%').onClick(() => {postCardAction(this, {'action': 'router','bundleName': 'com.example.myapplication','abilityName': 'EntryAbility','params': {'message': 'testForRouter' // 自定义要发送的message}});})
Button('拉至后台').width('40%').height('20%').onClick(() => {postCardAction(this, {'action': 'call','bundleName': 'com.example.myapplication','abilityName': 'EntryAbility','params': {'method': 'fun', // 自定义调用的方法名,必填'message': 'testForCall' // 自定义要发送的message}});})

使用router事件跳转到指定UIAbility

在卡片中使用postCardAction接口的router能力,能够快速拉起卡片提供方应用的指定UIAbility,因此UIAbility较多的应用往往会通过卡片提供不同的跳转按钮,实现一键直达的效果。例如相机卡片,卡片上提供拍照、录像等按钮,点击不同按钮将拉起相机应用的不同UIAbility,从而提升用户的体验。

img

通常使用按钮控件来实现页面拉起,示例代码如下:

  • 在卡片页面中布局两个按钮,点击其中一个按钮时调用postCardAction向指定UIAbility发送router事件,并在事件内定义需要传递的内容。

    @Entry
    @Component
    struct WidgetCard {build() {Column() {Button('功能A').margin('20%').onClick(() => {console.info('Jump to EntryAbility funA');postCardAction(this, {'action': 'router','abilityName': 'EntryAbility', // 只能跳转到当前应用下的UIAbility'params': {'targetPage': 'funA' // 在EntryAbility中处理这个信息}});})Button('功能B').margin('20%').onClick(() => {console.info('Jump to EntryAbility funB');postCardAction(this, {'action': 'router','abilityName': 'EntryAbility', // 只能跳转到当前应用下的UIAbility'params': {'targetPage': 'funB' // 在EntryAbility中处理这个信息}});})}.width('100%').height('100%')}
    }
    
  • 在UIAbility中接收router事件并获取参数,根据传递的params不同,选择拉起不同的页面。

    import UIAbility from '@ohos.app.ability.UIAbility';
    import window from '@ohos.window';let selectPage = "";
    let currentWindowStage = null;export default class CameraAbility extends UIAbility {// 如果UIAbility第一次启动,在收到Router事件后会触发onCreate生命周期回调onCreate(want, launchParam) {// 获取router事件中传递的targetPage参数console.info("onCreate want:" + JSON.stringify(want));if (want.parameters.params !== undefined) {let params = JSON.parse(want.parameters.params);console.info("onCreate router targetPage:" + params.targetPage);selectPage = params.targetPage;}}// 如果UIAbility已在后台运行,在收到Router事件后会触发onNewWant生命周期回调onNewWant(want, launchParam) {console.info("onNewWant want:" + JSON.stringify(want));if (want.parameters.params !== undefined) {let params = JSON.parse(want.parameters.params);console.info("onNewWant router targetPage:" + params.targetPage);selectPage = params.targetPage;}if (currentWindowStage != null) {this.onWindowStageCreate(currentWindowStage);}}onWindowStageCreate(windowStage: window.WindowStage) {let targetPage;// 根据传递的targetPage不同,选择拉起不同的页面switch (selectPage) {case 'funA':targetPage = 'pages/FunA';break;case 'funB':targetPage = 'pages/FunB';break;default:targetPage = 'pages/Index';}if (currentWindowStage === null) {currentWindowStage = windowStage;}windowStage.loadContent(targetPage, (err, data) => {if (err && err.code) {console.info('Failed to load the content. Cause: %{public}s', JSON.stringify(err));return;}});}
    };
    

使用call事件拉起指定UIAbility到后台

许多应用希望借助卡片的能力,实现和应用在前台时相同的功能。例如音乐卡片,卡片上提供播放、暂停等按钮,点击不同按钮将触发音乐应用的不同功能,进而提高用户的体验。在卡片中使用postCardAction接口的call能力,能够将卡片提供方应用的指定UIAbility拉到后台。同时,call能力提供了调用应用指定方法、传递数据的功能,使应用在后台运行时可以通过卡片上的按钮执行不同的功能。

通常使用按钮控件来触发call事件,示例代码如下:

  • 在卡片页面中布局两个按钮,点击其中一个按钮时调用postCardAction向指定UIAbility发送call事件,并在事件内定义需要调用的方法和传递的数据。需要注意的是,method参数为必选参数,且类型需要为string类型,用于触发UIAbility中对应的方法。

    @Entry
    @Component
    struct WidgetCard {build() {Column() {Button('功能A').margin('20%').onClick(() => {console.info('call EntryAbility funA');postCardAction(this, {'action': 'call','abilityName': 'EntryAbility', // 只能跳转到当前应用下的UIAbility'params': {'method': 'funA' // 在EntryAbility中调用的方法名}});})Button('功能B').margin('20%').onClick(() => {console.info('call EntryAbility funB');postCardAction(this, {'action': 'call','abilityName': 'EntryAbility', // 只能跳转到当前应用下的UIAbility'params': {'method': 'funB', // 在EntryAbility中调用的方法名'num': 1 // 需要传递的其他参数}});})}.width('100%').height('100%')}
    }
    
  • 在UIAbility中接收call事件并获取参数,根据传递的method不同,执行不同的方法。其余数据可以通过readString的方式获取。需要注意的是,UIAbility需要onCreate生命周期中监听所需的方法。

    import UIAbility from '@ohos.app.ability.UIAbility';function FunACall(data) {// 获取call事件中传递的所有参数console.log('FunACall param:' + JSON.stringify(data.readString()));return null;
    }function FunBCall(data) {console.log('FunACall param:' + JSON.stringify(data.readString()));return null;
    }export default class CameraAbility extends UIAbility {// 如果UIAbility第一次启动,在收到call事件后会触发onCreate生命周期回调onCreate(want, launchParam) {try {// 监听call事件所需的方法this.callee.on('funA', FunACall);this.callee.on('funB', FunBCall);} catch (error) {console.log('register failed with error. Cause: ' + JSON.stringify(error));}}// 进程退出时,解除监听onDestroy() {try {this.callee.off('funA');this.callee.off('funB');} catch (error) {console.log('register failed with error. Cause: ' + JSON.stringify(error));}}
    };
    

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/312527.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ES6之生成器(Generator)

✨ 专栏介绍 在现代Web开发中,JavaScript已经成为了不可或缺的一部分。它不仅可以为网页增加交互性和动态性,还可以在后端开发中使用Node.js构建高效的服务器端应用程序。作为一种灵活且易学的脚本语言,JavaScript具有广泛的应用场景&#x…

穷举vs暴搜vs深搜vs回溯vs剪枝

欢迎来到Cefler的博客😁 🕌博客主页:那个传说中的man的主页 🏠个人专栏:题目解析 🌎推荐文章:题目大解析(3) 目录 👉🏻全排列👉&#…

【ES】es介绍,使用spring-boot-starter-data-elasticsearch整合的ES来进行操作Es

文章目录 倒排索引(Inverted Index)和正排索引(Forward Index)es和MySQL对比IK分词器的总结mapping映射使用springboot整合的ES来进行操作Es1. 实体类中添加注解2. 编写Repository层3. 通过Repository进行增删改查 倒排索引&#…

java零拷贝zero copy MappedByteBuffer

目录 调用操作系统的 mmap 未使用 mmap 的文件通过网络传输的过程 使用 mmap 的文件通过网络传输的过程 使用例子 调用操作系统的 sendfile() 在 java 中的具体实现 mmap的优劣 mmap 的不足 mmap 的优点 mmap 的使用场景 对于零拷贝(zero copy&#xff09…

MCS接口技术----定时/计数,中断

目录 一.中断系统相关寄存器 1.51单片机中断系统的总体结构: 2.中断源的中断级别(由高到低): 3.与中断有关的四个寄存器: (1)TCON---定时控制寄存器 (2)IE---中断允…

2024-01-01 力扣高频SQL50题目 练习笔记

1. 1661求机器平均运行时间 在做这道题的时候,我遇到了4个问题 # 求平均的问题 如何找到个数? -> 相减对应列值后,直接average 就行。因为avg就是自动确定要除的个数(当然要联合正确的group by 分组) # 怎么根据machine_id和process_id…

Spring系列:Spring如何解决循环依赖

❤ 作者主页:欢迎来到我的技术博客😎 ❀ 个人介绍:大家好,本人热衷于Java后端开发,欢迎来交流学习哦!( ̄▽ ̄)~* 🍊 如果文章对您有帮助,记得关注、点赞、收藏、…

LeetCode刷题--- 不同路径 III

个人主页:元清加油_【C】,【C语言】,【数据结构与算法】-CSDN博客 个人专栏 力扣递归算法题 http://t.csdnimg.cn/yUl2I 【C】 ​​​​​​http://t.csdnimg.cn/6AbpV 数据结构与算法 ​​​http://t.csdnimg.cn/hKh2l 前言:这个专栏主要讲述递…

ACES 增强版不丹水稻作物地图(2016-2022 年)

ACES 增强版不丹水稻作物地图(2016-2022 年) 用于改善粮食安全决策的 2016-2022 年年度作物类型稻米地图仍然是不丹的一项挑战。这些地图是与不丹农业部和 SERVIR 合作开发的。通过专注于发展不丹的科学、技术、工程和数学 (STEM),我们共同开…

HTML进阶

列表、表格、表单 文章目录 列表、表格、表单01-列表无序列表有序列表定义列表 02-表格表格结构标签-了解合并单元格 03-表单input 标签input 标签占位文本单选框上传文件多选框下拉菜单文本域label 标签按钮 04-语义化无语义的布局标签有语义的布局标签 05-字符实体 01-列表 …

uni-app引入vant表单(附源码)

新建项目 下载安装vant npm i vant main.js引入 import { Form } from vant; import { Field } from vant;Vue.use(Form); Vue.use(Field);代码引入 <van-form submit"onSubmit"><van-fieldclass"rePwd"v-model"username"name"请…

ES应用_ES实战

依靠知识库使用es总结一些使用技巧。 1 快速入门 ES是将查询语句写成类似json的形式&#xff0c;通过关键字进行查询和调用。 1.1 创建 下面创建了一个主分片为5&#xff0c;副本分片为1的ES结构。ES本身是一种noschema的结构&#xff0c;但是可以通过指定mapping编程schema的…