文/张志祯

移动学习应用有望成为学习者通向数字学习世界的首要入口，而移动设备的碎片化决定了教育机构通常需要支持多个移动平台。对教育机构而言，移动学习应用的类型以及开发技术路线的选择是战略层面的决策，跨平台开发技术的现状与发展趋势是影响这一决策的重要因素。

随着云计算、无线网络和移动设备（尤其是智能手机和平板电脑）等技术的发展，移动学习在各级各类教育中的应用日益普及。移动学习应用已经成为日益动态、开放、智能化和移动化的教育信息化生态系统的重要“物种”，其重要性将日益凸显：它有望成为学习者通向数字化学习世界的首要入口。

移动学习应用可分为资源型和工具型。资源型应用包含特定知识点的学习材料，仅支持固定内容的学习活动，如幼儿识字、背单词应用等；工具型应用则侧重于帮助学习者开展不局限于特定学习内容的学习活动，如访问学习平台、阅读电子书、做批注、绘制思维导图等。由于以上不同应用平台的界面风格、交互方式、编程语言和编程接口等诸方面都存在差异，跨平台支持的成本很高。为应对这一问题而涌现的移动应用跨平台开发技术受到了普遍的关注。本文将对目前常见的跨平台开发技术进行比较，以期为教育机构跨平台移动学习应用的技术选型提供参考。

图 1 三种类型移动应用的运行机制

三类移动学习应用的比较

目前存在三种开发方式和运行机制迥异的移动应用，即原生应用（Native App）、移动Web应用（Mobile Web App）和混合应用（Hybrid App），三者运行机制差异见图 1。

原生应用是直接运行在移动设备操作系统中的应用程序。它可以通过操作系统直接访问移动设备的服务和硬件，受到的限制最少，运行性能最高，因此其用户体验也最好。但由于不同平台原生应用的开发工具、编程语言、编程接口及其背后的概念体系和设计理念存在很大差异，不同平台间应用开发的知识经验难以共享，造成跨平台原生应用开发的成本高昂。

移动Web应用是运行在移动设备Web浏览器中、利用标准Web技术，即HTML/CSS/JavaScript，构造的Web应用。自Web2.0应用和理念被广泛接受以来，随着浏览器对Ajax技术的普遍支持、CSS规范和JavaScript引擎的增强、JavaScript客户端框架的成熟，Web页面不仅是“文档”，更是“应用”的观念已经深入人心。HTML5规范的提出和逐步完善将移动Web应用推向新的高度。目前移动Web应用的功能和性能已有大幅度提升，已经成为移动应用的现实选择。移动Web应用不是直接运行在操作系统，而是运行在设备的独立浏览器中，出于安全考虑，移动Web通常无法访问相机、联系人、本地存储等资源。同时，虽然对移动Web应用的限制在日益放宽，但不同平台、浏览器的支持还存在相当大的差异，若移动学习应用需要大量的离线存储空间、需访问设备硬件或需执行大量计算，则移动Web并不是很好的选择。

混合应用实际是一种特殊的原生应用：它直接运行在操作系统中，因此是原生应用；但其大部分应用逻辑和界面元素采用Web技术实现，即大部分逻辑是由内嵌Web浏览器（如iOS的UIWebView和安卓的WebView）执行HTML/CSS/JavaScript代码实现的。由于可以采用Web技术实现绝大多数功能的开发，因此可以大大提高开发效率，降低开发难度。同时，由于程序运行在操作系统，可以突破移动Web应用所受的限制，可访问设备的各种硬件与基础服务。

图 1中原生应用和混合应用用虚线框，表示它可以直接调用操作系统的功能，而混合应用中的Web代码也可以透过特定API访问操作系统的功能。移动Web应用的运行环境——独立浏览器，用实线框，表示其运行环境是受限的“安全沙箱”。表 1概括呈现了三种移动应用的优势和不足。

表 1 三类移动应用的优势和不足

移动学习应用跨平台开发技术分析

移动应用跨平台开发的需求广泛而迫切，这催生了大量的跨平台开发框架。图 2呈现了典型的跨平台开发技术。Adobe AIR支持用Flash/ActionScript开发跨平台原生应用，Appcelerator Titanium支持用HTML/CSS/JavaScript开发跨平台原生应用；移动Web应用可借助jQuery Mobile、Sencha Touch等框架提高跨平台开发的效率；利用PhoneGap、Appcelerator Titanium等打包工具，可以将移动Web应用转换为跨平台的混合应用，而不同打包工具支持的平台、功能和编程接口会存在较大差异。

原生应用的跨平台开发技术

相对移动Web应用、混合应用而言，支持原生应用开发的框架相对较少。选择Adobe AIR和Titanium Mobile的原因是：AIR可以将Flash动画转换为跨平台的移动应用，由于大量学习资源是用Flash开发的，这对于移动学习应用的开发意义重大；Titanium支持上述三种应用的开发，尤其是可以将JavaScript代码编译、打包为本地应用，不但能够大幅度提高应用性能，而且可提高代码重用率：据统计，用Titanium开发iOS和安卓应用，可共享80%的代码。

