1、1用 PhoneGap + jQuery Mobile 开发Android 应用前言 .2PhoneGap 及 jQueryMobile 介绍 .2开发环境的搭建 .2下载并按 照 JAVA SDK .2下载并安装 Android SDK .2创建虚拟设备 .3下载并安装 Eclipse .4下载并安装 ADT Plugin.4下载并解压 Cordova.5下载 jQuery Mobile .5第一个手机应用 .5创建工程 .5整合 Cordova.8整合 jQueryMobile .10制作 apk .13参考 资料 .1621. 前言随着移动终端计算能力的提升，移动应用变得越来越受人青睐，
2、也越来越流行；尤其以 iOS 和 Android 平台为主的手机，已经淘汰了大多数人的手机。新的平台产生了新的 SDK，新的 UI，新的使用习惯和用户体验。而因为计算能力的增强，手机的渲染能力也大幅增强，从而催生了以 WebKit 为内核的浏览器的广泛应用。并以此而衍生出了手机上的 HTML+CSS 应用。至此，手机应用的开发也与传统 PC的开发一样，多了一条低成本开发的坦途。除却传统的基于原生 SDK 的开发不谈，基于 HTML+CSS+js 的开发已经变得越来越流行，也越来越受欢迎，特别是一些小应用开发商。因此而衍生的开发框架如雨后春笋：PhoneGap，AppCan，Rexsee 等等。
3、这些框架都是采用桥接的方式，在系统(iOS/Android)原生 SDK 的基础上，创建一个以 WebKit 为运行环境的本地 Web 应用，并为 js 引擎暴露本地功能( 服务 )的访问接口，从而实现以HTML+CSS 展示界面，以 js 控制程序流程的手机应用。这种应用看上去与原生 SDK 开发的应用并无二致，甚至可能拥有更好的用户界面和用户体验。因为网页的开发技术越来越成熟，各种库的适用性，兼容性越来越强，而且也越来越注重用户界面与用户体验的提升，其中的佼佼者有最初的Prototype，Yahoo!；现在大行其道的 jQuery，ExtJs，Dojo 等等。同样，这些库也推出了移动版，而
4、基于 jQuery 的就有很多不同的库，如：JQ.mobi，jQuery Mobile 等等。2. PhoneGap、jQuery Mobile 简介PhoneGap 是一个基于 HTML5+CSS 和 JavaScript 的，创建移动跨平台移动应用程序的快速开发平台。最初 PhoneGap 仅支持 iOS，但随着 Android 市场份额的恐怖增长，增加了 Android 的支持，后续又陆续增加了 BlackBerry、Windows Mobile Phone、 WebOS 以及 Symbian 的支持。Adobe 在去年底，收购了 PhoneGap，并交由 Apache 开源，成了现在的
5、Cordova(以下均称 Cordova)。Cordova 现在已经更新到 2.1.0，除了保留原 PhoneGap 的所有功能，Cordova 支持更多的设备，桥接了更多的接口，并且稳定性更高。jQuery Mobile 是 jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅给主流移动平台带来 jQuery 核心库，而且发布了一个较完整统一的 jQuery 移动 UI 框架。我们可以继续使用 jQuery 来开发手机版的网页代码，同时还可以利用 jQuery Mobile带来的基本 UI 控件(互联网时代的程序猿是幸福滴 )。3. 开发环境的搭建废话了不少，现在来点正
6、经的，从无到有搭建一个开发环境：1) 下载并安装 JAVA JDK(推荐使用 JDK6)2) 下载并安装 Android SDK(r20.0.3)安装好之后，打开 SDK Manager(初始安装后，仅 Android SDK Tools 一项已安装) ，将 Tools 项，以及 Android 2.2(API 8)勾选，并点击“install x packages”进行安装(过程会有点长，不如坐下来看一部电影吧) ，如图：33) 创建虚拟设备(Android Virtual Device)打开 AVD Manager，点击新建 (New)，如图：输入虚拟设备名称，选择目标平台(Android
7、 2.2)，如图：44) 下载并安装 Eclipse(Eclipse 3.4+)5) 下载并安装 ADT Plugin(20.0.3)ADT Plugin 的安装有两种，一种在线安装：打开 Eclipse 菜单 Help|Install New Software，点 Add，在 Name 中输入“ADT 20.0.3”，在 Location 里输入 https:/dl- ADT 20.0.3.zip 下载到本地，进行本地安装。不同之处就是在 Add之后，在 Location 中输入 zip 包的本地路径即可。安装好之后，Eclipse 下会看到 Android 开发相关的工具按钮，如图：6)
8、下载并解压 CordovaCordova 是一个 zip 包，不需要安装，我们不妨将其解压，并与 Android SDK 放一起。7) 下载 jQuery Mobile与 Cordova 一样，不妨将其解压并与 Android SDK 放一起( 好找嘛)。4. 第一个手机应用开发环境至此已经搭建完毕，练练手吧(可不可以不要“hello, Cordova.”)：67SDK 最好选一致的( 为什么是 2.2?)。这里是程序图标(回头再来换 )，以及配色方案(无所谓，我们用的 HTML+CSS 嘛)。8空着，我们用不着。9好了，终于结束了(我是说截图结束了，手酸呐 )。现在该整合 Cordova 了
9、，先假设我们的 YofangMobile 工程目录为%YofangMob%，而Cordova 的解压目录下 libandroidexample 为%CordovaAnd%(恩恩，我们是开发Android 应用嘛，当然以此为准)，下面整合：1) 切换到文件系统，复制%CordovaAnd%libscordova-2.1.0.jar 到%YofangMob%libs下。2) 创建文件夹%YofangMob%assetswww 。3) 复制%CordovaAnd%assetswwwcordova-2.1.0.js 到%YofangMob%assetswww 下。4) 复制文件夹%CordovaAnd
10、%resxml 到%YofangMob%res 下。5) 切换到 Eclipse，打开我们的 YofangMobile.java，将 YofangMobile 的基类由 Activity改成 DroidGap；将 onCreate 方法里的setContentView(R.layout.activity_yofang_mobile);替换成super.loadUrl(“file:/android_asset/www/index.html“);删除 onCreateOptionsMenu 方法(修改之后 Eclipse 会报错，不怕不怕，Ctrl+Shift+O)。修改结果如图：6) 继续，打开 AndroidManifest.xml 文件( 记得别双击，用 Open With|Text Editor)。7) 增加 Cordova 屏幕支持：8) 增加 Cordova 插件配置：109) 为 activity 节点增加属性：android:configChanges=“orientation|keyboardHidden“10) 保存 AndroidManifest.xml 的修改，如图：11) 在 assetswww 下创建文件 index.html，内容如下：
