基于HTML5实现智能手机跨平台应用开发
作者：武佳佳　王建忠
来源：《软件导刊》2013年第02html手机网站期
        摘 要：为了解决WP7、Android及iPhone应用程序开发的不一致性，即每种平台开发语言到开发环境完全不同的问题，提出使用HTML5来解决封闭性的方法，提高了三大职能应用程序开发的效率，同时，使用开源PhoneGap开源框架进行了验证。
        关键词：HTML5；Android；Iphone；Window Phone7；PhoneGap
        中图分类号：TP319 文献标识码：A 文章编号：16727800（2013）002006602
        0 引言
        随着智能手机的普及，各种类型的应用迅速面市，给手机用户带来更多全新体验。目前市面上常见的有Android、iPhone及WP7智能手机系统。三种手机系统几乎占据了智能手机系统全部份额。正因如此，吸引了更多的开发者进入到智能手机应用开发的行列。但是由于三种手机系统各自为政，任何一种应用都需要对三种系统进行不同平台开发，给开发者带来了时间和
经济浪费，增大了企业开发成本。本文探讨基于HTML5、Java Script及CSS进行应用程序开发，做到一次开发，在多个手机系统上部署运行。
        1 智能手机应用开发的封闭性
        Android、iPhone及WP7手机在应用开发的编辑环境、开发语言及手机系统都是完全不同的，如图1所示。
        从图1可知，Android系统是基于Linux操作系统，iPhone手机系统是从Unix发展而来，WP7是使用的Windows phone手机系统。WP7使用的是C#，自动内存管理、应用程序采用Silverlight框架、游戏采用XNA框架；Android使用Java语言，大部分类库兼容原来Sun的Jave SE，与C#相同Java执行也是采用的虚拟机，效率比较接近。iPhone使用 Objective C，运行效率和标准C差不多，无论是C#还是Java在运行效率和内存占用上都无法与Objective C相比。 WP7开发工具Visual Studio 2010操作便利，设计、编码、调试、发布全集成，相比而言，Android的Eclipse在速度、用户体验上就相对逊。iPhone的Xcode与WP7的开发工具功能性相近， 都有非常出的代码智能提示和用户体验。
        目前，智能手机操作系统是连接硬件和应用程序的必经环节，每种应用程序依靠操作系统自带的SDK（software develop kit）来调用硬件处理和计算能力，操作系统在三种智能手机发展中扮演了核心角。但是如图1中描述的情况，各种智能系统底层是完全不同的，造成了在开发手机应用程序时无法保证通用性。正如我们常常看到的情况，在展示手机应用时会出现Android版、iPhone版及WP7版。这样对用户来说如果拥有两种以上智能手机系统时，就需要下载并区分不同版本内容。更不便的是对于研发来说造成经济及时间的浪费，降低了开发效率。这种状况不仅跟互联网的开放理念相背离，也对应用开发商造成了现实的困扰。
        2 解决封闭之道
        基于以上背景，亟待一种可以解决的方法出现。基于浏览器的HTML5等标准快速崛起，浏览器也成为了移动互联网现阶段的新热点。HTML5增加了图形的支持，用以替代Flash（Adobe公司较封闭插件）媒体播放等。HTML5不仅能提供大多数现有需要插件和扩展来完成的功能，而且具备了图像增强、Web数据存储和离线数据存储等新功能，这使完整支持HTML5的浏览器具有了更强的本地数据处理能力，从而可以部分代替操作系统。更重要
的是，HTML5具有跨平台的特点，其应用可以不再分为iOS版、Andriod版及WP7版本，应用开发的成本、维护费用因此将降低，开发者也可以在一定程度上摆脱现有操作系统主导者构建的围墙式规则。
        HTML5增加了部分新控件，Web Socket、Video/Audio、WebGL、Canvas、Local Storage每种控件都基于HTML4不足进行改进。Canvas 标签是绘制Web图形的利器，相当于在浏览器（或 HTML5引擎）这一级别向上层应用提供了绘图接口，有各种绘图函数供用户操作。尽管不如操作系统提供应用接口强大，但也可以满足大部分图形应用。HTML5应用是需要通过Java Script来调用绘图 API的，性能上会受到影响。不过随着机器图形的加速性能快速提高，可以帮助HTML5提供加速功能。 Web Socket控件与主机进行双向TCP/IP通信（支持 TLS 加密），比目前主流的Ajax更加强大、高效和减少流量，减少了HTTP Header等重复性信息。Web Socket的客户端实现在各大操作系统上都是基于 Socket。HTML5增加了本地存储并以 key/value的方式实现，其由两部分组成：Session Storage与 Local Storage，前者用于存储一个会话（session）中的数据，本方法类似于服务器语言中的session方法，当会话结束后数据不再保存，本存储方式对现有Cookie 缺陷进行了改进。Local Storage 用于持久化的本地存储，如果应用程序不主动删除数据，那么数据不会过期。
虽然可访问本地文件带来了不安全隐患及增大垃圾文件数量，但是为开发者提供了访问本地的机会，便于开发。Video/Audio可以代替传统flash带来的不便。WebGL是一种3D绘图标准，把Java Script和OpenGL ES相结合，为HTML5 Canvas提供硬件3D加速渲染。
        3 应用PhoneGap将Html5引入到智能手机
        PhoneGap是一个开源的开发框架，最新版本为1.7.0，使用HTML5，CSS和Java Script来构建跨平台的移动应用程序，如图2所示。开发者能够利用同一套代码生成至各智能手机中。开发者可以通过PhoneGap调用iPhone，Android， 和Windows Phone7手机系统的核心功能——包括图形图像操作、地理定位、加速器、联系人、声音和振动等一系列操作。按照PhoneGap的配置文档，加入到三种智能手机开发环境中，即可进行编码。
        本文以HTML5中的Canvas为例，建立一个游戏基础结构，让一个小球在正方形框中移动，碰撞到墙壁后进行反弹。代码缩略如下：
        //hmtl5开始标记
        //头信息
        将以上代码进行编译，并分别运行于WP7、Android、iPhone模拟上的效果，真正做到写一份代码运行于多个智能手机平台上。效果如图3所示。
        4 结语
        通过以上演示可以看到，进行实际应用开发时，给开发者带来了便利，HTML5、CSS、Java Script学习机开发技术及成本较手机系统要低，并且HTML5提供的新特性可以实现手机应用必须的技术支撑。相信本技术在未来智能手机应用开发的统一性上会大有作为。
        参考文献：
        ＼[1＼] PTER LUBBERS RIC SMITH.HTML5未来发展＼[J＼].programmer，2011（4）.
        ＼[2＼] ANDREW LUNNY.PhoneGap Beginner’s Guide＼[J＼].Packt Publishing，September 23，2011.
        ＼[3＼] 唐灿.下一代Web界面前端技术综述＼[J＼].重庆工商大学学报，2009（6）.
        （责任编辑：杜能钢）

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。