APP下载

浅析混合移动应用开发模式

2018-01-29罗勇赵晓霞

中国设备工程 2018年4期
关键词:页面图书混合

罗勇,赵晓霞

(四川科技职业学院互联网+学院,四川 成都 620010)

伴随社会移动化的发展,现国内各行各业纷纷推出自身官方移动应用,一方面以便于用户使用,另一方面也为行业的发展拓展了新道路。在进行移动应用的开发过程当中,开发人员通常会采取原生开发或是混合开发模式,其中原生开发模式的技术相对成熟,且用户体验较好,运行效率较高,但原生开发模式的开发门槛较高,且因不同平台间的差异性,开发跨度较大,而难以实现综合开发。而混合开发模式因具开发门槛低,可跨平台开发等优势成为当前移动应用开发的主流模式。

1 混合移动应用开发模式的优势

目前,应用于移动应用开发的模式主要有原生开发模式、Web开发模式和混合开发模式,其中原生开发模式是指于智能终端操作系统基础上,利用平台特定原生程序进行移动应用程序编写的应用开发模式,其具备完全设备访问能力,可访问移动终端所有功能,运行速度较快,性能较好,用户体验较佳,且支持图形和动画,但其开发门槛较高,范围限制较大,用户需手动下载更新,内容及应用商店有限。Web开发模式是指基于移动终端浏览器功能,利用统一标准的HTML、JavaScript、CSS等技术实施应用开发的开发模式,其适应范围较广,可应用于所有智能终端应用的开发,开发成本较低,可实现跨平台使用,且部署方便,无需升级,但使用性能体验较差,图形及动画效果不佳,无法利用应用下载盈利,必须联网,且终端设备访问受限,功能无法完全实现。混合移动应用开发模式是指在进行移动应用的开发时,同时处用程序语言及网页语言实施应用的开发,其兼顾原生开发及Web开发的特点和优势,使应用既具完全设备访问能力,保障了用户的体验度,同时又打破了各平台间的限制,实现了跨平台开发,是当前移动应用的主要开发模式。

2 HTML5技术

混合移动应用开发模式所使用的技术有很多,如 HTML、jQuery Mobile、PhoneGap、JavaScript、CSS3等,其中较为常用的有HTML、PhoneGap、JavaScript、CSS3。采取混合模式进行移动应用的开发,就其本质而言,就是在移动设备上呈现移动Web页面,而移动Web页面的开发则是利用HTML5来实现的。HTML5包括HTML、CSS和JavaScript,可提升网页的主义结构水平,赋予网页一些新功能。HTML5的支持范围较广,不仅包括较老版本的浏览器IE6、IE7,而且还包括现在主流浏览器,如360、猎豹等,尤其支持移动设备。HTML5对于移动Web页面具良好支持,其主要体现在以下方面:第一,HTML5的各类标签属性均可进行自定义,并可于属性当中修改对应标签的标识、功能、图标、运动方式等,以有效控制页面元素,同时使得代码更加精简;第二,CSS3的Media Queries可使Web页面在面对分辨率不同的屏幕时能进行自动改变,以使Web页面更好地呈现出各类移动设备上,从而提高用户体验;第三,于webkit基础上所引入的transform属性可实现Web页面的平移、放置、缩放,使页面切换效果近似于原生开发;第四,HTML5多数元素均支持Drag及Drop,用户可使用任何移动设备浏览Web页面,尤其是近些年来的触摸设备,使用户获得更好体验。

3 混合移动应用开发模式的策略

以下以国家数字移动图书馆项目为例,探讨了混合移动应用开发模式的策略。电子图书馆借阅系统主为移动用户提供移动终端电子书籍阅读服务,系统本身在《简单的面向图书馆数字内容版权管理规范》的基础上制定了电子书的借阅归还机制,并限制了用户的电子书下载量和阅读时限,有效保障了书籍作者的权益。系统的可扩展性较强,并支持各类终端、各类数据类型电子书籍阅读,如文字书、音频书、视频书等。通过移动终端,用户可随时随地借阅自己所需电子出版物。

