HTML5移动开发之路(21)—— PhoneGap

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(21)—— PhoneGap

一、PhoneGap是什么

PhoneGap 是一个用基于 HTML,CSS 和 JavaScript 的,创建移动跨平台移动应用程序的快速开发框架。它使开发者能够利用 iPhone,Android,Palm,Symbian,WP7,Bada 和 Blackberry 智能手机的核心功能——包括地理定位,加速器,联系人,声音和振动等,此外 PhoneGap 拥有丰富的插件,可以以此扩展无限的功能。PhoneGap 是免费的,但是它需要特定平台提供的附加软件,例如 iPhone 的iPhone SDK,Android 的Android SDK 等,也可以和 DW5.5 配套开发。使用 PhoneGap 只比为每个平台分别建立应用程序好一点点,因为虽然基本代码是一样的,但是你仍然需要为每个平台分别编译应用程序。PhoneGap 针对不同平台的 WebView 做了扩展和封装,使 WebView 这个组件变成可访问设备本地 API的强大浏览器,所以开发人员在 PhoneGap 框架下可通过 JavaScript 访问设备本地 API。

WebView是什么(WebView组件实质是移动设备的内置浏览器 WebView这个内置浏览器特性是Web能被打包成本地客户端的基础,可方便的用 HTML5、CSS3 页面布局,这是移动 Web 技术的优势相对于原生开发)

二、PhoneGap的优势

(1)跨平台:PhoneGap 是唯一的一个支持 7 个平台的开源移动框架(PhoneGap 包括地理定位,加速器,联系人,声音和振动等,此外 PhoneGap 拥有丰富的插件,可以以此扩展无限的功能,几乎 Native App能完成的功能他都能完成)。它的优势是无以伦比的:开发成本低——据估算,至多 Native App 的五分之一!

(2)易用性,基于标准的 Web 开发技术 (html + css +js)

(3)提供硬件访问控制(api)

(4)可利用成熟 javascript 框架(JqueryMobile SenchaTouch)

(5)方便的安装和使用

三、PhoneGap的不足

(1) PhoneGap 应用程序的运行是寄托于移动设备上各平台的内置浏览器 webkit 的,受到 webkit 处理速度影响,以及各个平台的硬件与软件的性能制约,其程序运行的速度会比原生的程序稍微慢点,但是笔者认为,这些问题在 1-2 年内都会解决,因为现在的硬件的发展速度太快了。

(2)还有一些底层的功能需要插件来实现比如(推送功能)

(3)平台差异化不同,PhoneGap 应用程序在所有平台上运行界面看起来都一样。即使这个应用程序与原生应用很相像,但对于习惯了 iOS与 Android 平台的用户来说,会觉得不习惯,他们还是会很快看出差异。通过综合比较 PhoneGap 的优点与不足,我们认为,如果你想快速实现一般的移动 WebApp 或者普通的2D 游戏,那么可以采用 PhoneGap 技术。如果你想要实现需要大量 CPU 计算的应用或者 3D 游戏,或者对用户体验及界面有极致的追求,考虑目前的硬件条件和开发成本,使用原生开发来实现比较适合。

四、PhoneGap 前景

2011 年 10 月 4 日 Adobe 宣布收购了创建了 HTML5 移动应用框架 PhoneGap 和 PhoneGap Build 的新创公司 Nitobi Software。这使得 phonegap 有了坚强的后盾,phonegap 的发展前景也是一片光明。与此同时,PhoneGap 的开源框架已经被累积下载 60 万次,借助 PhoneGap 平台,已有数千应用程序建立在 iOS,android以及其它操作系统之上。

五、Web App, Native APP,Hybird App 介绍

(1)Web App

这个主要是采用统一的标准的 HTML,JavaScript.CSS 等 web 技术开发. 用户无需下载,通过不同平台的浏览器访问来实现跨平台,同时可以通过浏览器支持充分使用 HTML5 特性,缺点是这些基于浏览器的应用无法调用系统 API 来实现一些高级功能,也不适合高性能要求的场合.

(2)Native APP

就是所谓的原生应用.指的是用平台特定的开发语言所开发的应用.使用它们的优点是可以完全利用系统的 API 和平台特性,在性能上也是最好的。缺点是由于开发技术不同,如果你要覆盖多个平台,则要针对每个平台独立开发,无跨平台特性.

(3)Hybird App

则是为了弥补如上两者开发模式的缺陷的产物.分别继承双方的优势.首先它让为数众多的 web 开发人员可以几乎零成本的转型成移动应用开发者;其次,相同的代码只需针对不同平台进行编译就能实现在多平台的分发,大大提高了多平台开发的效率;而相较于 web App,开发者可以通过包装好的接口,调用大部分常用的系统 API。PhoneGap 正是 Hybird APP 的代表开发框架

六、Html5 移动应用软件开发框架 JqueryMobile SenchaTouch 介绍

1.JqueryMobile 介绍

