PhoneGap从入门到精通

第0章　移动Web开发学习指南 1
本章教学录像：26分钟
移动Web程序是指能够在智能手机、平板电脑、电子书阅读器等可移动设备中完整运行的Web程序。和传统桌面式Web程序相比，移动Web要求程序更加简单、高效，而且具备传统桌面Web程序所没有的硬件优势，例如GPS定位、传感器应用等。本章将简要介绍开发移动Web应用程序的基础知识，以便为读者步入本书后面知识的学习打下基础
0．1 Web标准开发技术 2
0．1．1 结构化标准语言 2
0．1．2 表现性标准语言 2
0．1．3 行为标准 2
0．2 移动Web开发概览 3
0．2．1 主流移动平台介绍 3
0．2．2 移动Web的特点 5
0．2．3 设计移动网站时需要考虑的问题 6
0．2．4 主流移动设备屏幕的分辨率 6
0．2．5 使用标准的HTML、CSS和JavaScript技术 7
0．3 移动Web开发必备技术 7
0．4 移动Web学习路线图 8
0．5 PhoneGap学习路线图 9
第1篇 基础知识
第 1章　PhoneGap基础 12
本章教学录像：31分钟
PhoneGap是基于HTML、CSS和JavaScript的技术，是一个创建跨平台移动应用程序的快速开发平台。PhoneGap使开发者能够利用iPhone、Android、Palm、Symbian、WP7、Bada和Blackberry等智能手机的核心功能，包括地理定位、加速器、联系人、声音和振动等。此外PhoneGap拥有丰富的插件，可以以此扩展无限的功能。本章将详细讲解PhoneGap的基础知识，为读者步入本书后面知识的学习打下基础。
1．1 PhoneGap简介 13
1．1．1 什么是PhoneGap 13
1．1．2 背景介绍 13
1．1．3 PhoneGap的发展历程 14
1．1．4 PhoneGap的主要功能 14
1．1．5 PhoneGap的发展现状 15
1．1．6 PhoneGap优点和缺点分析 15
1．2 PhoneGap API基础 18
1．3 PhoneGap的工作 19
1．4 PhoneGap开发必备技术 19
1．4．1 Titanium框架 19
1．4．2 Adobe AIR技术 20
1．4．3 Corona库 21
1．4．4 常用的JavaScript移动UI框架 21
1．5 高手点拨 22
1．6 实战练习 22
第2章　使用PhoneGap开发移动Web应用 23
本章教学录像：22分钟
在充分了解PhoneGap的重要性和具体功能之后，本章将详细讲解使用PhoneGap开发移动Web应用程序的基础知识，以带领读者进入PhoneGap框架开发的学习阶段。
2．1 使用PhoneGap进行移动Web开发的步骤 24
2．2 搭建PhoneGap开发环境 24
2．2．1 准备工作 24
2．2．2 获得PhoneGap开发包 25
2．3 搭建Android开发环境 31
2．3．1 安装Android SDK的系统要求 31
2．3．2 安装JDK 31
2．3．3 获取并安装Eclipse和Android SDK 36
2．3．4 安装ADT 38
2．3．5 设定Android SDK Home 40
2．3．6 验证开发环境 41
2．3．7 实战演练—创建Android虚拟设备 42
2．3．8 实战演练—启动AVD模拟器 44
2．3．9 实战演练—在Android平台创建基于PhoneGap的程序 45
2．4 搭建iOS开发环境 52
2．4．1 搭建前的准备—加入iOS开发团队 52
2．4．2 安装Xcode 54
2．4．3 创建一个Xcode项目并启动模拟器 58
2．5 综合应用—在iOS平台创建基于PhoneGap的程序 62
2．6 高手点拨 65
2．7 实战练习 66
第2篇 必备技术
第3章　HTML5技术初步 68
本章教学录像：42分钟
HTML5是文本标记语言HTML的最新版本，其提供了一些新的元素和属性。除了原先的DOM接口外，HTML5还增加了更多API。本章将详细讲解HTML5的基础知识，特别是新特性方面的知识。
3．1 HTML5简介 69
3．1．1 发展历程 69
3．1．2 HTML5的吸引力 69
3．2 视频处理 70
3．2．1 video标记概述 70
3．2．2 autoplay 属性实战—自动播放一个视频 71
3．2．3 controls属性实战—控制播放的视频 73
3．2．4 height属性实战—设置播放视频的高度 74
3．2．5 其他属性 75
3．3 音频处理 76
3．3．1 audio标记概述 76
3．3．2 autoplay属性实战—自动播放一个音频 77
3．3．3 controls属性实战—控制播放的音频 78
3．3．4 loop 属性实战—循环播放音频 79
3．3．5 其他属性 80
3．4 Canvas画布处理 81
3．4．1 Canvas标记介绍 81
3．4．2 HTML DOM Canvas 对象 81
3．4．3 实战演练—实现坐标定位 82
3．4．4 实战演练—在指定位置画线 84
3．4．5 实战演练—绘制一个圆 84
3．4．6 实战演练—用渐变色填充一个矩形 85
3．4．7 实战演练—显示一幅指定的图片 86
3．5 Web数据存储 88
3．5．1 Web存储简介 88
3．5．2 HTML5中Web存储的意义 88
3．5．3 localStorage存储实战—显示访问页面的统计次数 88
3．5．4 sessionStorage 存储实战—显示访问页面的统计次数 90
3．6 表单的新特性 91
3．6．1 全新的Input 类型 91
3．6．2 全新的表单元素 95
3．6．3 全新的表单属性 97
3．7 综合应用—制作一个颜色滑动控制器 103
3．8 高手点拨 105
3．9 实战练习 105
第4章　CSS基础 107
本章教学录像：40分钟
CSS（层叠式样式表）是Cascading Style Sheet的缩写，中文名称为样式表，是W3C组织制定的、控制页面显示样式的标记语言。本章将详细讲解CSS技术的基础知识。
4．1 体验CSS的功能 108
4．2 基本语法 109
4．3 使用选择符 110
4．3．1 选择符的种类 110
4．3．2 实战演练—使用ID选择符设置文字颜色 112
4．4 CSS属性 113
4．5 几个常用值 115
4．5．1 颜色单位 115
4．5．2 长度单位 117
4．5．3 百分比值 118
4．5．4 URL统一资源定位符 118
4．5．5 URL默认值 119
4．6 在网页中使用CSS 119
4．6．1 页面调用CSS方式 119
4．6．2 通用优先级实战 122
4．6．3 类型选择符和类选择符实战 123
4．6．4 ID选择符实战 124
4．6．5 最近优先原则实战 125
4．7 CSS的编码规范 127
4．7．1 书写规范 127
4．7．2 命名规范 128
4．8 CSS调试 128
4．8．1 设计软件调试 129
4．8．2 继承性和默认值带来的问题 129
4．9 综合应用—实现精致、符合标准的表单页面 131
4．10 高手点拨 133
4．11 实战练习 134
第5章　jQuery Mobile基础 135
本章教学录像：37分钟
jQuery Mobile具有一些独一无二的重要特征。本章将讲解jQuery Mobile的基础语法知识和具体用法。
5．1 jQuery Mobile简介 136
5．1．1 jQuery简介 136
5．1．2 jQuery Mobile的特点 136
5．1．3 对浏览器的支持 137
5．1．4 对平台的支持 138
5．2 jQuery Mobile的特性 139
5．2．1 跨所有移动平台的统一UI 139
5．2．2 简化的标记驱动的开发 139
5．2．3 渐进式增强 139
5．2．4 响应式设计 140
5．3 获取jQuery Mobile 140
5．3．1 下载插件 141
5．3．2 使用URL方式加载插件文件 142
5．4 页面结构 143
5．4．1 实战演练—使用基本框架 143
5．4．2 实战演练—使用多页面模板 146
5．4．3 实战演练—设置内部页面的标题 148
5．5 导航链接处理 150
5．5．1 实战演练—设置外部页面链接 151
5．5．2 实战演练—设置页面后退链接 153
5．6 使用Ajax修饰导航 154
5．6．1 实战演练—使用Ajax驱动导航 154
5．6．2 使用函数changePage() 157
5．7 综合应用—开发一个移动版Ajax网页 159
5．8 高手点拨 165
5．9 实战练习 166
第6章　PhoneGap事件详解 167
本章教学录像：29分钟
在PhoneGap开发应用中，事件是其他PhoneGap API的基础，在事件监听器中，包含了调用其他API的功能函数。本章将详细讲解PhoneGap所独有的事件列表，而不讨论传统网页元素所能触发的事件。
6．1 PhoneGap的事件列表 168
6．2 deviceready事件详解 169
6．2．1 deviceready事件基础 169
6．2．2 实战演练—使用deviceready 事件 170
6．3 pause事件和resume事件 172
6．3．1 实战演练—使用pause事件 172
6．3．2 实战演练—使用resume事件 173
6．4 online事件和offline事件 176
6．4．1 实战演练—使用online事件 176
6．4．2 实战演练—使用offline事件 178
6．5 batterycritical、batterylow和batterystatus事件 179
6．5．1 使用batterycritical事件 179
6．5．2 使用batterylow事件 180
6．5．3 实战演练—使用batterystatus事件 181
6．6 backbutton事件 185
6．7 使用searchbutton事件 186
6．8 使用其他事件 187
6．8．1 使用menubutton事件 187
6．8．2 使用startcallbutton事件 188
6．8．3 使用endcallbutton事件 189
6．8．4 使用volumedownbutton事件 190
6．8．5 使用volumeupbutton事件 191
6．9 综合应用—监听各类PhoneGap事件 192
6．10 高手点拨 194
6．11 实战练习 194
第3篇 核心内容
第 7章　应用和通知API详解 196
本章教学录像：17分钟
在PhoneGap开发应用中，API是整个框架的核心内容，有助于实现常见的移动Web应用。本章将讲解PhoneGap中的应用API和通知API的基础知识。
7．1 应用API 197
7．1．1 白名单安全机制 197
7．1．2 访问对象的方法 197
7．2 Notification通知 198
7．2．1 主要对象 199
7．2．2 实战演练—使用notification．alert()方法 199
7．2．3 实战演练—使用notification．confirm()方法 201
7．2．4 实战演练—使用notification．beep()方法 203
7．2．5 实战演练—使用notification．vibrate()方法 205
7．2．6 实战演练—使用活动指示器和进度对话框通知 207
7．3 综合应用—演示各种API的基本用法 210
7．4 高手点拨 217
7．5 实战练习 218
第 8章　设备、网络连接和加速计API详解 219
本章教学录像：16分钟
本章将详细讲解PhoneGap中的设备、网络连接和加速计API的相关知识。
8．1 设备API 220
8．1．1 主要对象 220
8．1．2 使用device．name()方法 220
8．1．3 使用device．phonegap()方法 221
8．1．4 使用device．platform()方法 221
8．1．5 使用device．uuid()方法 222
8．1．6 使用device．version()方法 223
8．1．7 实战演练—使用设备API 223
8．2 网络连接API 224
8．2．1 属性和常量 224
8．2．2 实战演练—检测当前网络状况 225
8．3 加速计API 227
8．3．1 使用acceleration对象 227
8．3．2 实战演练—使用getCurrentAcceleration获取加速度 228
8．3．3 实战演练—使用watchAcceleration获取加速度 230
8．3．4 实战演练—使用clearWatch清除加速度 232
8．4 综合应用—实现一个蓝牙控制器 234
8．5 高手点拨 253
8．6 实战练习 254
第9章　地理位置API详解 255
本章教学录像：26分钟
在现实应用中，很多智能手机都拥有GPS功能。PhoneGap应用专门提供了地理位置API来实现GPS位置定位功能。本章将详细讲解地理位置API的相关知识。
9．1 地理位置基础 256
9．1．1 应用背景 256
9．1．2 Geolocation接口介绍 256
9．2 Geolocation对象详解 257
9．2．1 实战演练—使用Position对象 257
9．2．2 PositionError对象 259
9．2．3 实战演练—使用Coordinates对象 260
9．3 地理位置API的参数 262
9．3．1 geolocationSuccess 262
9．3．2 geolocationOptions 262
9．4 操作方法 263
9．4．1 实战演练—获取设备当前的地理位置信息 263
9．4．2 实战演练—定期获取设备的地理位置信息 266
9．4．3 实战演练—取消定期获取设备的地理位置信息 268
9．4．4 实战演练—使用Geolocation 270
9．5 综合应用—联合使用Geolocation和百度地图实现定位功能 272
9．6 高手点拨 275
9．7 实战练习 276
第10章　指南针API详解 277
本章教学录像：19分钟
在现实应用中，智能手机中的指南针功能可以确保我们在行程之中不会迷失方向。在PhoneGap应用中，专门提供了指南针API来实现方向定位功能。本章将详细讲解指南针API的相关知识和具体用法。
10．1 指南针API的对象 278
10．1．1 CompassHeading对象 278
10．1．2 CompassError对象 278
10．1．3 onSuccess函数 278
10．1．4 CompassOptions对象 279
10．2 指南针API中的函数 279
10．2．1 实战演练—获取设备当前的指南针信息 279
10．2．2 实战演练—定期获取设备的指南针信息 281
10．2．3 实战演练—取消定期获取设备的指南针信息 283
10．2．4 实战演练—获取罗盘的朝向度数 286
10．2．5 实战演练—停止对罗盘的监听 288
10．3 综合应用—实现一个移动版指南针 290
10．4 高手点拨 296
10．5 实战练习 296
第11章　照相机API详解 297
本章教学录像：27分钟
很多智能手机都具有多媒体功能，例如相机、视频、音乐、录像等，以适应用户的需要。在PhoneGap应用中，专门提供了针对相机应用的API，即Camera。本章将详细讲解Camera的相关知识。
11．1 照相机API的函数 298
11．1．1 函数camera．getPicture() 298
11．1．2 cameraSuccess 300
11．1．3 cameraError 301
11．1．4 实战演练—在网页中触发照相机 301
11．2 业务操作 303
11．2．1 业务操作基础 304
11．2．2 实战演练—使用照相机API 305
11．3 综合应用—实现拍照并设置为头像功能 308
11．4 综合应用—实现拍照并查看相册功能 313
11．5 高手点拨 316
11．6 实战练习 316
第12章　采集API详解 317
本章教学录像：21分钟
PhoneGap相关应用专门提供了针对多媒体信息采集的API，即Capture。本章将详细讲解采集API—Capture的相关知识。
12．1 主要对象 318
12．1．1 Capture对象 318
12．1．2 CaptureAudioOptions对象 318
12．1．3 CaptureImageOptions对象 319
12．1．4 CaptureVideoOptions对象 319
12．1．5 CaptureCB函数 320
12．1．6 CaptureErrorCB函数 320
12．1．7 ConfigurationData对象 321
12．1．8 MediaFile对象 321
12．1．9 MediaFileData对象 321
12．2 主要方法 322
12．2．1 实战演练—使用capture．captureAudio()方法 322
12．2．2 实战演练—使用capture．captureImage()方法 324
12．2．3 MediaFile．getFormatData()方法 327
12．3 综合应用—Video视频采集器 327
12．4 高手点拨 330
12．5 实战练习 330
第13章　媒体API详解 331
本章教学录像：20分钟
PhoneGap应用专门提供了针对多媒体应用的API，即Media。在本章的内容中，将详细讲解Media的相关知识。
13．1 主要参数 332
13．2 主要方法 332
13．2．1 实战演练—使用media．getCurrentPosition()方法 333
13．2．2 实战演练—使用media．getDuration()方法 336
13．2．3 实战演练—使用play()方法 339
13．2．4 media．pause()方法 342
13．2．5 media．release()方法 343
13．2．6 实战演练—使用media．startRecord()方法 346
13．2．7 media．stop()方法 348
13．2．8 media．stopRecord()方法 351
13．3 综合应用—播放本地视频 354
13．4 高手点拨 358
13．5 实战练习 358
第14章　通讯录API详解 359
本章教学录像：27分钟
在现实应用中，无论是智能手机还是非智能手机，都具有通讯录功能，通过通讯录能够快速找到联系人的信息。PhoneGap应用专门提供了针对通讯录的API，即Contacts。本章将详细讲解通讯录API的相关知识。
14．1 主要对象 360
14．1．1 实战演练—使用Contact对象 360
14．1．2 实战演练—使用ContactName对象 364
14．1．3 实战演练—使用ContactField对象 367
14．1．4 实战演练—使用ContactAddress对象 370
14．1．5 ContactOrganization对象 372
14．1．6 ContactFindOptions对象 374
14．2 包含的方法 376
14．2．1 实战演练—查找联系人方法 376
14．2．2 创建联系人 378
14．2．3 保存联系人 379
14．2．4 删除联系人 379
14．3 综合应用—创建一个简易的Web版通讯录 380
14．4 高手点拨 387
14．5 实战练习 388
第15章　数据存储API详解 389
本章教学录像：18分钟
在现实应用中，无论是智能手机还是非智能手机，都需要具备数据存储功能。通过此功能，多种信息可被存储为本地数据。PhoneGap应用专门提供了实现数据存储应用的API，即Storage。本章将详细讲解Storage的相关知识。
15．1 主要对象 390
15．1．1 Database对象 390
15．1．2 SQLTransaction对象 392
15．1．3 SQLResultSet对象 394
15．1．4 SQLResultSetList对象 396
15．1．5 SQLError对象 397
15．1．6 localStorage对象 397
15．2 主要方法 399
15．3 综合应用—实现数据操作处理 400
15．4 高手点拨 405
15．5 实战练习 406
第16章　文件操作API详解 407
本章教学录像：34分钟
在PhoneGap应用中，文件API是File，其提供了操作任意格式文件的功能，用于处理那些不适合数据库的用户场景。本章将详细讲解文件API的相关知识。
16．1 主要对象 408
16．1．1 DirectoryEntry对象 408
16．1．2 DirectoryReader对象和File对象 408
16．1．3 FileEntry对象 409
16．1．4 FileReader对象 409
16．1．5 实战演练—使用FileSystem对象 410
16．1．6 FileTransfer对象 412
16．1．7 FileUploadOptions对象和FileUploadResult对象 414
16．1．8 实战演练—使用FileWriter对象 414
16．1．9 Flags对象 418
16．1．10 LocalFileSystem对象 418
16．1．11 Metadata对象 420
16．2 主要方法 420
16．2．1 方法entry．getMetadata() 420
16．2．2 方法entry．moveTo() 421
16．2．3 方法entry．copyTo() 422
16．2．4 方法entry．toURI() 423
16．2．5 方法entry．remove() 423
16．2．6 方法entry．getParent() 423
16．2．7 方法entry．createReader()和方法entry．getDirectory() 424
16．2．8 方法entry．getFile() 424
16．2．9 方法entry．removeRecursively() 425
16．2．10 方法readEntries() 426
16．2．11 方法entry．createWriter() 426
16．2．12 实战演练—使用方法ReadAsDataURL()和方法ReadAsText() 427
16．2．13 方法upload() 429
16．2．14 实战演练—使用方法download() 431
16．3 综合应用—实现拍照并上传功能 434
16．4 高手点拨 439
16．5 实战练习 440
第17章　PhoneGap的插件 441
本章教学录像：20分钟
在现实开发应用中，利用PhoneGap开发设计更加复杂的移动Web应用时，前面讲解的知识就难以胜任了，这时候我们可以尝试插件。本章将详细讲解PhoneGap插件的相关知识。
17．1 PhoneGap插件基础 442
17．2 使用PhoneGap插件 443
17．2．1 ChildBrowser插件介绍 443
17．2．2 实战演练—使用ChildBrowser插件 443
17．3 实现PhoneGap插件 448
17．3．1 编写前的准备 448
17．3．2 实战演练—编写PhoneGap插件 448
17．3．3 将PhoneGap嵌入到iOS程序中 454
17．4 常用的PhoneGap插件 455
17．4．1 NativeControls插件 455
17．4．2 WebGL插件 457
17．5 综合应用—使用插件实现弹出软键盘效果 457
17．6 综合应用—调用二维码扫描插件 464
17．7 实战练习 474
第4篇 综合实战
第 18章　电话本管理系统 476
本章教学录像：16分钟
经过本书前面内容的学习，读者已经掌握了使用PhoneGap框架开发移动Web程序的基础知识。在本章的内容中，我们将综合运用前面所学的知识，并结合使用HTML5、CSS3和JavaScript技术，开发一个在移动平台运行的电话本管理系统。希望读者认真阅读本章内容，仔细品味HTML5+jQuery Mobile+PhoneGap组合在移动Web开发领域的真谛。
18．1 需求分析 477
18．1．1 产生背景 477
18．1．2 功能分析 477
18．2 创建Android工程 478
18．3 实现系统主界面 479
18．4 实现信息查询模块 481
18．5 实现系统管理模块 483
18．6 实现信息添加模块 487
18．7 实现信息修改模块 489
18．8 实现信息删除模块和更新模块 492
第19章　RSS订阅系统 493
本章教学录像：13分钟
RSS（Really Simple Syndication，简易信息聚合）是在线共享内容的一种简易方式，也叫聚合内容。通常在时效性比较强的内容上使用RSS订阅能更快速地获取信息，而网站提供RSS输出，有利于让用户获取网站内容的最新更新。本章综合运用前面所学的知识，详细讲解使用HTML5、CSS3、jQuery Mobile和PhoneGap等技术来开发一个Web版RSS订阅系统的方法。
19．1 RSS基础 494
19．1．1 RSS的用途 494
19．1．2 RSS的基本语法 494
19．2 SAX技术简介 496
19．2．1 SAX的原理 496
19．2．2 基于对象和基于事件的接口 496
19．2．3 常用的接口和类 497
19．3 功能介绍 500
19．4 创建Android工程 501
19．5 系统主界面 502
19．5．1 文件头信息 502
19．5．2 显示顶部导航 503
19．5．3 显示城市天气信息 503
19．5．4 显示订阅栏目信息 505
19．6 订阅管理 510
19．6．1 管理订阅 510
19．6．2 添加或取消订阅 520
19．7 设置功能 521
19．7．1 展示系统设置功能 521
19．7．2 换肤设置 523
19．7．3 数目设置 524
19．7．4 设置连接方式 524
19．7．5 清空订阅 525
19．8 RSS信息展示 526
19．9 系统调试 532