json卡片代码(卡片代码生成器)

背景 随着华为HarmonyOS2.0的发布,各大厂商纷纷抢先与华为展开合作。优酷作为国内领先的长视频在线视听平台,与华为公司长期以来保持紧密的合作,共同为消费者带来优质的影音娱乐体验。因此,优酷技术团队也在第一时间投入对鸿蒙系统以及鸿蒙开发者SDK的研究。优酷技术团队经过多轮的头脑风暴,利用鸿蒙的某些新特性展开鸿蒙应用开发的尝试。 鸿蒙OS支持应用以Ability为单位进行部署。Ability分…

背景

随着华为Harmony OS2.0的发布,各大厂商纷纷抢先与华为展开合作。优酷作为国内领先的长视频在线视听平台,与华为公司长期以来保持紧密的合作,共同为消费者带来优质的影音娱乐体验。因此,优酷技术团队也在第一时间投入对鸿蒙系统以及鸿蒙开发者SDK的研究。优酷技术团队经过多轮的头脑风暴,利用鸿蒙的某些新特性展开鸿蒙应用开发的尝试。

鸿蒙OS支持应用以Ability为单位进行部署。Ability分为两种类型:FA(Feature Ability)和PA(Particle Ability)。FA/PA是应用的基本组成单元,能够实现特定的业务功能。FA有UI界面,而PA无UI界面。

每种类型为开发者提供了不同的模板,以便实现不同的业务功能。

鸿蒙OS的应用软件包以APP Pack(Application Package)形式发布,它是由一个或多个HAP(HarmonyOS Ability Package)以及描述每个HAP属性的pack.info组成。HAP是Ability的部署包,HarmonyOS应用代码围绕Ability组件展开。

优酷鸿蒙开发实践 | 鸿蒙卡片开发

鸿蒙工程通过鸿蒙打包工具链打包后,其产物格式即为HAP。

当前,包含有鸿蒙FA/PA的优酷鸿蒙版已经在华为鸿蒙应用市场上架,鸿蒙混合包在应用市场上会显示为“含HarmonyOS服务”。如果App是100% Pure鸿蒙App,其Icon右下角会有HMOS字样。

在手机桌面上的优酷Icon轻轻上滑,会弹出一个鸿蒙卡片,向用户推荐最近的热剧,点击卡片能快速拉起半屏落地页显示更多信息,点击落地页则跳转到优酷客户端的相应落页面。

点击卡片上的图钉按钮,还可以将这个FA卡片固定在桌面上。

优酷鸿蒙开发实践 | 鸿蒙卡片开发
优酷鸿蒙开发实践 | 鸿蒙卡片开发

这个FA是100%利用鸿蒙API编写的,可以脱离优酷主客独立运行。由于FA卡片有极其严格的体积限制,而使用native的库体积则会过大。最终,我们的Widget 通过一个Webview,加载JS版本的前端网络库去请求优酷内部的网络接口,获取到数据后再使用鸿蒙的Native图形图像API去绘制Native界面。

这个桌面Widget与iOS桌面Widget的区别在于,它不依赖于优酷主客即可运作。即使优酷主客不被启动,卡片的数据也能够更新。

鸿蒙卡片的开发模式

在鸿蒙系统上,触摸优酷主客的应用图标向上滑动,可以唤起优酷的鸿蒙卡片。实现这一点需要卡片的实现代码与优酷主客做混合打包,一起提交到应用市场。

而如果要实现服务中心免安装使用,则需要卡片的独立包总大小要小于10M。这一体积限制使得很多Native 库都无法引入,否则无法将体积控制在红线之内。

最终,优酷鸿蒙卡片的代码放在一个工程中,方便跟优酷主客进行混合打包。同时,优酷鸿蒙卡片的代码仅依赖极少数的二、三方库(例如JSON解析、图片缓存等),以减小体积。

卡片样式

