鸿蒙原生开发手记:02-服务卡片开发

本文涉及的产品
云原生网关 MSE Higress,422元/月
应用实时监控服务-应用监控,每月50GB免费额度
应用实时监控服务-用户体验监控,每月100OCU免费额度
简介: 服务卡片是桌面小组件,分为静态和动态两类。本文介绍如何在 DevEco 中创建静态服务卡片,并实现点击事件传参和参数接收。创建时需选择支持的卡片大小,使用 FormLink 实现跳转,参数在 `entryability` 的生命周期方法中接收。注意:服务卡片不支持热重载。

介绍

服务卡片是一直桌面小组件,可以放置在桌面上等位置,一触即达。

服务卡片分为静态卡片和动态卡片两类。本文介绍静态卡片。

创建

回到 DevEco,在目录entry右键,点击创建 Service Widget,选择 Static Widget, 点击 Next。

image.png

输入名称,选择支持的卡片大小,点击确定创建卡片。

其中 22 代表 2行2列,12 代表1行2列。

image.png

编写卡片界面

交互

点击事件传参

这里使用 ArkUI 编写界面,不过不能使用点击事件,转而应该使用 FormLink,相关的事件在 formability 侧接受,通过不同的参数,调用 router.push 打开不同的页面。

FormLink({
  action: this.ACTION_TYPE,
  abilityName: this.ABILITY_NAME,
  params: {
    action: this.MESSAGE
  }
}) {
...
}

参数接收

entryability 中的 onCreateonNewWant 生命周期中,来接收参数

  onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {
   

    if(want?.parameters?.params) {
   
      let params: Record<string, Object> = JSON.parse(want.parameters.params as string);
      this.selectPage = params.action as string;
      console.log("selectPage", this.selectPage);
    }
  }

  onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): void {
   
    console.log('onNewWant');
    if (want?.parameters?.params) {
   
      // want.parameters.params 对应 postCardAction() 中 params 内容
      let params: Record<string, Object> = JSON.parse(want.parameters.params as string);
      this.selectPage = params.action as string;
      hilog.info(DOMAIN_NUMBER, TAG, `onNewWant selectPage: ${
     this.selectPage}`);
    }
    if (this.currentWindowStage !== null) {
   
      this.onWindowStageCreate(this.currentWindowStage);
    }
  }

注意事项

1.运行时,请使用正常模式,服务卡片不支持 HotReload ,而且热重载模式下卡片无法正常显示。

参考资料

  • [服务卡片文档]
目录
相关文章
|
7月前
|
IDE API 开发工具
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之XComponent组件
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之XComponent组件
358 2
|
7月前
|
IDE 开发工具 Windows
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之StepperItem组件
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之StepperItem组件
183 46
|
7月前
|
IDE 开发工具 数据安全/隐私保护
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之PatternLock组件
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之PatternLock组件
136 0
|
7月前
|
IDE API 开发工具
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Span组件
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Span组件
159 3
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Span组件
|
7月前
|
IDE 开发工具 Windows
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之NavDestination组件
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之NavDestination组件
250 3
|
7月前
|
IDE 开发工具 Windows
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之MenuItemGroup组件
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之MenuItemGroup组件
62 1
|
7月前
|
IDE 开发工具 索引
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Stepper组件
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Stepper组件
127 5
|
7月前
|
IDE API 开发工具
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之AlphabetIndexer组件
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之AlphabetIndexer组件
120 1
|
2月前
|
数据可视化 JavaScript API
HarmonyOS NEXT原生重榜发布-安利一款鸿蒙可视化代码生成器
鸿蒙低代码可视化开发平台是基于华为鸿蒙操作系统构建的创新开发环境,旨在通过简化开发流程、降低技术门槛,加速应用从设计到上线的全过程。它融合了低代码开发的核心理念与鸿蒙系统的技术优势,为开发者提供了一条高效、便捷的应用开发之路。
55 2
|
7月前
|
IDE 开发工具 开发者
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之NavRouter组件
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之NavRouter组件
105 3