PhoneGap是一能够让你用普通NewsShow的web技术编写出能够轻松调用API接口和进入应用商店的HTML5应用开发平台。是唯一的一个支持7个平台的开源移动框架。它的优势是无以伦比的:开发成本低——据估算,至多Native App的五分之一!
  PhoneGap中文平台:http://www.phonegapcn.com/

一、PhoneGap简介

二、 PhoneGap是如何做到的?

三、安装PhoneGap(Cordova)环境

一、PhoneGap简介

  PhoneGap是一个用基于HTML,CSS和JavaScript的,创建移动跨平台移动应用程序的快速开发平台。它使开发者能够利用 iPhone,Android,Palm,Symbian,WP7,Bada和Blackberry智能手机的核心功能——包括地理定位,加速器,联系 人,声音和振动等,此外PhoneGap拥有丰富的插件,可以调用。现在PhoneGap的代码已经贡献给了Apache软件基金会(ASF),并且改名为 Apache Cordova。这个名字来源于温哥华的科尔多瓦街(Cordova Street),它是创建PhoneGap时Nitobi公司的所在地。

二、PhoneGap是如何做到的?

  使用HTML+CSS+Js开发的Web App, 会被PhoneGap包装成WebView, 嵌入到发布App中。这样最后打包的App实际上就是一个外壳,外壳中包装的就是我们开发的Web App针对不同的平台,PhoneGap会使用不同的平台编译打包。对于NativeAPI的调用,是通过Js调用完成的。这些调用的代码同样会被PhoneGap翻译成不同平台的代码,从而实现对于和不同设别的交互。也就是下图中的Phone Gap Bridge做的事情。

三、安装PhoneGap(Cordova)环境

  Apache Cordova官网安装文档: http://cordova.apache.org/docs/en/3.5.0//guide_cli_index.md.html#The%20Command-Line%20Interface

  这里我为大家整理一下安装流程,因为我的开发环境是android,所以以android开发平台为例:

  第一步,配置安装的准备工作:

  分别下载安装最新的JDK、Android SDK、Apache Ant

  JDK下载地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

  Android SDK下载地址:http://developer.android.com/sdk/index.html

  Apache Ant下载地址:http://ant.apache.org/bindownload.cgi

  安装完成之后,配置好环境变量。

  添加新的环境变量, 根据安装路径,调整下面的路径:

ANDROID_HOME Value: C:\Program Files\adt-bundle-windows-x86_64-\sdk
ANT_HOME Value: C:\Program Files\apacheant
JAVA_HOME Value: C:\Program Files\Java\jdk1..0_05

  添加到Path

%JAVA_HOME%\bin;%ANT_HOME%\bin;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools;

  以上完成后再在Android SDK的安装目录中,有SDK Manager.exe程序,在命令行中启动该程序。
在Tools->Manage AVDs中,创建一个新的Android模拟器。

  

  

  这里有个问题要注意:在创建Android模拟器时,可能会遇到,调加不了设备,那么我们这时候要去检索,第一种图片里面的是否有要安装的install packages

  最后就可以开始在Android平台上编译和运行我们的的第一个PhoneGap程序了。

cordova emulate android   //启动android 虚拟机

  

  第二步,命令行安装配置cordova项目:

  首先下载安装 node.js

  全局安装 cordova:

npm install -g cordova

  创建App:

cordova create hello com.example.hello HelloWorld
  • 第一个参数hello表示在工程目录中创建一个 hello 的文件夹
  • 第二个参数com.example.hello表示包名(反向域名),用于标志不同的 app
  • 第三个参数HelloWorld表示项目的名称,可以在 config.xml 文件中修改

  添加平台:

  进入创建的项目中:

cd hello

  查看已经安装的平台和支持的平台:

cordova platforms list

  在 windows 下,可以通过以下命令添加支持的平台:

cordova platform add wp7
cordova platform add wp8
cordova platform add windows8
cordova platform add amazon-fireos
cordova platform add android
cordova platform add blackberry10
cordova platform add firefoxos

  当然,也可以删除不想要的平台:

cordova platform remove android
cordova platform rm android

  这里注意,window的只能开发andriod app 项目,不能开发ios的。

  编译项目

  通过下面命令,即可编译项目:

cordova build android

  编译完成后可以看到 platforms/android/bin/ 下已经生成了 apk 文件,会发现assets底下多了个www文件夹,为我们写css。html,js的目录,然后res下面的www文件夹可以删掉了。

  测试、运行项目

  启动 android 虚拟机:

cordova emulate android

  运行 app 项目(在虚拟机或者在真机):

cordova run android

  运行结果:

  

  参考资料:

  phonegapcn中国:http://www.phonegapcn.com/

  cordova官网:http://cordova.apache.org/docs/en/3.5.0//guide_cli_index.md.html#The%20Command-Line%20Interface   

  cordova教程: https://ccoenraets.github.io/cordova-tutorial/             

  cordova 初识之命令行工具:http://wenzhixin.net.cn/2014/02/11/cordova_command_line

  我的PhoneGap安装配置经历:http://www.it165.net/pro/html/201407/17784.html

  PhoneGap入门教程(1) - 环境搭建与配置:http://www.zwlme.com/frontend/phonegap-getting-started-tutorial-1.html