鸿蒙系统提供4中大小不同的卡片,根据占用桌面图标数量的不同,分别是: 1×2、2×2、2×4、4×4。优酷卡片实现了其中两种: 2×2和2×4,其中2×2的卡片是必选项。

下图显示了两种不同样式的卡片,以及不同的出现场景。

桌面 服务中心 发现
优酷鸿蒙开发实践 | 鸿蒙卡片开发 优酷鸿蒙开发实践 | 鸿蒙卡片开发 优酷鸿蒙开发实践 | 鸿蒙卡片开发

声明卡片

跟Android的应用微件类似,鸿蒙的卡片也需要在一个配置文件中声明。在一个鸿蒙应用中,每个模块都有自己的配置文件,位于该模块的代码main目录下,名字为config.json。

在配置文件中,每个模块有一个abilities属性,其值是一个数组,数组的每一个对象都定义了一个Ability。卡片就定义在其中一个Ability中:

{
  ...
        \"formsEnabled\": true,
        \"forms\": [
          {
            \"landscapeLayouts\": [
              \"$layout:youku_widget_2_2\",
              \"$layout:youku_widget_2_4\"
            ],
            \"isDefault\": true,
            \"defaultDimension\": \"2*2\",
            \"name\": \"youku_widget\",
            \"description\": \"$string:yk_widget_description\",
            \"colorMode\": \"auto\",
            \"type\": \"Java\",
            \"supportDimensions\": [
              \"2*2\",
              \"2*4\"
            ],
            \"portraitLayouts\": [
              \"$layout:youku_widget_2_2\",
              \"$layout:youku_widget_2_4\"
            ],
            \"updateEnabled\": true,
            \"updateDuration\": 1
          }
        ],
  ...
}

鸿蒙系统中,卡片用Form来表示。上述声明中,formsEnabled用于指示这个Ability是用于定义卡片的。forms数组用来定义一系列的卡片。通常多个卡片可以定义在一个数组元素中。其中landscapeLayouts、portraitLayouts、supportDimensions用于定义卡片的布局文件和大小,updateEnabled、updateDuration用于控制卡片的数据更新,updateDuration的单位是半小时。

生命周期

在鸿蒙系统上,卡片的生命周期比普通的Page Ability要简单很多,只有三个相关的回调:

/**
 * 创建卡片时的回调。
 * 在intent中,存有创建卡片的一些重要参数,可以通过Intent.getXXXParam()方法获取。
 * AbilitySlice.PARAM_FORM_IDENTITY_KEY: long类型,用于唯一标识一个卡片
 * AbilitySlice.PARAM_FORM_NAME_KEY: String类型,卡片名称,即在config.json中定义的name属性
 * AbilitySlice.PARAM_FORM_DIMENSION_KEY: int类型,卡片大小标识,
 * 取值范围是1-4,分别表示1x2、2x2、2x4、4x4
 */
protected ProviderFormInfo onCreateForm(Intent intent)

/**
 * 更新卡片时的回调。
 * 这里的formId就是onCreateForm中的AbilitySlice.PARAM_FORM_IDENTITY_KEY参数。
 */
protected void onUpdateForm(long formId)

/**
 * 删除卡片时的回调。
 * 这里的formId就是onCreateForm中的AbilitySlice.PARAM_FORM_IDENTITY_KEY参数。
 */
protected void onDeleteForm(long formId)

传输卡片内容

卡片的创建和显示通常由桌面(或者服务中心、搜索)发起,而决定显示内容的是优酷卡片这个模块,内容提供方和显示方不在同一个进程,甚至由不同开发者开发。在Android上也是一样的情况。

在这种情况下,一般都是内容提供方通过远程View的方式将内容渲染到内容显示方的,鸿蒙系统上这个跨进程的数据传输行为是由ComponentProvider来实现的。

创建ComponentProvider有两种方式:

// 第一种: 在onCreateForm()时,先创建一个卡片对应的ProviderFormInfo实例。
// 再通过ProviderFormInfo的实例拿到向它传输数据的ComponentProvider。
ProviderFormInfo form = new ProviderFormInfo(layoutId, context);
ComponentProvider cp = form.getComponentProvider();