jQuery Mobile 是 jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery 核心库,而且会发布一个完整统一的 jQuery 移动 UI 框架。支持全球主流的移动平台。此框架简单易用。页面开发主要使用标记,无需或仅需很少 JavaScript。此框架简单易用。页面开发主要使用标记,无需或仅需很少 JavaScript。

2.SenchaTouch 介绍

前不久基于 JavaScript 编写的 Ajax 框架 ExtJS,将现有的 ExtJS 整合 JQTouch、Raphaël 库,推出适用于最前沿 Touch Web 的Sencha Touch 框架,该框架是世界上第一个基于 HTML5 的 Mobile App 框架。同时,ExtJS 更名为 Sencha,JQTouch 的创始人 David Kaneda,以及 Raphaël 的创始人也已加盟 Sencha团队

时间: 2024-12-27 00:26:30

HTML5移动开发之路(21)—— PhoneGap的相关文章

HTML5移动开发之路(24)—— PhoneGap Android开发环境搭建

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(24)-- PhoneGap Android开发环境搭建 有关JDK及Android开发环境的搭建请看我前面的博文:http://blog.csdn.net/dawanganban/article/details/9748497 一.下载PhoneGap 下载地址:http://phonegap.com/install/  我下载的是最新的PhoneGap 2.9.1 将下载好的PhoneGap解压缩,可以

HTML5移动开发之路(45)——汇率计算器【1】

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(45)--汇率计算器[1] 这两天看了<PhoneGap实战>上面有一个汇率计算器的例子,个人觉得比较好,就拿出来和大家分享一下,在接下来的几篇文章中我们来一起完成这个PhoneGap + jQuery mobile的小练习. 一.在DrameWeaver中新建站点,如图: 二.编写汇率计算页 [html] view plain copy print? <!doctype html> <

HTML5移动开发之路(29)—— JavaScript回顾4

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(29)-- JavaScript回顾4 一.变量的作用域 JavaScript脚本的执行过程分为两个阶段: 第一阶段,js引擎()先扫描整个javascript代码.当碰到<script>时,会先创建一个全局的活动对象,将<script>中出现的变量的声明,函数的定义保存在活动对 象里面.如果碰到函数,则创建对应的局部活动对象,将函数内部的变量的声明及函数的定义保存在该活动对象里面. 第二阶段

HTML5移动开发之路(30)—— JavaScript回顾5

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(30)-- JavaScript回顾5 一.查找 第一种方式:依据id查找 var obj = document.getElementById(id);   //document是HTMLDocument的实例 [html] view plain copy print? <html> <head> <script> function f1(){ var obj = document

HTML5移动开发之路(27)—— JavaScript回顾2

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(27)-- JavaScript回顾2 JavaScript面向对象基础知识 1.如何定义一个类,使用如下语法来创建一个类 [javascript] view plain copy print? function Person(name, age){ //习惯上第一个字母大写 //this修饰的变量称为属性 this.name = name; this.age = age; //如果属性值是一个函数,则这个

HTML5移动开发之路(28)—— JavaScript回顾3

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(28)-- JavaScript回顾3 一.基本数据类型 number:数字类型 string:字符串 (注意s小写:string是基本类型) boolean:布尔类型   //前三个都有对应的包装类 null:空类型 undefined:未定义类型 测试一: [html] view plain copy print? <html> <!--基本类型测试--> <head> <

HTML5移动开发之路(19)——HTML5 Local Storage(本地存储)

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(19)--HTML5 Local Storage(本地存储) 一.浏览器存储的发展历程 本地存储解决方案很多,比如Flash SharedObject.Google Gears.Cookie.DOM Storage.User Data.window.name.Silverlight.Open Database等. 借用网上的一张图来看下目前主流的本地存储方案: Cookie: 在web中得到广泛应用,但局限

HTML5移动开发之路(20)——HTML5 Web SQL Database

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(20)--HTML5 Web SQL Database 一.Web Database介绍 WebSQL数据库API实际上不是HTML5规范的组成部分,而是单独的规范.它通过一套API来操纵客户端的数据库.Safari.Chrome.Firefox.Opera等主流浏览器都已经支持WebSQL Database WebSQL数据库有三个核心方法: 1)打开数据库openDatabase()方法: 此方法创建数

小强的HTML5移动开发之路(53)——jQueryMobile页面间参数传递

在单页模版中使用基于HTTP的方式通过POST和GET请求传递参数,而在多页模版中不需要与服务器进行通信,通常在多页模版中有以下三种方法来实现页面间的参数传递. 1.GET方式:在前一个页面生成参数并传入下一个页面,然后在下一个页面中进行GET内容解析. 2.通过HTML5的Web Storage进行参数传递. 3.建立当前页面变量,在前一个页面将所需传递的参数内容赋值到变量中,在后一个页面从变量中将参数取出来.(程序灵活性较弱) 一.以GET方式实现页面间参数传递 <!DOCTYPE html