PhoneGap学习笔记
由于PhoneGap和Apache Cordova在底层上的一致性，本文主要讨论PhoneGap提供的额外工具，其他主题请参考：
一个框架，支持通过标准的基于JavaScript的API，来开发跨平台的移动应用。PhoneGap同时支持基于Web、基于Native两种风格的混合应用，它通过联合使用Native元素和Web元素，来达到更加Native的look and feel。通过PhoneGap底层的Apache Cordova框架，我们可以使用很多设备的原生特性，例如GPS、罗盘、摄像头。
基于PhoneGap的混合应用有以下额外的特点：
- 不能完整调用原生API：只有受限的、通用的基础API被Cordova框架支持
- 平台差异化不足，应用界面长得差不多
后者是PhoneGap的底层框架，PhoneGap是后者的一个distribution。两者提供的命令行工具很类似，使用一套插件体系。PhoneGap提供了一些额外功能，包括：
- PhoneGap Developer App
- PhoneGap Desktop App
- PhoneGap Enterprise
- 云端构建功能
PhoneGap依赖于Node.js、NPM（Node.js目前自带）、git，准备好后，运行：
|
1 |
npm install -g phonegap@latest |
安装结束后，即可运行命令 phonegap ，来执行工程创建、构建、安装、启动HTTP服务等功能。除了使用命令行工具外，PhoneGap还提供了云端构建服务，简化构建、App打包流程。
PhoneGap为Windows、Mac OS X提供了图形化界面，使用它可以方便的创建新的PhoneGap应用。可以到这里下载Windows的安装包。
该工具价值不大，使用PhoneGap CLI可以很容易的代替之。
PhoneGap提供了一个移动APP——PhoneGap Developer App（以下简称PGDA），可以方便的在设备上预览、测试PhoneGap应用。不需要任何插件的支持或者编译步骤，该APP就可以支持设备Native特性的访问。
该APP有安卓、IOS、WP三个版本，可以到对应的商店下载安装。
PGDA本质上就是一个Phonegap应用程序，只是它具有从远程服务器上同步最新Web代码的能力。PGDA默认自带了Cordova内置插件，如果你要使用第三方插件，必须自己构建PGDA。
PGDA的源码托管在：https://github.com/phonegap/phonegap-app-developer
下载源码后，可以参考如下方式添加新插件支持，并构建（以Android为例）：
|
1 2 3 4 5 |
cd phonegap-app-developer # 添加NFC插件的支持 cordova plugin add phonegap-nfc #构建Android平台 cordova build android |
构建完毕后，文件platforms\android\build\outputs\apk\android-debug.apk即为最新的PGDA安装包，安装到设备即可。
打开PhoneGap桌面版本，点击左侧的+号，即可创建新的PhoneGap应用。输入路径、名称、ID后，即可创建工程。新创建的工程的结构如下：
| 目录/文件 | 说明 |
| .cordova | 存放Apache Cordova相关的文件 |
| hooks | 这些目录/文件与Apache Cordova工程同名目录/文件的含义相同 |
| platforms | |
| plugins | |
| www | |
| config.xml |
亦可导入既有的PhoneGap应用，Apache Cordova应用也是支持的，可以导入。
点击项目右侧的右侧的运行按钮，会启动一个HTTP服务，侦听3000端口。
打开移动设备，点击PGDA图标，输入上述HTTP服务的地址和端口，点击Connect，看到DEVICE IS READY字样，说明设备和HTTP服务器连接成功。在此设备界面上：
- 四指轻触：刷新视图
- 三指轻触：回到PGDA主界面
现在，可以打开 www/index.html 下的文件进行编辑，例如我们可以修改 <h1>PhoneGap</h1>中的文本。其结果将很快的反映到移动设备上。
命令格式： phonegap [子命令] [选项]
| 命令 | 说明 | ||||
| create |
创建新的PhoneGap工程： 举例：
|
||||
| help | 显示帮助信息 |
| 命令 | 说明 | ||
| run |
phonegap run [<platforms>] [options] [-- [platform options]] 准备、构建、安装应用程序到指定平台，如果不提供platforms参数，则对所有已添加的平台执行 options --device 安装到设备 --emulator 安装到模拟器 --target <id> 安装到指定的目标 --debug 以Debug模式构建（默认） --release 以Release模式构建 --nobuild 跳过构建，直接安装 |
||
| platform | 管理平台，支持add、remove、update、check、list操作，与Cordova命令基本一致 | ||
| plugin | 管理插件，支持add、remove、list等操作，与Cordova命令基本一致 | ||
| template |
从既有工程创建模板，或者列出可用模板 |
||
| info | 显示工程的相关信息 ，与Cordova命令基本一致 | ||
| serve |
phonegap serve [options] 作为本地Web应用程序运行，PGDA可以连接到这样的Web服务： options --port, -p <n> HTTP端口，默认3000 --autoreload 当服务器端文件发生变化时，自动刷新PGDA，默认true --no-autoreload 禁止上述刷新 --browser 启用桌面浏览器支持，默认false |
||
| remote |
phonegap remote [command] 在PhoneGap云端构建服务上执行命令： command login 登录到云端构建 logout 从云端构建退出登录 build <platform> 构建指定的平台 install <platform> 安装指定的平台 run <platform> 构建并安装指定的平台 |
||
| prepare | 与对应的Cordova命令基本一致 | ||
| compile | |||
| emulate | |||
| cordova | 执行指定的Cordova命令 |
利用Adobe提供的PhoneGap云端服务，只需要上传PhoneGap应用程序的资产文件（HTML、CSS、JavaScript），后续的构建工作可以在云端完成。使用云构建服务，可以：
- 避免本地维护各套平台SDK、甚至安装多套操作系统的麻烦
- 加快开发周期，在云端可以更快的构建，并且构建结果可以推送到测试人员预安装的App中
云构建服务分为免费、收费版本，免费版本仅支持一个私有（闭源、商业）App。
自动重新加载时，PhoneGap CLI会在控制台上打印信息： [phonegap] 200 /__api__/autoreload
自动重新加载的前提条件是，页面引用cordova的JavaScript文件：
|
1 |
<script type="text/javascript" src="cordova.js"></script> |
此外，某些版本上的模拟器不能正常reload，可能是兼容性问题。
我的手机是越狱后的iOS 6.1.2，在AppStore下载的PGDA 1.5.12，无法连接到通过 phonegap serve 启动的服务器。
到GitHub上逐个下载预构建版本并安装测试，发现：
- 1.5.x：全部不能使用
- 1.4.0：可以连接但无法自动重新加载
- 1.3.0：能够连接，也可以autoreload
很无语……现在安装1.3.0正常使用。
Leave a Reply