Appcelerator Titanium Mobile是一个基于JavaScript的移动应用编程框架，目前支持iOS和安卓应用开发，Blackberry支持尚在测试中且仅对付费用户开放。其API包括用户界面、数据存储（本地文件系统和内嵌的SQLite数据库）、远程数据访问、媒体（声音、视频、图像、相册和照相机）、位置服务等。Titanium Studio是它的集成开发环境，可实现本地测试（需Android SDK和Xcode的模拟器），但打包需连接Appcelerator的云服务。

Adobe集成运行环境（Adobe Integrated Runtime）是一个跨平台的应用程序运行环境，支持用Flash、Flex等技术开发跨平台应用。AIR将Flash播放器器作为其运行环境，ActionScript3是其唯一的编程语言。为了调用AIR运行时的额外功能，如文件系统访问、原生窗口和任务栏集成、本地数据存取、加速计和GPS等硬件设备，Flash应用需要调用专门的API。Adobe提供免费的AIR SDK用于AIR应用打包；同时，AIR应用打包也集成到了Flash CS5+中，这大大提高了应用开发的效率。AIR最新版本是3.8，支持iOS4.3+、安卓2.3+以及BlackBerry Tablet OS。利用AIR的另外一个好处是：它还支持Windows、Mac OS等桌面环境，提高了桌面、移动应用代码统一、重用的可能性。

移动Web应用的跨平台开发技术

HTML5是近年最炙手可热的概念之一，广义上说它包含HTML、CSS和JavaScript等一套Web应用开发技术，三者分别负责Web应用的结构、外观和行为，三者相互配合可方便地集成多媒体信息、创建复杂交互，降低乃至消除浏览器对第三方插件的依赖。

HTML5中新增的HTML标签主要有多媒体集成标签，如audio、video；更具语义特性且能提高多设备适应能力的文档结构标签，如footer、nav、section等；同时，取消了应由CSS实现的格式化标签，如font、center等。CSS的当前版本是CSS2，正在开发中的CSS3主要提供了更灵活的布局、元素视觉效果和选择器。在编程接口方面，除了原先的DOM接口，HTML5中新增了诸如即时二维绘图（Canvas）、离线数据存储、编辑、拖放、跨文档通信、媒体播放等编程接口。

由于当前的Web应用通常有大量前端JavaScript代码，而且DOM接口繁琐笨拙，因此今天几乎任何正式的Web项目都会基于一个或多个JavaScript库。这里介绍两个最常用移动Web的框架：jQuery Mobile（jQM）和Sencha Touch（ST）。

jQM基于成熟稳定的JavaScript框架jQuery，是一个轻量级的开源框架。它与HTML/CSS结合紧密，可增强HTML元素的外观和行为，使界面风格与交互方式与平台原生控件相近，大大提高了Web页面在移动设备上的可用性。jQM应用的外观和行为容易定制，具备jQuery和HTML/CSS基础的开发者可以快速上手。jQM支持常见的移动浏览器。

图 2 跨平台移动应用开发技术

图 3 jQuery Mobile和Sencha Touch的对比

ST同样基于成熟的桌面Web框架：Ext JS，但它是重量级框架，提供了丰富的GUI组件库、转换效果和完善的事件处理机制。它较好地封装了HTML/CSS等“底层技术”，可以用与桌面GUI库（如Java的Swing）类似的概念进行开发。相比而言，它需要的学习时间更长，界面的定制更加复杂。它支持iOS、Android、BlackBerry、Bada、Kindle Fire等设备的浏览器。

图 3是jQM和ST的对比，宏观地看jQM是“自下而上”的，开发时需要编写HTML代码，jQM将其增强为移动界面组件，如按钮、列表视图等；ST是“自上而下”的，框架负责将与Java Swing类似的界面组件转换为HTML/CSS。jQM小巧、性能和跨浏览器支持均表现优异，更适合静态内容较多的资源型移动学习应用；而ST不仅是界面组件，更是一个完整的MVC（Model-View-Controller，即模型视图控制器）客户端编程框架，更“笨重”，更适合动态内容较多的工具型应用。

混合应用的跨平台开发技术

从图 2可以看出混合应用是借助打包工具将移动Web应用打包而得到的特殊原生应用。打包是将整个移动Web应用封装到原生应用内嵌的Web浏览器中，Web应用的代码可以调用打包工具提供的API突破独立浏览器的安全限制，访问设备的硬件和服务。当前已有大量的打包工具，而PhongGap和Titanium是比较有代表性的。

PhoneGap，即Apache Cordova，其优势是对移动平台的广泛支持，它支持iOS、安卓、Bada、BlackBerry、Symbian OS、Tizen、webOS以及Windows Phone。PhoneGap为加速计、相机、联系人、文件、地理位置、媒体、网络、通知、存储等服务提供了JavaScript 接口。PhoneGap混合应用可借助平台开发工具（如Xcode、Android SDK）或Adobe PhoneGap Build云服务打包。开源学习管理系统Moodle的“官方”客户端就是采用它打包的。该应用在iPad mini上的运行界面见图 4，左图为中图虚线框部分放大，从中可以看出它允许上传照片（照片库中选择或拍照）和声音（录音）。

