HDC2021科技分论坛:广发证券携手HarmonyOS打造智慧金融服务HarmonyOS开发之旅带来启示~10月22日,2021华为开发者大会(Together)在东莞松山湖开幕。广发证券受邀作为技术论坛嘉宾参加了此次大会。在HarmonyOS应用与服务开发论坛上,信息技术部前端开发工程师黄勤嘉分享了广发证券原子服务的应用开发案例。图1黄勤嘉HDC大会分享1、广发证券接入鸿蒙生态随着数字时代的发展,泛终端场景下的智能化信息服务将成为大众日益迫切的需求。在跑步、健身等一些特定场景下,客户使用手机不方便,无法即时享受投资服务。针对此类场景,广发证券基于HarmonyOS原子化服务的轻量化特性,推出“营销服务”、“开户服务”、“秒答服务”三大原子服务,其中“营销服务”涵盖智能手机和智能手机。手表、“开户服务”和“秒答服务”仅限于手机。投资者只需在搭载HarmonyOS的手机服务中心搜索“GF”,将原子服务卡片添加至“我的服务”或手机桌面,点击相应卡片即可享受各项投资服务,其中包括-点击全球实时行情,免安装快速开户,学习投资理财课程,连接投资顾问等,用户点击“同步自选”,选择设备,自选行情即可转入一键上表,实现GF市场服务的无缝衔接,给用户流畅完整的沉浸式体验。丰富的服务卡片服务卡片将原子化服务/应用的重要信息以卡片的形式展示在桌面上。用户可在不同终端通过快捷手势使用卡片,通过轻交互实现直接服务。对此,广发证券开发了4类服务卡,涵盖证券开户、广发速答、股票行情、投资课程等多种规格,适用于手表、手机等不同场景,为客户提供提供多样化的个性化服务。图2服务卡的跨终端转移与自适应HarmonyOS采用服务转移的分布式运行模式,通过转移能力打破设备边界,实现多设备联动,实现原子服务转移,如跨终端设备编辑邮件及多设备协同健身、多屏游戏等分布式服务。通过嵌入转接功能,可以方便地将业务转接至不同的HarmonyOS设备,包括但不限于手表等设备,转接任务可以灵活切换和管理,实现多设备协同,为客户提供全场景多业务终端服务服务体验。根据不同终端的特点,广发证券提供不同的展示布局。如图3所示,手机大屏可以展示信息的全貌,手表小屏可以展示细化的行情信息。未来如果拓展到智慧屏等大屏,可以利用横屏同时显示更多内容。图3跨终端UX适配同时,用户还可以通过移动端授权登录,同步用户自选股票列表,实现多端服务流转,随时随地查看股票行情。如图4所示,在手表端点击同步自选股票时,手机端可以直接弹出授权提示框。点击确定后,手机中的自选股票就可以同步传输到手表中了。整个过程方便、流畅。图4跨终端协同丰富的业务卡片和跨终端互联形成一个虚拟的超级终端,将人、设备、场景有机地关联在一起,让客户实现生活中全场景触达的多个智能终端极简连接,极简交互、硬件互助等体验,用最合适的设备提供最好的金融服务体验。二、HarmonyOS应用与服务开发技术分享以下是从架构设计到具体代码交付过程中的一些思考与实践。Java还是JS?首先介绍一下技术选型。“HarmonyOS的JavaUI提供了细粒度的UI编程接口,让应用开发更加灵活;JSUI提供了相对高层的UI描述,让应用开发变得更简单。”前期调研中,广发证券发现HarmonyOS应用支持JSUI,并提供了很多组件和能力,看起来很像小程序的开发过程;并支持使用CSS。在前端开发过程中,CSS布局非常灵活高效,直接支持海量npm资源,所以广发证券决定优先使用JS。图5Java和JS模块设计对比模块设计心路历程,如图6所示,广发证券最初的想法是多种终端类型共享一个入口,但随着开发过程的逐渐深入,被发现有些配置必须按照模块进行,比如图标和竖屏模式设置。图6模块设计于是他们将模块关系改为:一个公共模块(common)+多个Entry(对应不同的终端)+多个FA(如图7)。大部分业务逻辑代码甚至图片资源都集中在common上。图7.通用模块是通用的。通过Java和JS常量共享、图片同步、npm本地依赖等,实现了JS组件在开发体验上比较完整的闭环。对此,他们还写了一个gradle脚本,实现了JS组件图片从common到referencemodule的自动同步。构建的也会自动运行npminstall以确保JS组件在目标模块中更新。一次开发,多端部署在之前的效果展示中,手机端和平板端的业务卡具有相同的功能。其实它们是同一组代码(如图8所示),但是部署在不同终端时,会根据设备类型和屏幕状态通过CSS进行调整,比如watch应用只使用了功能自选部分。图8一次性开发,多终端部署鸿蒙OS能力在实践中的应用接下来,我们来看看广发证券在开发过程中是如何使用鸿蒙OS的一些能力的。(1)组件广发证券在进行JS开发时,主要依赖SDK提供的UI组件。除了常用的div、text、image组件外,还有list、swiper、chart、tabs等交互更复杂的组件(如图9所示)。图9UI组件在这些组件中,列表组件用于显示自选股票列表;swiper和tabs提供了常用的滑动切换效果,使用起来非常方便。其中swiper用于切换自选tab和livetab,tabs用于切换课程内容。与选项卡关联的标签栏包含其课程类别列表,标签内容用于显示每个类别下的视频列表;图表组件显示简单的行情分时曲线是没有问题的。(2)JS调用PA其次,JSUI需要配套的JSAPI来提供一些底层系统能力。如果当前SDK不支持,会选择PA的方式,自己实现,提供给JS。例如以下场景:●扫码功能是Java实现的,如何将扫码结果传递给JSUI?这需要进行数据传输(代码如图10所示);●获取设备名称和APP安装状态的能力需要通过Java代码实现;图10JS调用PA另外,前面提到的Java和JS代码共享功能也应用在图11中:左边是JS调用PA。通过ShareConst的使用,可以从编码上统一请求代码(code),避免可能的人为错误导致与Java功能不一致。图11Java和JS代码共享(三)跨终端协同最后分享鸿蒙OS一个值得一提的特性——跨终端协同。跨设备协同通过分布式软总线连接不同类型的设备,通过简单的API进行灵活的相互调用。需要注意其使用条件:同一华为账号、动态申请权限、指定设备ID、指定跨终端Flags。三、展望鸿蒙OS的超级终端和轻量级原子服务理念,将给整个金融生态带来巨大的改变。为此,广发证券将秉承??开放融合的理念,围绕1+8+N全场景智慧生态拓展智慧服务新触点,深入探索和研究鸿蒙操作系统带来的新技术和服务方式,并进一步加快金融产品运营与鸿蒙系统之间的融合;从产品、技术、场景的合力打造万物智能服务新体验,构建更加开放融合的金融科技新生态,为每一位客户提供更便捷、更有价值的财富管理服务。
