PhoneGap是一能够让你用普通的web技术编写出能够轻松调用API接口和进入应用商店的HTML5应用开发平台。是唯一的一个支持7个平台的开源移动框架。它的优势是无以伦比的:开发成本低——据估算,至多Native App的五分之一! 目前Adobe剥离cordova以phonegap作为开发品牌,命令行也由原来的cordova改为phonegap。接下来将记录我安装phonegap3.4.0的过程。 第一步,在线安装 打开命令行输入(请先确认机子有安装nodejs 下载地址http://nodejs.org/) npm install -g phonegap 由于网络的问题,我装了3次才装上。装好之后,就是创建工程了(先确认ant命令 adb命令能正常使用 ps:adb命令在SDK包里的platform-tools文件夹下) phonegap create my_app cd my_app phonegap run android 如果一切正常将会在虚拟机中看到helloworld的app。虚拟机可以通过eclipse先打开。这样就在你的电脑里安装了phonegap。不过工程是用ant的方式创建的,使用起来不是很方便。 第二步,制作jar文件 方法在官方上有介绍,不过需要添加成两个工程xxx 和 xxx-CordovaLib,这显然不够友好。xxx-CordovaLib其实为我们在2.9中使用到的cordova-2.9.0.jar文件,接下来就是制作这个jar文件。命令行下打开phonegap的目录,执行以下命令 cd .cordova/lib/android/cordova/3.4.0/framework android update project -p ant jar 执行成功后在framework目录下就能找到cordova-3.4.0.jar,把这个包扔到工程的libs目录下,这样就不用打开xxx-CordovaLib。 第三步,目录整理 当用eclipse打开的工程你会发现目录结构跟2.9.0差很多,在assets文件目录下只有个_where-is-www.txt,打开这个文件里头有说明: To show `assets/www` or `res/xml/config.xml`, go to:Project -> Properties -> Resource -> Resource Filters And delete the exclusion filter. 按照提示打开项目->属性->资源->资源过滤器,然后删除exclusion 里的选项。 在看目录assets目录下就有www文件夹,res下的xml也生成了config.xml。由于之前有使用ant进行项目的构建所有还有一些没有用的文件夹,模仿2.9.0的目录结构进行删除,这样一个3.4.0的eclipse工程就建立好了。 安装前准备工作 1、下载java sdk 1.6以上版本
2、下载Android Development Tools
已经包括了Android sdk、esclipe,解压即可使用。 https://developer.android.com/sdk/index.html
3、设置系统变量
系统变量 Path后面添加: 一定要注意的是比 在2.9的安装中多了ant的安装,还有就是下面列出来的四个路径不能是中文,不然ant编译会错误 D:\Program Files\ADT\sdk\tools; D:\Program Files\ADT\sdk\platform-tools; D:\Program Files\ADT\sdk\eclipse\plugins\org.apache.ant_1.8.3.v201301120609\bin C:\Program Files (x86)\Java\jdk1.6.0_10\bin; 新增 JAVA_HOME,设置值为java sdk 根目录: C:\Program Files (x86)\Java\jdk1.6.0_10\
配置完成后检测是否安装成功 1.输入 java 如下图表示成功 2.输入 javac 如下图表示成功 3.输入 ant 如下图表示成功
4、下载并安装NodeJS NodeJS
5、进入cmd,执行以下命令安装
npm install cordova
6、新建phonegap 项目
cordova create hello com.example.hello "HelloWorld" cd hello cordova platform add android cordova build
7、使用ADT工具打开并编辑该项目
File>New>Project>Android>Android Project from Existing Code 选择则刚才建立项目所在路径,即可使用ADT打开进行编辑。
8、项目的结构 主要编辑 assets/www 目录下的 html css js 文件。 主目录下面的www目录为 assets/www 目录的引用 直接编辑也是可以的
|
请发表评论