Titanium也可以用于打包Web应用，它对iOS和安卓提供了完善的支持。Titanium还提供了集成开发环境（Titanium Studio）、应用商店和打包云服务。Titanium的优势还在于它同时支持原生应用和混合应用，即可以将原生应用和混合应用“混合”，以最大限度提高应用的性能。

图 4 利用PhoneGap开发的混合应用实例——Moodle Mobile

移动学习迫切需要移动应用的跨平台开发

跨平台开发技术的选择

移动应用开发技术的发展趋势是决策不可忽视的重要因素。综合以上分析，可得到如下结论：

第一，Web技术（HTML5）是移动学习跨平台开发的未来。Web技术天生的开放性使其具有无与伦比的活力。对移动学习机构而言，Web开发的核心在于提高设计和开发人员对于HTML/CSS/JavaScript这套基本技术和jQuery/jQuery Mobile/Sencha Touch等JavaScript编程框架的深入理解，——这些是移动Web应用和混合应用核心。此外，Nielsen和Budiu基于长期的移动可用性研究，认为从可用性和开发成本的角度看，在未来的某个时间点，最佳的移动策略将从原生或混合应用变为移动Web应用，即当前应选择原生或混合应用，但未来应属于移动Web应用。

第二，Adobe AIR特别适合在Flash技术上已有丰富积累的机构快速实现“移动化”。鉴于Flash在教育领域的广泛应用，机构积累的不仅仅是大量的Flash资源，而且还有设计和开发人员的知识经验，AIR使得这些资源和经验可以继续在移动平台上发挥作用。

第三，对于资源型移动学习应用，开发技术的低难度、高效率至关重要，因此Flash+AIR和移动Web（jQuery Mobile）通常是最佳选择。AIR和Web相比，Web的优势在于其开放性，而且HTML5资源更易转换为标准格式的电子书。

第四，对于工具型移动学习应用，应用类型和开发技术的选择取决于工具的功能特点。在内置浏览器中运行的JavaScript代码的执行效率显然低于直接运行在操作系统中的原生代码，因此若工具需要大量计算或执行较多底层操作，则最好选择平台专用语言和工具开发原生应用（当然Titanium也是可行的）。对一般性的移动学习工具，如学习平台的移动客户端，混合应用是非常理想的选择。根据目标平台的定位，若仅需支持iOS和安卓，则Titanium是很好的选择；若需支持的平台众多，则PhoneGap更好。由于两者都只是打包工具，还需要选择一个编程框架，如jQuery Mobile、Sencha Touch、或者两者的组合，都是不错的选择。

[1] NMC Horizon Project. NMC Horizon Project Preview 2013 K-12 Edition [EB/OL]. http://www.nmc.org/pdf/2013-horizon-k12-preview.pdf, 2013-05-16.

[2] 148Apps.biz. App Store Metrics [EB/OL]. http://148apps.biz/app-store-metrics/?mpage=catcount,2013-05-17.

[3] Nelson, R. Google Play for Education takes Android into the classroom [EB/OL]. http://androidcommunity.com/google-play-for-education-takes-android-into-the-classroom-20130515/, 2013-05-15/2013-05-17.

[4] 刘君芝. 大学生移动英语学习的现状调查——以北京师范大学为例[D]. 北京师范大学教育技术学院，本科学位论文，2013-05.

[5] ADL Mobile Learning Team. Mobile Learning Handbook[EB/OL]. http://www.adlnet.org/wp-content/uploads/2011/08/MLHandbook20110809.pdf

[6] Wikipedia. Multiple phone web-based application framework [EB/OL]. http://en.wikipedia.org/wiki/Multiple_phone_web_based_application_framework, 2013-05-16.

[7] Poulsen, T., Whinnery, K., Lukasavage, T. & Dowsett, P. Building Mobile Apps with Titanium [EB/OL]. http://assets.appcelerator.com.s3.amazonaws.com/app_u/bnapp.mobi, 2013-05-15.

[8] Wikipedia. Appcelerator Titanium[EB/OL]. http://en.wikipedia.org/wiki/Appcelerator_Titanium,2013-05-16.

[9] Wikipedia. Adobe Integrated Runtime. http://en.wikipedia.org/wiki/Adobe_AIR, 2013-05-16.

[10] W3C. HTML5 [EB/OL]. http://www.w3.org/TR/html51/, 2013-05-10.

[11] The jQuery Foundation. jQuery Mobile Introduction[EB/OL]. http://view.jquerymobile.com/1.3.1/dist/demos/intro/, 2013-05-15.

[12] Sencha. Sencha Touch Build Mobile Web Apps with HTML5 [EB/OL]. http://www.sencha.com/products/touch/features/, 2013-05-15.

[13] Moodle. Moodle Mobile [EB/OL]. http://docs.moodle.org/dev/Moodle_Mobile, 2013-05-16.

[14] Nielsen, J. & Budiu, R. Mobile Usability [M]. Berkeley: New Riders, 2012, pp33-36.

[15] Kleinfeld, S. HTML5 for Publishers [M]. Sebastopol: O’Reilly Media, Inc., 2011, pp. 41-43.