// 第二种: 在onUpdateForm()时,直接创建出一个ComponentProvider。
ComponentProvider cp = new ComponentProvider(layoutId, context);

需要注意的问题 1

其中设置IntentAgent时需要注意,通常一个布局中会有多个View来覆盖根布局的矩形区域。如果设置了IntentAgent的View没有覆盖满根布局,则未覆盖区域被点击时,系统也会响应点击,默认调起这个卡片所属的Ability,传入的Intent只包含formId。

针对这个默认调起的Ability,一般有两种方式解决:一是确保设置了IntentAgent的View覆盖满根布局;二是Ability提供兜底方案,例如页面做成透明,并且自动退出。

需要注意的问题 2

在创建IntentAgent时,需要提供一个IntentAgentInfo实例。这个IntentAgentInfo创建时的第一个参数是一个int类型的请求代码,这个代码必须保持各个卡片的不同点击区都不一样。否则后设置的IntentAgent会覆盖先前设置的同一请求代码的IntentAgent。

需要注意的问题 3

如果是跟优酷主客混合打包,卡片的布局文件中,View的id必须跟主客中所有的id不同,否则系统会无法正确更新布局文件中对应的View。

打开中转页

由于系统的限制,点击卡片打开的页面必须是纯鸿蒙应用中的页面,无法直接打开Android应用页面。优酷卡片的点击,目的是打开优酷主客的播放页。

在这里我们做了分类:

  • 当用户未安装优酷主客时,显示一个中转页,提供下载按钮供用户跳转到华为应用市场去下载优酷主客,当用户安装完优酷主客回来时,下载按钮变成选集列表,对单集视频则变成播放按钮;
  • 当用户已安装优酷主客时,中转页自动打开优酷主客的播放页,并退出。

数据请求

在优酷主客中,网络数据的请求都是通过统一的网络库访问的。由于优酷鸿蒙卡片并未集成网络库,优酷鸿蒙卡片必须使用其他方式请求网络接口。

要实现在鸿蒙上发起数据请求,有两个方案:

  • 一是针对每个数据请求接口,封装一个新的HTTP Open API接口,客户端可以通过HTTP(S)直接访问;
  • 二是客户端通过H5页面里的JS版Network库发起数据请求。

考虑到将来在鸿蒙系统上有可能实现更多其他的需求,且第一种方案有安全性的风险,所以最终我们采用了第二种方案。

前端业务使用的JS版本的网络库,其使用方式是通过JS中的Promise机制来实现异步回调,但是这种方式在Java中并不好实现对应的调用结构。所以这里需要有一层封装,将网络请求结果通过简单回调来通知请求方。相应的在Java侧需要对WebView注册全局的JS对象,实现JS对象的回调方法,打通JS -> Java的调用通路。

这个方案在纸面上看着还不错,但是在实际使用中会发现有严重的性能瓶颈。WebView本身是一个很重的控件,在进程中首次创建的时候会比较耗时,有很多的so加载、初始化等工作。加载HTML是一个网络请求,耗时在百毫秒级,而加载并解析完HTML以后,还要再加载JS版本的网络库,又是一次网络访问。等JS网络库加载并解释执行后,才可以正常服务调用方。

要在这个过程中进行优化,这里有主动权的地方就是加载HTML和JS网络库这两个文件。在鸿蒙系统中,WebView可以通过设置WebAgent来实现特定URL的劫持,将其转化为读取本地资源中的HTML和JS文件。

public class LoadAgent extends WebAgent {
    // ...

    @Override
    public ResourceResponse processResourceRequest(WebView webView, ResourceRequest request) {
        // mInterceptor用于识别HTML和JS网络库的URL,并返回本地资源中的HTML和JS。
        ResourceResponse response = mInterceptor.intercept(request);
        if (response != null) {
            return response;
        }
        return super.processResourceRequest(webView, request);
    }
}