(1)产品功能介绍。国家数字移动图书馆项目主要开发了五个模块,具体如下:①图书阅读模块:此模块主要是展现用户经借阅和购买的图书缓存,查看图书功能的实现是以PhoneGap插件方式开发的,展示功能则是用HTML+CSS3实现的,这样在进行展示时就避免了需对各类机型及操作系统进行适配的问题。图书阅读功能是以本地插件实现,可展现翻页效果、加快图书加载速度、记录用户阅读进度等,以使用户获得良好体验。②多媒体信息浏览模块:此模块为组成系统的主要模块,也是用户对多媒体资源进行查看和浏览的主要方式,包括四大子模块:图书分类浏览、热门推荐浏览、图书资源浏览和音乐视频浏览,其中图书分类浏览将系统各类图书进行了分类,用户可通过点击分类浏览相应的图书资源;热门推荐浏览依用户浏览记录和喜好以及当前的热门为用户展示了类似的图书资源;图书资源浏览为用户展示了系统中的所有图书资源;音乐视频浏览则为用户展示了音乐视频资源,用户可点击试听、观看并下载,这些模块当中浏览信息的展示均是利用HTML5的方式进行开发的。③图书借阅模块:图书借阅模块是以HTML5的方式进行开发的,结合PhoneGap的FileAPI及LocalStorageAPI实现购买功能,支付则是通过与Web服务接口进行连接,以支付宝形式实现,从而有效控制支付功能,这样支付则处于Web服务器端,使支付更加便利,也保证了支付的安全性。④个人信息管理模块:此模块主用于记录用户个人信息,以免用户每次进入应用都需重新登陆,同时还会记录用户所借阅和购买的图书、浏览信息、阅读进度等。⑤音乐视频播放模块:此模块主用于播放本地音乐视频资源,是以HTML5的Audio标签特性配合CSS3及JavaScript以实现音乐播放的控制,这不仅易于开发,而且结构美观,适用于各平台。同时利用PhoneGap Media API的JavaScript对本地API进行控制,而无需自行开发本地API,有利用户体验的提高,并避免了视频播放过程中可能会出现卡顿的情况。

(2)开发策略。国家数字移动图书馆项目应用首次开发是采取的PhoneGap框架,页面显示利用的是HTML5辅以CSS3和Jquery进行编写,图书阅读采取的是原生插件开发模式,影音播放则是采取HTML5的Audio和Video元素实现。此开发模式的用户体验较差,页面跳转会卡顿、切换导航视图会白屏。第二版的国家数字移动图书馆项目应用做了较大的改善,舍弃了很多PhoneGap插件功能,仅保留了必要插件,且使用了系统自带的Web View,这样就避免了在加载页面时需对内部特殊部件进行初始化的过程,配以原生提示框,有效提高了用户体验。图书阅读仍采取原生插件开发方式,这也有利于提高用户阅读体验。经改善后,新应用支持手势滑动,且无卡顿情况,白屏也消失了,页面跳转更流畅。

(3)混合开发模式的使用。混合开发模式的使用相对简单,主要是对Web View集成、Web页面加载及原生和HTML内容交叉链接等进行处理即可,其关键在于寻找最适用于采取原生代码进行开发的部分及适合利用HTML的Web View进行开发的部分。一般地,页面导航、返回按键这类相对简单的功能即可利用原生代码进行开发,以尽量提高用户体验,部分不太适合利用HTML进行开发,或是利用HTML进行开发也无法完善的地方,也可利用原生代码进行开发,如视频播放、绽放图片等。而系统中的多数功能都集中于信息展示当中,如Lis View展示条目、详细信息的展示等,这些功能即可利用Web View通过对Web HTML网页进行加载的方式来进行开发,因此类功能基本不会与用户产生交互,多数在于信息展示。采取混合开发模式实现移动应用的开发,其难度较低,且工作量较少,同时BUG极易修复,有效提高了移动应用开发的效率和质量。混合开发模式下的移动应用,其多数代码逻辑都处Web服务器端,开发人员可直接连接Web服务器对代码进行修改并发布,而无需经各平台应用商店的审批,大大缩短了修复BUG或是添加其他功能的时间和效率。因此,采取此模式进行开发的移动应用可实现连续部署,兼具Web移动应用和原生应用双方特征及优势。但要注意的是,混合开发模式并不适应用于所有应用的开发,如3D游戏,相比于混合开发模式,采取原生开发方式开发3D游戏的效果更佳,用户的游戏体验也更好。而针对那种重视信息处理的移动应用,如本文所提到的数字图书馆,则可采取混合开发模式,这样既可节约开发成本,同时也可提高开发质量及效率。

4 结语

总而言之,混合移动应用开发模式是当前移动应用的主流开发模式,其门槛低、具跨平台优势,实用且可伴随科学技术的发展而不断得到改进,极适用于移动应用的开发。但在实际应用过程当中,因所开发的应用功能及性质有所不同,其内部细节仍存在较大差异。为此,相关技术人员应就具体的功能和性质选择具有针对性地开发方式,灵活运用,以实现最佳开发效果,使移动应用的设计与制作能达到预期,从而促进移动应用行业的快速发展。

[1]姜翠.混合开发模式在移动校园APP中的应用研究[J].无线互联科技,2016,(01):17-19.

[2]杜帅,鄂海红,许可.混合移动应用开发模式的新策略[J].软件,2015,36(06):12-17.

[3]徐隆龙,李莹,白静.移动混合开发框架[J].计算机系统应用,2014,23(12):53-59.

猜你喜欢

页面图书混合
混合宅
刷新生活的页面
图书推荐
一起来学习“混合运算”
欢迎来到图书借阅角
班里有个图书角
油水混合
混合所有制
同一Word文档 纵横页面并存
浅析ASP.NET页面导航技术