1.2 跨平台移动开发框架

马克思在资本论中曾经提到过，一切社会形态都取决于生产力。而对于开发人员来说，生活水平（主要指收入）也主要由生产力来决定。开发人员为了提高生产力主要有两条路可以选择：

● 努力学习，积累经验使自己具有更高的技术。

● 选择更高效的开发工具。

如果决心选择第一条路的话，现在可以放弃这本书了，因为本书主要介绍的是如何利用更高效的工具来提高开发效率。如果选择了第二条路，那么恭喜你，你将在本书中得到所需要的技术。

如何用工具来提高开发效率呢？曾经有人设想有这样一款IDE（集成开发环境），开发者可以将自己的需求通过键盘输入到IDE中，IDE就会自动生成开发者所需要的软件。这确实是近几年软件工程学科比较热门的一项课题，可惜的是还远远不能实现需求。因此就只能退而求其次，于是跨平台移动开发框架就应运而生。

1.2.1 什么是跨平台移动开发框架

近年来随着硬件设备和平台的不断发展，手持移动设备的计算能力得到了显著的提高，智能手机和平板电脑越来越多地出现在人们的日常生活中。无论是多么强大的硬件或是多么优秀的平台，都要有软件来支撑。但是厂商之间的竞争导致软件在不同平台中不兼容的现象。比如安卓上的apk文件就无法在iOS中运行，甚至早期安卓上运行的一些APP在当前的大屏手机上也无法正常显示。

作为一名开发者就不得不做出取舍，是选择自己精通的一个平台做好呢？还是花费大量的时间和精力同时进行多个平台的开发，甚至是花钱雇人来开发其他的平台好呢？这看似是一个难以抉择但是又没有完美答案的选择题。能不能选择一种完美的方案呢？当然可以，因为有跨平台移动开发框架。

所谓跨平台移动开发框架，可以简单地被分解成：“跨平台”、“移动”和“开发框架”。“跨平台”指的是只需要经过一次开发，得到的应用就可以在多个平台上流畅运行。目前比较主流的移动操作系统包括Android、iOS等，为了实现在这么多系统之间的兼容，跨平台开发框架往往采用HTML 5为开发语言，然后利用Web执行，或者由专门的开发环境生成全部平台适用的安装文件。

以本书介绍的jQuery Mobile为例，它是一款基于HTML 5的跨平台开发框架，可以利用它来生成非常华丽的网页文件。但是同时也可以借助另一款框架APICloud的帮助来分别生成apk（安卓中的安装文件）、ipa（iOS中的安装文件）格式的文件。图1-12为一款跨平台开发框架主页上为了说明跨平台特性而设计的图片。

所谓“移动”指的是主要支持移动设备，也就是说这些框架是专为移动设备（如手机或平板）而定制的。这也说明该框架不会考虑一些比较老的PC浏览器（如IE 6）的兼容性，但是大多数情况下在PC上仍然是可以正常使用的。

跨平台开发框架令开发者感到欣慰的地方，在于它“开发框架”的特性，该特性使得它能够大大提高开发人员的效率。所谓“开发框架”，指的就是一组已经被定义好的设计构件。如在HTML 5中定义一个按钮非常容易，但是若要为它加入一些好看的样式，可能光CSS就要写几十行，有了jQuery Mobile后，只需要一行代码就可以了。

1.2.2 为什么选择跨平台移动开发框架

跨平台移动开发框架的优点如下。

● 一次编写多平台运行。

目前绝大多数智能手机都支持HTML 5，况且还可以将内容打包成相应平台的应用，这更保证了应用的可运行性。

● 上手迅速，开发效率高。

没有HTML、JavaScript开发经验的人员，甚至是销售人员，经过一两天的学习后，也能够做出一些非常不错的应用界面。

● 避过重重审批，直接面向用户。

上传到应用市场能不能通过审批都是未知数（比如说App Store中的快播）。为了能够面向用户（最根本的还是获得广告收入），最好的办法就是直接生成网页，只要有一台服务器就够了，甚至连域名也不需要。

● 即使没有美工基础的开发人员也可以设计出优秀的界面。

因为在这些开发框架中大多已经定义好了要使用的样式，开发者只要根据自己的需要对各种样式进行选择就可以。其实不光是这些“高级”的集成开发环境，原生的SDK中也集成了一些基础样式，只不过它们大多比较丑，需要开发者去进一步美化。

1.2.3 常见的跨平台移动开发框架

常见的跨平台移动开发框架有：jQuery Mobile、Sencha Touch、jQTouch、Dojo Mobile、AppCan、PhoneGap/Cordova和Cocos2d-X等。当然类似的框架还有很多，这里只列出这些比较有代表性的。下面将对它们进行一一介绍。

1.jQuery Mobile

jQuery Mobile是jQuery在手机和平板上的版本，它不仅带来能够让主流移动平台支持的jQuery核心库，还包括一整套完整和统一的移动UI框架。jQuery Mobile不仅支持全球各个主流移动平台，在PC平台的Web应用中也常常看到它的身影。jQuery Mobile的开发团队认为，jQuery Mobile在向各种主流浏览器提供统一的用户体验（图1-13为jQuery Mobile）。

2.Sencha Touch

Sencha Touch是一款将现有的ExtJS框架整合JQTouch、Rapha库而推出的，适用于最前沿Touch Web的移动开发框架。Sencha Touch可以让Web App看起来更像Native App。拥有美丽的用户界面组件和丰富的数据管理，全部基于最新的HTML 5和CSS3的Web标准，全面兼容Android和iOS设备。

Sencha Touch所自带的主题样式可以说是所有开发框架中最接近iOS原生样式的，甚至能以假乱真。另外，它还给Android开发人员准备了若干套适用于Android的主题。

