鸿蒙服务卡片:把核心功能钉在桌面
你有没有过这样的体验:打开手机,桌面一个天气卡片直接告诉你「今天有雨」,而不是你点开 App 才知道。在 HarmonyOS 里,这种「不用打开 App 就能看见核心信息」的能力,就叫服务卡片(Service Widget)。它不是传统意义上的桌面快捷方式,而是把 App 最有价值的信息「钉」在用户桌面上,把「人找服务」变成「服务找人」。
一、核心原理:卡片是 UIAbility 的延伸
在 HarmonyOS 的 Stage 模型下,一张卡片本质上是一个独立 UIAbility 的延伸,由 FormExtensionAbility 管理它的生老病死。系统通过几个关键回调驱动卡片生命周期:
•onAddForm(want):用户把卡片拖到桌面时触发,只执行一次,必须立即返回初始数据,不能做耗时操作(HarmonyOS 6.0 前限时 5 秒,6.0 延至 10 秒)。•onUpdateForm(formId):系统定时刷新时触发,同步返回最新数据。•onRemoveForm(formId):用户移除卡片时触发,做资源清理。数据怎么送进卡片?靠 formBindingData.createFormBindingData(obj) 把普通对象包装成 FormBindingData,再由 formProvider.updateForm(formId, data) 主动推送。刷新方式有两种,互不冲突:
1定时刷新:在 module.json5 里配 updateEnabled、scheduledUpdateTime(如 10:30)和 updateDuration;2主动推送:App 侧直接调 formProvider.updateForm 推数据,每天上限 50 次。二、可运行 Demo:每日金句卡片
下面用 ArkTS 写一个「每日金句」卡片:添加时显示一句开场白,定时刷新后换成晚间金句;点击卡片直接跳回主应用。
"color:#6a9955">#6a9955">// EntryFormAbility.ts —— 卡片的「大脑」import FormExtensionAbility from '"color:#6a9955">#c586c0">@ohos.app.form.FormExtensionAbility';import formBindingData from '"color:#6a9955">#c586c0">@ohos.app.form.formBindingData';const QUOTES = [ { title: '今日金句', content: '坚持就是胜利!' }, { title: '晚间思考', content: '代码是写给未来的情书。' },];exportdefaultclass EntryFormAbility extends FormExtensionAbility { private index = 0; onAddForm(want) {"color:#6a9955">#6a9955">// 添加卡片:返回初始数据(仅执行一次)return formBindingData.createFormBindingData(QUOTES[this.index]); } onUpdateForm(formId) {"color:#6a9955">#6a9955">// 定时刷新:推进到下一句并推送this.index = (this.index + 1) % QUOTES.length;const data = formBindingData.createFormBindingData(QUOTES[this.index]);this.context.updateForm(formId, data).then(() => {console.info('卡片刷新成功 -> ' + QUOTES[this.index].title); }); }}
"color:#6a9955">#6a9955">// WidgetCard.ets —— 卡片 UI(声明式布局)"color:#6a9955">#c586c0">@Entry"color:#6a9955">#c586c0">@Componentstruct WidgetCard {"color:#6a9955">#c586c0">@LocalStorageProp('title') title: string = '默认标题';"color:#6a9955">#c586c0">@LocalStorageProp('content') content: string = '加载中...'; build() { Column() { Text(this.title) .fontSize(14).fontWeight(FontWeight.Bold).fontColor('"color:#6a9955">#333') .margin({ bottom: 5 }) Text(this.content) .fontSize(12).fontColor('"color:#6a9955">#666').maxLines(2) .textOverflow({ overflow: TextOverflow.Ellipsis }) } .padding(12).alignItems(HorizontalAlign.Start) .width('100%').height('100%') .backgroundColor('"color:#6a9955">#F5F7FA').borderRadius(16) .onClick(() => {"color:#6a9955">#6a9955">// 点击卡片:跳回主应用对应页面 postCardAction(this, { action: 'router', abilityName: 'EntryAbility', params: { target: 'daily_quote' } }); }) }}
"color:#6a9955">#6a9955">// module.json5 —— 刷新策略"forms": [{"name": "WidgetCard","isDefault": true,"updateEnabled": true,"scheduledUpdateTime": "10:30","updateDuration": 1,"defaultDimension": "2*2","supportDimensions": ["2*2", "2*4"]}]
逻辑我用一个 Node.js 复刻版跑过:初始 onAddForm 返回「今日金句 / 坚持就是胜利!」,第一次 onUpdateForm 后 index 推进到 1,推送「晚间思考 / 代码是写给未来的情书。」,与预期完全一致。
三、应用场景:哪些功能适合做成卡片
判断标准只有一个:用户最想看、却最懒得点开看的功能。常见落点:
•电商/外卖:桌面直接显示「快递还有 2 公里」;卡片交互分三类,靠 postCardAction 打通:
•message:在 FormExtensionAbility.onFormEvent 里处理,不切前台(如卡片内「刷新」);•call:后台静默执行(如「收藏」),用完即走。设计上记住三条:① 快照化,直接展示结果而非「点击查看」;② 微交互,支持 call 事件提升粘性;③ 视觉统一,复刻 App 的圆角、字体与配色,符合 HarmonyOS Design。
四、小结
服务卡片的本质是「FormExtensionAbility 当数据搬运工,卡片 UI 只做展示面板」。所有逻辑在 Ability 里完成,通过 formBindingData + formProvider.updateForm 推送数据,靠 postCardAction 三种事件打通卡片与主应用。把核心功能做成一张常驻桌面的卡片,你就拥有了一天几十次的「被动注意力」——这,正是日活提升 20%~200% 的秘密。
素材来源:ima「HarmonyOS」知识库 · 元服务卡片文件夹(CSDN《实战万能卡片 Service Widget》、华为云《卡片生命周期》、AI6S《ArkTS 服务卡片开发全攻略》)