PhoneGap 开发环境搭建

PhoneGap是一个跨平台的移动互联开发框架。 本文是基于Windows10与Android客户端的角度，讲解PhoneGap开发环境搭建。

一、环境下载

  1、JDK下载

  2、带ADT插件的Eclipse + Android SDK

  3、Ant打包工具包

  4、Node.js

  5、PhoneGap2.9.1下载

  6、PhoneGap-Desktop-Beta-0.1.1-win.zip（PhoneGap桌面工具）

二、安装环境

  1、JDK的安装及配置就不说了，大家都懂。

  2、上面给的带ADT插件的Eclipse（adt-bundle-windows），解压就可以用，然后Android SDK也是下载安装，在Eclipse里面配置一下SDK Location就可以。有Android开发基础的都知道~~

  3、Ant下载完后解压，放一个合适的路径（如“D:\Java”），最好不要带中文...然后配置环境变量！

   ANT_HOME：D:\Java\apache-ant-1.9.6

   Path加入：%ANT_HOME%\bin;

   CLASSPATH加入：%ANT_HOME%\lib;

  4、测试Ant，运行CMD，执行“ant”与“ant -version”这两条命令，看到以下结果表示成功，否则检查环境变量配置对没...

  5、Node.js直接安装~~

  6、运行CMD，切换到Node.js安装目录下，分别执行“npm install -g phonegap” 、“npm install -g cordova”这两条命令安装PhoneGap和Cordova

  7、测试PhoneGap是否安装成功，如下图所示，表示安装成功。

  8、PhoneGap也可以不用命令行安装，直接安装PhoneGap提供的桌面工具，下载地址：PhoneGap-Desktop-Beta-0.1.1-win.zip，安装完后打开，也可创建项目~~如图

三、项目开发示例

  1、在命令行可通过“phonegap create SecondApp”、“cdSecondApp”、“phonegap run android” 这三条命令来创建我们的项目，如图~~

  2、完成后我们可以看到项目的目录结构如下。

.cordova  : 存放配置文件
platforms : 存放编译好后的android文件
plugins   : 存放phonegap插件
www       : 存放HTML5/CSS/JS/IMG 文件

  3、新建一个Eclipse项目，名为PhoneGap，分别把SecondApp项目的platforms下的asset、cordova、platform_www拷贝到项目的对应位置下，如图~~

  4、导入SecondApp项目Platforms的CordovaLib到Eclipse作为PhoneGap的Library~如图~~若导入CordovaLib报错、引用Library有小红叉，请看：PhoneGap 工程导入出错的解决办法

  5、在我们新建的PhoneGap的Activity里面做如下更改

package com.newland.phonegap;

import org.apache.cordova.CordovaActivity;

import android.os.Bundle;

public class MainActivity extends CordovaActivity { //不是继承Activity，而是继承CordovaActivity 
    @Override
    public void onCreate(Bundle savedInstanceState) {
    	// TODO Auto-generated method stub
    	super.onCreate(savedInstanceState);
    	// 去掉setContentView()
    	super.loadUrl("file:///android_asset/www/index.html"); // 启动资源文件里面的index.html
    }
    
}

  6、更改完毕，run起来吧~~我们可以看到PhoneGap的默认界面~~搞定~~

  最后，附上项目Demo的下载地址：PhoneGap Demo下载.rar