PhoneGap安装配置的更多相关文章

  1. 我的PhoneGap安装配置经历

    一.PhoneGap简介 PhoneGap是一个用基于HTML,CSS和JavaScript的,创建移动跨平台移动应用程序的快速开发平台.它使开发者能够利用 iPhone,Android,Palm,S ...

  2. 安装配置PhoneGap开发环境(二)——使用Cordova取代PhoneGap创建项目

    1 Cordova是谁 PhoneGap的官方文档说的非常清楚.Cordova是PhoneGap的引擎,这两者的关系类似于WebKit与Chrome浏览器的关系.所以一些核心的基础操作对于Cordov ...

  3. 安装配置PhoneGap开发环境(一)

    1 安装JDK 略. 2 安装Eclipse并安装ADT插件 Android的官网提供集成了Android插件的Eclipse开发环境. 眼下訪问不了,尝试百度一下其他资源. 3 安装Android  ...

  4. Sencha Toucha 2 —1.环境安装配置、在线打包、离线打包

    环境安装配置        1. 下载 1.1     Sencha Touch 下载 http://cdn.sencha.com/touch/sencha-touch-2.2.1-gpl.zip 1 ...

  5. PhoneGap 安装体验

    npm -v #显示版本,检查npm 是否正确安装. npm install express #安装express模块 npm install -g express #加上 -g 启用global安装 ...

  6. phonegap环境配置与基本操作

    一.开发环境配置: 1.工具环境安装: 安装java sdk 1.6以上版本号,Android Development Tools.ant,系统变量 Path后面加入 新增名稱 JAVA_HOME 值 ...

  7. Phonegap 环境配置

    目前要开发 Web App 还是有比较多的选择的 如 Phonegap.MUI.AppCan,接下来以 Web前端开发工程师 的角度来一个 Phonegap 的 First Blood 一.开发环境: ...

  8. windows7下安装配置phonegap3.0 (cordavo)开发环境 (涉及android sdk配置)

    之前在mac上安装调试过phonegap,现在公司用的是windows7,所以不得不再进行一次windows下的配置工作,顺便也写下来了 主要麻烦的地方是要在win7下添加好几个环境变量,这一块地方特 ...

  9. Hive安装配置指北(含Hive Metastore详解)

    个人主页: http://www.linbingdong.com 本文介绍Hive安装配置的整个过程,包括MySQL.Hive及Metastore的安装配置,并分析了Metastore三种配置方式的区 ...

随机推荐

  1. nagios安装check_linux_stats.pl插件报错Can't locate Sys/Statistics/Linux.pm in @INC的处理?

    问题描述: 今天想有没有监控主机内存的插件可以供nagios来使用,然后找到一个插件check_linux_stats.pl 但是在将脚本上传之后,执行的时候报错 [root@testvm02 lib ...

  2. uwsgi部署web,error while loading shared libraries: libpython2.7.so.1.0: cannot open shared object file: No such file or directory

    使用的是miniconda2安装的python,并且加入了环境变量,可是uwsgi部署web时候仍然报错error while loading shared libraries: libpython2 ...

  3. web实现QQ头像上传截取功能

    由于最近一段时间比较忙,发现好久没写博客了,给大家分享下最近搞的logo上传截取功能.在实现这个功能之前找了一些jq的插件,最后选定了cropper在github中可以找到. 具体的思路是1:选择上传 ...

  4. 关于WPF自定义控件(导航)

    1.在WPF中自定义控件(1)概述 2.在WPF中自定义控件(2) UserControl 3.在WPF中自定义控件(3) CustomControl (上) 4.在WPF中自定义控件(3) Cust ...

  5. ios开发之--MJRefresh上拉加载的时候,tableview会向上偏移

    1,出现这种情况的原因: 这个应该是UITableView最大的改变.我们知道在iOS8引入Self-Sizing之后,我们可以通过实现estimatedRowHeight相关的属性来展示动态的内容, ...

  6. 【Ubuntu】Windows 远程桌面连接ubuntu及xrdp的一些小问题(远程桌面闪退、连接失败、tab补全功能,无菜单栏,error - problem connecting )【转】

    转:https://blog.csdn.net/u014447845/article/details/80291678 1.远程桌面闪退,shell可以用的问题:(1)需要在该用户目录创建一个.xse ...

  7. 后端判断用户是否关闭浏览器(关闭网站相关的全部tab)

    一)程序步骤 1.js 写一个定时请求后端(php),后端接收到请求到,把当前时间戳写入文件 2.php 阻塞,这里我写的是 30 秒,也就是 sleep(30) 3.获取当前时间和文件里的时间作比较 ...

  8. Ubuntu 13.10 下安装搜狗输入法

    1.卸载ibus输入法: sudo apt-get remove ibus     sudo为取得root权限的意思,Ubuntu系统默认root账户关闭,很多操作需要取得root     权限才可以 ...

  9. 使用 requests 配置代理服务

    (1) 如果我们一直用同一个IP去请求同一个网站上的网页,久了之后可能会被该网站服务器屏蔽,因此我们可以使用代理IP来发起请求,代理实际上指的就是代理服务器(2) 当我们使用代理IP发起请求时,服务器 ...

  10. 导入贴图操作:处理贴图MaxSize和Format

    using UnityEngine; using System.Collections; using UnityEditor; public class ImportModflyTextures : ...