优势:服务卡片(以下简称“卡片”)是FA的一种界面展示形式,将FA的重要信息或操作前置到卡片,以达到服务直达,减少体验层级的目的。卡片可以拉起页面、发送请求、刷新内容等基础交互功能。基于这些能力我们头脑风暴出很多应用新形态,实现不打开应用就推送数据给用户(推箱子游戏、留声机、大字报...);我甚至认为一张好卡就像是立在高速入口的广告牌;
问题:卡片只能实现简单的操作,复杂的操作还是要承载在元服务内,有的用户已经开发了APP、快应用、H5;重复开发元服务带来开发工作浪费、维护成本增加等问题;今天我们就来解决这个问题。
鸿蒙卡片跳转快应用实现案例:
创建鸿蒙工程
1、安装DevEco Studio 3.1,点击菜单File->New->Create Project ,选择Empty Ability模板
2、Project type选择Atomic service,SDK版本建议选择API6,Show in service center开发打开,Device type 去掉TV,点击finish待工具完成项目初始化。
3、工程创建完后到entry/src/js/widget路径下查看卡片JS文件组织;hml文件开发组件布局,在image图片上绑定了一个点击事件“routerEvent”
<div class="container">
<stack>
<div class="container-img">
<image src="/common/[email protected]" class="bg-img" onclick="routerEvent"></image>
</div>
<div class="container-inner">
<text class="title">{{ $t('strings.title') }}</text>
<text class="detail_text">{{ $t('strings.detail') }}</text>
</div>
</stack>
</div>
![](/i/l/?n=23&i=blog/1969374/202302/1969374-20230221103415769-572558212.gif)
该事件在json中实现,actions中定义事件"routerEvent",action动作为router跳转,跳转地址为bundleName为com.huawei.appgallery.myapplication.hmservice的com.huawei.appgallery.myapplication.MainAbility(在config.json文件中查看),此外还支持message事件,该事件不跳转页面,仅触发MainAbility的onTriggerFormEvent方法
{
"data": {
"title": "Title",
"detail": "Text",
"iconTitle": "Picture"
},
"actions": {
"routerEvent": {
"action": "router",
"bundleName": "com.huawei.appgallery.myapplication.hmservice",
"abilityName": "com.huawei.appgallery.myapplication.MainAbility",
"params": {
"message": "add detail"
}
}
}
}
![](/i/l/?n=23&i=blog/1969374/202302/1969374-20230221103415769-572558212.gif)
因为卡片只能跳转到元服务,那我们最初想从卡片跳转到快应用就只能通过卡片—元服务—快应用实现,在MainAbility的t生命周期onStar方法中通过Intent实现三方跳转
@Override
public void onStart(Intent intent) {
super.onStart(intent);
this.setUIContent(ResourceTable.Layout_ability_main);//设置透明窗口
WindowManager.getInstance().getTopWindow().get().setTransparent(true);//设置对话框启用透明模式
go();//快应用跳转
terminateAbility();//关闭元服务进程
}
private void go(){
Intent intent = new Intent();
Operation operation = new Intent.OperationBuilder()
//.withBundleName("com.huawei.fastapp.dev") //快应用引擎
.withBundleName("com.huawei.fastapp") //生产环境
.withUri(Uri.parse("hap://app/com.testquick.huawei?kay=value")) //快应用包名和需要携带的参数
.withAction(IntentConstants.ACTION_VIEW_DATA)
.withFlags(Intent.FLAG_NOT_OHOS_COMPONENT)
.build();
intent.setOperation(operation);
intent.setParam("TYPE","MAP");
startAbility(intent);}
![](/i/l/?n=23&i=blog/1969374/202302/1969374-20230221103415769-572558212.gif)
为了达到最完美的效果,我们还要配置元服务的状态为沉浸式的,在config.json文件中找到module下的abilities中找到MainAbility,跟forms同级别添加
"name": "com.huawei.appgallery.myapplication.MainAbility",
"metaData": {
"customizeData": [
{
"name": "hwc-theme",
"value": "androidhwext:style/Theme.Emui.Translucent.NoTitleBar.Fullscreen"
}
]
},
"forms": [
{
"jsComponentName": "widget",
..........
![](/i/l/?n=23&i=blog/1969374/202302/1969374-20230221103415769-572558212.gif)
样一个简单的卡片跳转快应用功能就实现了,运行试试效果吧
欲了解更多更全技术文章,欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh
标签:鸿蒙,卡片,MainAbility,广告牌,立在,huawei,intent,跳转,com From: https://www.cnblogs.com/developer-huawei/p/17140081.html