这可以将两个百毫秒级的串行操作缩减为毫秒级,大大减少JS版本的网络库的初始化时间。

数据缓存

从网络请求返回的卡片数据,除了用于即时渲染卡片之外,还会被保存一份到本地存储中。如果下一次发起网络请求的时候,无法正常访问网络(例如手机重启后一时连不上网络),则可以使用缓存中的卡片数据先渲染一下,使用户不至于完全看不到内容。这就需要有一套卡片数据的缓存管理能力。

针对卡片数据的特点,我们使用了两个数据库表来存储卡片的缓存数据。根据卡片大小不同,请求中会提供不同的参数给服务端。反过来说,同样大小的卡片发出请求的参数是相同的,也就是说同样大小的卡片请求得到的数据是相同的。所以有一个表用来存储不同大小的卡片数据,每个卡片大小对应一条记录,包括唯一标识、卡片大小、请求返回的数据、时间戳等。

系统不限制用户向桌面添加卡片的数量,同时在服务中心也可以有已经添加到桌面的卡片。所以同样的卡片数据是可以被显示在多个卡片上的。数据库需要有一个表来记录每一个卡片的信息,包括卡片的唯一标识、卡片大小、数据表中对应的记录等。

优酷鸿蒙开发实践 | 鸿蒙卡片开发

如果在Android中实现过ContentProvider,一般都会比较熟悉SQLite数据库。通常ContentProvider需要管理大量、不同类型且互相有关联的数据,这种需求用SQLite来实现最合适了。这里管理卡片数据的缓存也具有同样的特征,并且鸿蒙系统也提供了SQLite数据库的使用接口。典型的数据库初始化操作如下:

// StoreConfig最常见的作用是配置数据库名字。也可以配置存储模式、加密等高级需求。
StoreConfig config = StoreConfig.newDefaultConfig(DB_NAME_FORM_STORE);

// RdbOpenCallback用于定义创建数据库、升级数据库结构版本等时机的回调。
RdbOpenCallback callback = new FormStoreOpenCallback(context);

DatabaseHelper helper = new DatabaseHelper(context);

// RdbStore是数据库的封装类,最终的增删改查操作都通过它来进行。
RdbStore store = helper.getRdbStore(config, CURRENT_VERSION, callback);

具体的增删改查操作就不一一列举了。

数据更新

前面声明卡片一节提到了config.json中,updateEnabled、updateDuration定义了卡片的数据更新机制。

其中updateEnabled用于指定是否通过系统来自动更新卡片数据,如果希望由应用自身触发数据更新,这个可以设置为false。优酷卡片的场景是希望系统能够自动更新卡片数据的,所以设为了true。

在updateEnabled设为true的情况下,updateDuration才有意义。updateDuration用于指定更新的时间间隔。鸿蒙系统还支持固定时间更新,通过指定scheduledUpateTime来设置更新时间。updateDuration和scheduledUpateTime只能选择其中一种方式。

优酷卡片选择了用updateDuration指定更新间隔。为了避免将来使用卡片的用户多了,对服务端产生过大的压力,更新间隔被控制在4小时,这样用户在上午、下午、晚上等不同时段去看卡片时,内容都会有更新。

但是有些情况下,优酷卡片自身的逻辑也会更新卡片数据,所以为了避免两种更新策略冲突而导致更密集的更新,或者长时间不更新,updateDuration被指定为1,即每半小时系统就会调用一次onUpdateForm()。在onUpdateForm()中,会判断上一次实际发生更新的时间,使更新间隔保持在4小时左右。

容错处理

考虑到一些极端情况,例如用户安装优酷后,在没有网络的情况下就添加了桌面卡片。此时卡片的数据请求是没有返回的,同时由于刚安装,也没有缓存数据,所以卡片展示不出任何数据,只有灰色的打底图作为背景。此时如果点击卡片,也没有任何视频信息,也就无法跳转到某个特定视频的播放页,只能显示一个加载失败的提示,等用户网络恢复后,通过刷新得到有效数据。

