什么是服务卡片与元服务
服务卡片是能放到桌面的轻量界面小窗,用户不用打开应用就能看到信息、点一下直达功能。元服务(原子化服务)则是免安装、即点即用的鸿蒙应用形态,常和服务卡片配套——卡片是入口,点进去是元服务。
服务卡片的价值:把高频信息直接摆在桌面上,缩短用户触达功能的路径。
这篇从概念到实战,把卡片开发走一遍。
卡片和原子化服务的关系
一个常规应用可以带多张服务卡片;一个元服务本身也可以配卡片作为桌面入口。卡片运行在独立的卡片容器里,资源受限、生命周期短,不能像完整页面那样常驻。把卡片当"展示加跳转"的轻前端,重逻辑仍放主应用或元服务里。
- 信息展示天气、待办、步数一眼可见。
- 快捷入口点一下直达某个功能页。
- 状态同步定时刷新最新数据。
卡片的生命周期
卡片有自己的生命周期:创建(onCreateForm)、刷新(onUpdateForm)、销毁(onDestroyForm)。用户把卡片拖到桌面触发创建,需要更新时触发刷新,移除时销毁。它不是页面,不要在里面跑长任务。
onUpdateForm: (id) => {
this.cardId = id
this.refresh()
}
用 ArkTS 写一个卡片
卡片用 ArkTS 的声明式布局写,但组件集比主界面精简。卡片页面定义在 Form 目录下,配合卡片配置 JSON 声明尺寸、预览图。一个最基本的卡片就是 Text 加一行状态。
@Entry
@Component
struct CardView {
@State msg: string = "今日 3 项待办"
build() {
Column() { Text(this.msg).fontSize(14) }
.width("100%").height("100%").padding(12)
}
}
卡片刷新与数据更新
卡片不能一直跑,靠系统定时或事件触发刷新。调用更新接口把新数据推给卡片,界面就重画。刷新频率要克制——太频繁耗电,太慢信息陈旧。常用:进入前台时刷一次,或按小时定时。
卡片点击跳转
卡片上的按钮点击,通常配置成路由事件,跳到主应用的某个页面,或拉起元服务。跳转目标和参数在卡片事件里声明,系统负责完成从卡片到应用的衔接,用户从卡片无缝进入完整功能。
卡片的形态与发布
同一张卡片可以提供小、中、大多套尺寸,用户长按切换。发布时卡片随应用或元服务一起上架,用户在卡片库里添加。设计上要为最小尺寸预留信息层级——小卡片只放最核心的数字。
- 小卡片:一句话或一个数字。
- 中卡片:列表摘要加行动按钮。
- 大卡片:更丰富的概览信息。
实战:一个待办计数卡片
卡片显示未完成待办数,点击跳到应用待办页。
@Entry
@Component
struct TaskCard {
@State left: number = 3
build() {
Column() {
Text("待办").fontSize(12)
Text(`${this.left} 项未完成`).fontSize(20)
}
.onClick(() => router.pushUrl({ url: "pages/tasks" }))
}
}
主应用在待办变化时调用卡片刷新接口更新这个数字,用户在桌面就能看到进度,点一下直接进入。服务卡片加元服务,就是这样把高频能力轻量地送到用户手边。