【中软国际】HarmonyOS 基于Java开发的服务卡片 原创 精华
服务卡片介绍:
服务卡片是将重要信息或操作前置的一种界面展示,目的是减少体验层级,服务直达,增强用户交互体验。
卡片基本信息说明:
- 卡片使用方
显示卡片内容的宿主应用,控制卡片在宿主中展示的位置。
- 卡片管理服务
用于管理系统中所添加卡片的常驻代理服务,包括卡片对象的管理与使用,以及卡片周期性刷新等。
- 卡片提供方
提供卡片显示内容的HarmonyOS应用或原子化服务,控制卡片的显示内容、控件布局以及控件点击事件。
以下是官方提供的运作机制:
项目介绍:
本篇主要对系统时间日期来展示服务卡片,该Demo是Java为基础,无JS相关代码,以下将对项目详细介绍。
项目目录如下:
database中FormBean是所需的bean文件并设置数据库表名,包含卡片的id、名称以及布局id,FormDatabase是bean绑定Orm数据库类。
Slice中MainAbilitySlice与TimeCardSlice是展示页面,MainAbilitySlice是创建项目系统生成,我设置初始化页面为TimeCardSlice。
Utils中是分别是卡片工具类、数据库工具类、日期工具类。
MainAbility以及MyApplication也是创建项目系统生成的。
注意MainAbility中的setMainRoute可以设置指定初始化页面。
TimerAbility是一个服务类,用来更新卡片时间。
配置文件如下:
forms内属性说明:
属性名称 | 子属性 | 含义 |
---|---|---|
name | - | 表示卡片的类名。 |
description | - | 表示卡片的描述。取值可以是描述性内容,也可以是对描述性内容的资源索引,以支持多语言。 |
isDefault | - | 表示该卡片是否为默认卡片,每个Ability有且只有一个默认卡片。 true:默认卡片。 false:非默认卡片。 |
type | - | 表示卡片的类型。取值范围如下: Java:Java卡片。 JS:JS卡片。 |
colorMode | - | 表示卡片的主题样式,取值范围如下:auto:自适应。dark:深色主题。light:浅色主题。 |
supportDimensions | - | 表示卡片支持的外观规格,取值范围:1×2:表示1行2列的二宫格。2×2:表示2行2列的四宫格。2×4:表示2行4列的八宫格。4×4:表示4行4列的十六宫格。 |
defaultDimension | - | 表示卡片的默认外观规格,取值必须在该卡片supportDimensions配置的列表中。 |
landscapeLayouts | - | 表示卡片外观规格对应的横向布局文件,与supportDimensions中的规格一一对应。 |
portraitLayouts | - | 表示卡片外观规格对应的竖向布局文件,与supportDimensions中的规格一一对应。 |
updateEnabled | - | 表示卡片是否支持周期性刷新,取值范围:true:表示支持周期性刷新,可以在定时刷新(updateDuration)和定点刷新(scheduledUpdateTime)两种方式任选其一,优先选择定时刷新。false:表示不支持周期性刷新。 |
scheduledUpdateTime | - | 表示卡片的定点刷新的时刻,采用24小时制,精确到分钟。 |
updateDuration | 表示卡片定时刷新的更新周期,单位为30分钟,取值为自然数。当取值为0时,表示该参数不生效。当取值为正整数N时,表示刷新周期为30*N分钟。 | |
formConfigAbility | - | 表示卡片的配置跳转链接,采用URI格式。 |
metaData | - | 表示卡片的自定义信息,包含customizeData数组标签。 |
customizeData | - | 表示自定义的卡片信息。 |
name | 表示数据项的键名称。 | |
value | 表示数据项的值。 |
先上效果图:
代码详解:
下面开始项目解析:
首先介绍MainAbility主页,主要方法有onStart,onCreateForm,onDeleteForm
接下来就是TimeCardSlice页,进行时间获取展示,并使用计时器来进行刷新页面
最后是TimerAbility页,主要是对服务卡片进行刷新操作
重点是这个方法,进行更新数据
注意:Java卡片与JS卡片选型指导,官方提倡使用JS来实现卡片,支持的控件和场景都很丰富
Java/JS卡片场景能力差异如下表所示:
场景 | Java卡片 | JS卡片 | 支持的版本 |
---|---|---|---|
实时刷新(类似时钟) | Java使用ComponentProvider做实时刷新代价比较大 | JS可以做到端侧刷新,但是需要定制化组件 | HarmonyOS 2.0及以上 |
开发方式 | Java UI在卡片提供方需要同时对数据和组件进行处理,生成ComponentProvider远端渲染 | JS卡片在使用方加载渲染,提供方只要处理数据、组件和逻辑分离 | HarmonyOS 2.0及以上 |
组件支持 | Text、Image、DirectionalLayout、PositionLayout、DependentLayout | div、list、list-item、swiper、stack、image、text、span、progress、button(定制:chart 、clock、calendar) | HarmonyOS 2.0及以上 |
卡片内动效 | 不支持 | 暂不开放 | HarmonyOS 2.0及以上 |
阴影模糊 | 不支持 | 支持 | HarmonyOS 2.0及以上 |
动态适应布局 | 不支持 | 支持 | HarmonyOS 2.0及以上 |
自定义卡片跳转页面 | 不支持 | 支持 | HarmonyOS 2.0及以上 |
综上所述,JS卡片比Java卡片支持的控件和能力都更丰富:
- Java卡片:适合作为一个直达入口,没有复杂的页面和事件。
- JS卡片:适合有复杂界面的卡片。
完整代码如下:
MainAbility.java
TimeCardSlice.java
FormBean.java
TimerAbility.java
FormDatabase.java
ComponentProviderUtils.java
DatabaseUtils.java
DateUtils.java
git地址:https://gitee.com/fzyme_admin/time-card.git
更多原创内容请关注:中软国际 HarmonyOS 技术学院
入门到精通、技巧到案例,系统化分享HarmonyOS开发技术,欢迎投稿和订阅,让我们一起携手前行共建鸿蒙生态。
作者:任鹏飞
最近中软的老师们都十分高产呀
期待继续更新HarmonyOS干货
分享干货共同成长,推进鸿蒙生态发展,加油!
干货满满
学到了!
可以可以,一目了然
对于初学的我帮助非常大,谢老师的分享
不错!
非常详细
干货满满的啊