与其他移动开发框架相比，Sencha Touch最大的优点还在于其提供了增强的触摸事件处理机制，在touchstart、touchend等标准事件基础上，增加了一组自定义事件数据集成，如tap、swipe、pinch、rotate等。这些事件使得Sencha Touch能够更好地处理页面中的手势判断等操作，为用户带来更强大的交互式体验（图1-14为Sencha Touch）。

3.jQTouch

看到这个名称，可能很多读者会以为这是一款与Sencha Touch一样，通过增加对手势的处理来增强交互性的框架。它名字中虽然带有Touch，但是jQTouch的特色在于通过增强浏览器中的动画、渐变以及导航列表等效果来达到目的。随着iPhone、iPod Touch等设备的使用日益增多，jQTouch无疑为手机网站的开发减少了工作量，而且在样式和兼容性方面也得到了很大的提高。

准确地说，jQTouch并不能完全算作是一款移动开发框架，因为它原本仅仅是来自于Sencha Libs的一款jQuery插件，用于在iPhone等触屏设备上实现一些简单的动画效果。笔者认为将它作为一个包含比较全面的UI效果的JavaScript库来使用会比较合适一些（图1-15为jQTouch）。

随着触屏移动设备的增多，jQTouch团队在这上面确实下了不少功夫，以至于它现在越来越“像”一款开发框架。目前jQTouch能够提供很好的文档管理功能，并且易于使用，但是仍然存在为数不少的bug，官方提供的一些小demo也存在一些问题。

另外，这款框架是基于WebKit内核的，也就是说它并不是完全的跨平台开发框架，至少它不能支持Gecko（Firefox和Opera浏览器的内核）。

4.Dojo Mobile

Dojo Mobile是Dojo工具包的一个扩展，提供了一系列小部件或组件来帮助开发者快速生成希望获得的界面效果。与Sencha Touch类似的是，Dojo Mobile也致力于通过HTML 5来模拟出原生应用的界面效果，对于一些不熟悉开发的用户来说，根本看不出这类应用与原生应用的差别。

另外，Dojo Mobile还拥有可定制的主题，如同样的页面在iOS用户和Android用户访问时，看到的界面也许会完全不同（图1-16为Dojo Mobile）。

Dojo Mobile与jQTouch都是基于WebKit内核的开发框架，但这却并不代表它不能支持其他内核的浏览器。经过笔者的测试，它在Firefox和Chrome中都有着不俗的表现。

除这些之外，Dojo Mobile还有一个独有的特点是非常值得其他几款框架的开发者学习的，那就是Dojo Mobile本身在UI样式中不使用图片来加快浏览的速度，但是当应用中不可避免地需要图片资源时，Dojo Mobile提供了一些有用的机制，如DOM button和CSS sprite来降低图像需求并减少服务器的HTTP请求数量。

5.AppCan

AppCan是中国人自己开发的移动开发框架，也是国内Hybrid App混合模式开发的倡导者。AppCan应用引擎支持Hybrid App的开发和运行，并且着重解决了基于HTML 5的移动应用“不流畅”和“体验差”的问题。使用AppCan应用引擎提供的Native交互能力，可以让HTML 5开发的移动应用基本接近Native App的体验（图1-17为AppCan）。

与PhoneGap\Cordova支持单一WebView且使用DIV为单位开发移动应用不同，AppCan支持多窗口机制，让开发者可以像开发最传统的网页一样，通过页面链接的方式灵活地开发移动应用。基于这种机制，开发者可以开发出大型的移动应用，而不是只开发简易类型的移动应用。

与其他开发框架不同的是，AppCan提供了专门的IDE集成环境，并能够调用移动设备的各个组件（如摄像头、话筒等），开发者可以通过JS接口调用，轻松构建移动应用。

它的优点除能够生成安装文件和调用系统功能之外，更多的还是体现在“快”字上。AppCan生成的应用运行起来确实要流畅得多，但是由于开发门槛较低，使用AppCan的开发者总会受到或多或少的歧视，但是最近这一现象已经大有改观。

6.PhoneGap/Cordova

PhoneGap是一款基于HTML、CSS和JavaScript的创建跨平台移动应用程序的快速开发平台。它使开发者能够利用iPhone、Android、Palm、Symbian、WP、Bada和Blackberry智能手机的核心功能——包括地理定位、加速器、联系人、声音和振动等。此外PhoneGap还拥有丰富的插件，可以以此扩展无限的功能（图1-18为PhoneGap架构图）。

与前面介绍的几款框架不同，PhoneGap并不带有任何UI样式，并且也无法独立使用，但是它可以依靠各个平台的IDE（如Android的Eclipse）将HTML文件生成相应的安装文件。同时可以使HTML能够调用系统功能，如发短信、GPS、手电筒等。整个流程的效果如图1-19所示。目前，PhoneGap正式更名为Cordova。

7.Cocos2d-X

Cocos2d-X是一款比较独特的开发框架，笔者截取了Cocos2d-X官网上的一些案例图，如图1-20所示。

有没有觉得这些图标非常熟悉？但好像有点不大对劲，为什么这些都是游戏？没错！Cocos2d-X其实是一款强大的跨平台移动游戏开发框架。这么多的Top10 Gams竟然都出自于同一款开发框架，那么它的强大功能自然是毋庸置疑的。

8. APICloud

任何一款APP，集成SuperWebViewSDK后都可以大幅缩短迭代周期，APICloud支持功能动态增加，无须提交AppStore审核，用户无须重新下载，比原生WebView具有更流畅更强大的用户体验。APICloud原理如图1-21所示。