空白卡片 点击卡片后的空白页面
优酷鸿蒙开发实践 | 鸿蒙卡片开发 优酷鸿蒙开发实践 | 鸿蒙卡片开发

展望

现在优酷鸿蒙版的桌面卡片已经随着鸿蒙系统的发布,正式上线了。在鸿蒙系统的手机上,从华为应用市场安装的优酷主客就已经附带了优酷卡片的能力。

由于这是一个全新的开发技术栈,早期发布的应用肯定会有一些改进空间。从现在看来主要有以下一些方面:

  1. 性能
    由于数据请求和埋点用到了JS库,并且在WebView中运行,这使得运行时效率比Java要低,还要处理WebView与外界的交互,对性能有较大影响。虽然已经有了一些措施来减少这方面的影响,但是后续还是需要继续挖掘潜力
  2. 监控
    后续还需要补足JS侧崩溃等信息收集的能力。
  3. 线上配置能力
    优酷主客可以通过各种远程配置平台下发各种配置信息。而鸿蒙上由于体积限制无法自带相关的库。今后需要考虑使用其他方式实现远程配置能力。

最后,10月20日将上线《优酷鸿蒙开发实践》系列技术文章第二篇,为大家介绍如何实现Android/鸿蒙混合打包的流程。感谢关注,我们下篇技术实践再见。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(0)
上一篇 2022年5月13日 下午4:03
下一篇 2022年5月13日 下午4:04

