立即注册
查看: 687|回复: 1

[鸿蒙OS技术分享] HarmonyOS服务卡片架构与卡片模板介绍

已绑定手机
发表于 2021-8-5 11:36:26 | 显示全部楼层 |阅读模式 来自 广东省深圳市
目录
1. 服务卡片的定义和定位
2. 桌面服务卡片简介、UX交互和设计规范
3. 桌面服务卡片的架构方案介绍
4. 服务卡片模板介绍
5. 通过模板快捷实现服务卡片业务功能和效果

1、服务卡片的定义和定位
服务卡片: 服务卡片是原子化服务或者HarmonyOS应用 的一种界面展示形式,将重要信息或交互前置 到卡片,以达到服务直达,减少用户体验层级 的目的。 服务卡片可以嵌入到桌面或者服务中心(当前 只支持系统应用)中作为其界面的一部分显示, 并支持拉起页面、发送消息等交互功能。
2.jpg

服务卡片的优势:
1.范围广:应用可以内嵌服务卡片,不仅限于桌面
2.便捷:操作简洁,快捷添加
3.跨设备:原子化自适应能力,跨设备无缝流转

2、桌面服务卡片介绍
服务卡片在桌面上有临时和常驻两种状态,临时态卡片以轻量、 便捷的方式向用户展示服务内容,即用即走的操作体验能保证 不破坏现有桌面使用习惯下达到服务直达的目的,而常驻态又 能满足用户对服务内容的持续关注。
临时显示:桌面图标上滑快捷展示当前应用的服务卡片,右上 角有 Pin 的图标标识,操作卡片以外的区域能收起卡片。
常驻显示:点击临时态卡片 Pin 的图标可将卡片固定到桌面 上常驻显示,用户还可以通过拖动服务卡片到桌面常驻显示。

桌面服务卡片的UX交互方式:
1.上滑 APP 图标显示临时态卡片 注:支持服务卡片的应用具备显著的 特征,底部有小白横条;
2. 点击 Pin 钮在桌面常驻显示
3. 长按卡片/更多服务卡片 管理添加其他尺寸的卡片
4. 长按应用图标/更多服务 卡片选择上滑的默认卡片
5. 长按卡片/移除,可以移 除常态卡片

桌面服务卡片的跳转规则:
1. 服务卡片点击可进行界面跳转,跳转至对应原子化服务或应用内 界面;
2. 当用户进入到原子化服务或应用界面时,返回到桌面,再此对卡 片进行点击时,仍然会到对应原子化服务或应用界面,而不是上次 停留的界面;
3. 从服务界面返回到桌面时,服务窗口应该先回到当前卡片的位置, 而不是App 图标的位置,遵循从哪来到哪去的基本原则;
4. 不要在卡片内通过点击或其他操作后出现弹窗、半模态等其他操 作界面,卡片是拉起服务的主要入口,避免不一致的交互行为;
1.jpg

3、桌面服务卡片的架构方案介绍
3.1、桌面、服务卡片和系统框架的架构
3.jpg
架构说明:
1. HarmonyOS新增Ability Form系统服务和框架,提供了对于 服务卡片信息的管理、卡片刷新等能力;
2. 实现了从其他应用添加服务卡片到桌面的接口,如左图的服务 中心可以利用桌面提供的接口,将服务卡片添加至桌面的空白位 置;
3. 服务卡片是基于Ability的能力,应用提供卡片,卡片框架支持 Java/JS两种宿主模式,以各自的实现完成卡片绘制。

更多详细内容请下载附件查看
游客,如果您要查看本帖隐藏内容请回复
已绑定手机
发表于 2021-8-5 20:06:05 | 显示全部楼层 来自 湖南省长沙市
谢谢分享!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

合作/建议

TEL: 19168984579

工作时间:
周一到周五 9:00-11:30 13:30-19:30
  • 扫一扫关注公众号
  • 扫一扫打开小程序
Copyright © 2013-2024 一牛网 版权所有 All Rights Reserved. 帮助中心|隐私声明|联系我们|手机版|粤ICP备13053961号|营业执照|EDI证
在本版发帖搜索
扫一扫添加微信客服
QQ客服返回顶部
快速回复 返回顶部 返回列表