相关推荐

  • 网络推广有哪些渠道,整站优化推广公司

    1、qq群网站推广法。注册qq,然后用qq加入几十个群,每天发一遍网站。如果qq更多,加入的群更多,加入的是大群,每个群的人数更多,则宣传效果更好。即使排除不在线的qq用户,效果也不容低估。要忍辱负重,不怕被踢。另外就是在QQ群是是可以发群邮件的,您可以将其产品做成精美的贺卡上面加上您的推广地址。 2、软文网站推广法。写文章,或者引用好文章,里面巧妙地加入自己的网址。 3、博客网站推广法。软文要有…

    2022年6月30日
    620
  • 苹果手机如何删除通讯录联系人(批量删除只需一招)

    一般大家联系好友时一般都会使用微信、QQ,但是在没有网络的情况系,电话联系显然更方便。不过,如果手机里的通讯录被删除了我们该怎么办?怎么找回苹果手机丢失的通讯录?一起来看看吧! 方法一:SIM卡 如果你的通讯录联系人都保存在SIM卡中,使用SIM卡就能直接恢复通讯录。 具体步骤:打开苹果手机设置->通讯录->导入SIM卡通讯录 方法二:iCloud 如果手机里的通讯录不见了,可以先确认下自己是否开…

    2022年6月2日
    820
  • 站外优化包括哪些,站外优化的作用及重要性

    在上一篇文章中,我们讲述了关于站内优化的几个技巧(点击查看:亚马逊卖家注意!学会这些站内优化技巧还怕店铺流量低?),所以今天我们来说说站外如何优化。 一、主动销售 1.创建EDM邮件列表 用MailChimp,在你的自有网站或者第三方平台,创建一个邮箱注册页面,然后收集你的潜在用户的邮件列表,给他们发销售类,或者相关客户感兴趣的内容。 2.主动获取顾客列表 通过第三方渠道获得目标细分用户的邮件列表…

    2022年7月6日
    610
  • 怎么下载b站视频,超好用的操作指南

    经常混B站的小伙伴都会面临这样的一个问题,就是如何在B站下载视频?今天帅比就来教大家一个简单粗暴的方法(只针对电脑党) 第一步:点开你所要下载的视频 第二步:在bilibili后面加上jj两个字母,然后点击回车键 第三步:点击回车键后就会跳转到下载页面 第四步:点击对应的动画集数即可下载 小伙伴们get到了吗?

    2022年9月4日
    720
  • 在淘宝购物如何省钱,淘宝购物省钱秘诀

    今年的天猫双十一成交额达到2684亿元,再次突破历史记录,这么多的交易额中你又贡献了多少呢?反正我是贡献了上千块的,不过我还是省了不少钱的,想知道怎么省钱吗?下面我来介绍介绍。 图片来源于网络 我想大家经常网购的人是不是直接打开淘宝就买了呢?原先我也是这样做的,直到我接触到了一款APP软件—粉象生活,我就非常懊恼不已,为什么不早点了解这个APP呢,自己白白浪费了那么多的钱。这个粉象生活APP到底有…

    2022年7月11日
    580
  • seo专业优化公司哪家好,选择seo优化公司的基础知识

    企业在互联网上,进行seo优化能够让企业信息抵达世界各个角落。由此同时带来的效果是,可以不被竞争对手的网站抢占先机,在网络时代任何一家企业都希望自己可以尽可能多的掌握客源。那么应该如何去选择一家靠谱的优化外包公司呢? 一、看口碑 口碑关于企业选择公司是十分重要的,由于有技术和实力才干积聚良好的口碑。企业能够先理解公司的案例,在行业和能力上也更加突出。可以依据企业所提供相应的资料。一般来说在网上口碑…

    2022年7月14日
    590
  • 抢夺罪一般判几年(抢夺罪最高判几年)

    抢夺罪与抢劫罪仅仅一字之差,抢夺罪是抢夺财物而引起的犯罪行为,抢劫罪也是抢财物的行为,这两者之间有什么区别呢?在刑法上对于抢夺罪的处罚包括有期和无期等刑期,那么对于抢夺罪的最轻处罚是什么?接下来华律邀请黄天余律师为您解答。 问题一:"犯抢夺罪最轻的处罚是什么?"黄天余律师解答: 依据我国《刑法》第二百六十七条关于抢夺罪的规定,抢夺公私财物,数额较大的,或者多次抢夺的,处三年以下…

    2022年4月19日
    950
  • 哪有贝壳粉涂料,盘点中国十大贝壳粉生产基地

    大家好,“贝壳粉行业十大品牌考察”栏目访谈,很荣幸邀请到美博士贝壳粉的总裁安总接受我们的采访,下面就听一下安总是怎么回答的,到底我们的美博士贝壳粉有什么优势才足以让它一直名列前茅呢? 1、美博士贝壳粉是从什么时候开始成立的呢? 答:2017年7月25日,美博士贝壳粉在深圳前海股权交易中心正式上市,美博士品牌进入一个全新的发展时期。 总部照片 2、对于环保内墙壁材,能否介绍一下它在中国的发展历程? …

    2022年9月7日
    750
  • 动态无人值守称重系统价格(地磅无人值守系统流程)

    今迈无人值守智能称重管理系统采用智能电子衡防盗报警仪可以记录遥控器告警信息。可以通过窗口与电脑连接,用软件对干扰信号进行过滤。配合防遥控器软件,断电时或非法关机时,软件系统自动提示,并且软件记录计量防控检测仪的开关机时间。 无人值守地磅软件 在过毛重、过皮中、门卫检查等关键环节进行自动拍照,照片跟随过磅单自动存入照片库,供领导随时查看。系统并且能够自动识别分拣某一过磅单对应的录像资料,照片库可进行…

    2022年5月11日
    710
  • 浏览器怎么设置主页,只需一招轻松更改

    一般来说,浏览器的主页大多数人可能选择浏览器默认的,很多人根本不去设置自定义主页。既便是360浏览器的主页也可以改成自定义的。 维修电脑过程中,常常看到人们电脑上的浏览器主页很不好用,查找东西或者搜索很不方便。 浏览器主页设置很简单。打开某一浏览器,右上角有三个小点或横或竖,有的是三横横。进去以后找“选项”或者“设置”,有的浏览器是选项,有的是设置。以火狐浏览器为例,火狐是点选项进去的。然后点左面…

    2022年10月5日
    470

发表回复

登录后才能评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信