书籍详情
利用HTML5、CSS3和WebGL开发HTML5游戏
作者：雅各布·赛得林（Jacob Seidelin）著 黄蔚瀚 译
出版社：电子工业出版社
出版时间：2014-03-01
ISBN：9787121224232
定价：¥69.00
购买这本书可以去
内容简介
本书利用最新的开放式网页技术，结合JavaScript，CSS3和WebGL技术，使用WebSockets、Canvas、HTML5音频、Web Storage及WebSockets等功能，从零开始创建一个游戏，并搭建一个框架，从而完成整个3D游戏的开发、设置及发布，生动展现可以流畅运行于各种移动终端及浏览器的HTML5游戏的开发过程。
作者简介
黄蔚瀚，有10年的移动产品设计经验，熟悉多种移动开发技术，对游戏设计、音效配乐、用户体验分析有丰富的经验，是HTML5梦工场用户体验分析师。现任百度商业产品研究规划部高级产品设计师。
目录
目 录
第一部分 HTML5游戏入门指导
第1章 网页上的游戏 2
1．1 追溯HTML5的历史 2
1．2 在游戏中使用HTML5 3
1．2．1 canvas（画布） 3
1．2．2 audio（声音） 4
1．2．3 WebSocket（网络接口） 5
1．2．4 Web Storage（网络存储） 6
1．2．5 WebGL（网络图形语言） 7
1．2．6 HTML5（不）是Flash杀手 7
1．3 实现向下兼容性 7
1．3．1 特征检测 7
1．3．2 使用Modernizr检测库 8
1．3．3 用polyfill填充缺口 9
1．4 创建一个游戏 10
1．5 总结 10
第2章 迈出第一步 11
2．1 理解游戏 11
2．1．1 交换宝石 12
2．1．2 配成3个 12
2．1．3 等级进阶 12
2．2 识别游戏阶段 12
2．2．1 启动界面 12
2．2．2 主界面 13
2．2．3 游戏画面 13
2．2．4 最高分 13
2．3 创建程序架构 14
2．3．1 建立HTML 15
2．3．2 添加各种风格 16
2．3．3 加载脚本 17
2．4 创建启动画面 21
2．4．1 使用网络字体 21
2．4．2 装饰启动画面 22
2．5 总结 24
第3章 移植到手机 25
3．1 开发移动网页应用程序 25
3．1．1 一次写，多次读 26
3．1．2 移动平台的挑战 26
3．2 处理用户在移动设备里的输入 26
3．2．1 键盘输入 27
3．2．2 鼠标VS．触摸 27
3．3 适配小屏幕分辨率 28
3．3．1 创建可调整的布局 29
3．3．2 控制视口 31
3．3．3 屏蔽缩放功能 31
3．4 创建不同的视图 32
3．4．1 创建主菜单 32
3．4．2 添加屏幕模块 34
3．4．3 使用CSS媒体查询 37
3．4．4 检测设备的旋转 38
3．4．5 添加一个移动样式表 39
3．5 在iOS和Android设备上开发 42
3．5．1 将网页应用程序发布于主界面上 42
3．5．2 清除浏览器的障碍 49
3．6 调试移动网页应用程序 52
3．6．1 启用Safari调试器 52
3．6．2 访问Android日志 54
3．7 总结 54
第二部分 创建一个简单游戏
第4章 建立游戏 56
4．1 建立游戏面板模块 56
4．1．1 初始化游戏状态 57
4．1．2 填充初始面板 60
4．2 生成规则 62
4．2．1 验证交换 62
4．2．2 检测链 65
4．2．3 重新填充面板 69
4．2．4 交换宝石 72
4．3 总结 74
第5章 将任务委托给Web Workers 75
5．1 使用Web Workers 75
5．1．1 工作线程的使用限制 76
5．1．2 工作线程能做什么 77
5．2 使用工作线程 78
5．2．1 发送消息 78
5．2．2 接收消息 79
5．2．3 捕获错误 79
5．2．4 共享工作线程 79
5．2．5 一个素数检测的例子 81
5．3 在游戏中使用Web Workers 84
5．3．1 创建工作线程模块 84
5．3．2 保持相同的接口 86
5．4 总结 91
第6章 在画布（canvas）里创建图形 92
6．1 canvas与其他方法比较 92
6．1．1 位图图像 92
6．1．2 SVG图像 93
6．1．3 画布canvas 93
6．1．4 何时选择canvas 94
6．2 使用canvas绘制 94
6．2．1 绘制形状和路径 95
6．2．2 使用高级画笔与填充样式 103
6．2．3 使用变换 107
6．2．4 添加文本、图像和阴影 108
6．2．5 管理状态栈 112
6．2．6 绘制HTML5徽标 113
6．2．7 图像合成 119
6．3 访问图像数据 120
6．3．1 获取像素值 120
6．3．2 更新像素值 121
6．3．3 导出图像文件数据 122
6．3．4 理解安全限制 123
6．3．5 创建基于像素的效果 123
6．4 总结 125
第7章 创建游戏界面 126
7．1 预加载游戏文件 126
7．1．1 检测宝石大小 127
7．1．2 修改加载器脚本 128
7．1．3 添加一个进度条 132
7．2 改进背景 135
7．3 创建游戏界面 137
7．3．1 使用canvas绘制面板 139
7．3．2 使用CSS和图片绘制面板 145
7．4 总结 151
第8章 游戏互动 152
8．1 获取用户输入 152
8．1．1 在触摸屏上实现鼠标功能 152
8．1．2 虚拟键盘 153
8．1．3 触摸操作 154
8．1．4 输入操作和canvas 159
8．2 创建输入模块 161
8．2．1 执行游戏操作 165
8．2．2 捆绑输入与游戏函数 170
8．3 总结 177
第9章 绘制游戏动画 178
9．1 让游戏动起来 178
9．1．1 动画计时 179
9．1．2 绘制光标 183
9．1．3 绘制游戏动画 185
9．2 添加分数和事件 193
9．2．1 创建UI元素 194
9．2．2 创建游戏计时器 197
9．2．3 奖励分数 199
9．2．4 游戏结束 207
9．3 总结 210
第三部分 添加3D与声音
第10章 为游戏创建音频 212
10．1 HTML5音频 212
10．1．1 检测音频支持 213
10．1．2 理解音频格式之争 213
10．1．3 寻找音效 215
10．2 使用audio元素 216
10．2．1 播放控制 218
10．2．2 在移动设备上使用音频 222
10．3 使用音频数据 222
10．3．1 使用Mozilla音频数据接口 223
10．3．2 一些例子 225
10．4 建立音频模块 229
10．4．1 为音效回播做准备 230
10．4．2 播放声音效果 231
10．4．3 停止播放 233
10．4．4 清除声音 233
10．5 为游戏添加声音效果 235
10．5．1 在游戏界面里播放音频 235
10．6 总结 236
第11章 使用WebGL创建3D图形 237
11．1 网页上的3D 237
11．1．1 开始使用WebGL 238
11．1．2 调试WebGL 239
11．1．3 创建一个辅助模块 239
11．2 着色器 240
11．2．1 变量和数据类型 240
11．2．2 通过WebGL使用着色引擎 244
11．2．3 统一变量 249
11．2．4 变化变量 250
11．3 渲染3D对象 251
11．3．1 使用顶点缓冲区 251
11．3．2 使用索引缓冲区 253
11．3．3 使用模型、视图和投影 254
11．3．4 渲染 257
11．3．5 加载Collada模块 260
11．4 使用纹理和光照 262
11．4．1 添加光效 262
11．4．2 添加per-pixel 光效 265
11．4．3 创建纹理 268
11．5 创建WebGL显示模块 273
11．5．1 加载WebGL文件 274
11．5．2 设置WebGL 275
11．5．3 渲染宝石 278
11．5．4 让宝石动起来 283
11．6 总结 286
第四部分 本地存储与多人游戏
第12章 本地存储与缓存 288
12．1 使用网页存储器（Web Storage）存储数据 288
12．1．1 使用存储接口 289
12．1．2 建立存储模块 292
12．2 使游戏状态持续 294
12．2．1 退出游戏 294
12．2．2 暂停游戏 296
12．2．3 存储游戏数据 298
12．3 建立高分列表 301
12．3．1 建立高分界面 301
12．3．2 存储高分数据 304
12．3．3 显示高分数据 305
12．4 程序缓存 307
12．4．1 缓存舱单 307
12．5 总结 310
第13章 使用网络接口联网 311
13．1 WebSockets的应用 311
13．1．1 连接服务器 312
13．1．2 与WebSocket连接 314
13．2 在服务器上使用Node 315
13．2．1 安装Node 316
13．2．2 利用Node创建HTTP服务器 318
13．2．3 创建一个WebSocket聊天室 319
13．3 总结 326
第14章 资源 327
14．1 使用中间设备 327
14．1．1 Box2D 327
14．1．2 Impact 329
14．1．3 Three．js 331
14．2 在移动设备上部署 332
14．2．1 PhoneGap 332
14．2．2 Appcelerator Titanium 336
14．3 发布游戏 337
14．3．1 Chrome Web Store 337
14．3．2 Zeewe 338
14．3．3 Android Market 338
14．3．4 App Store 339
14．4 使用线上服务 339
14．4．1 TapJS 339
14．4．2 Playtomic 340
14．4．3 JoyentCloud Node 341
14．5 总结 341
第一部分 HTML5游戏入门指导
第1章 网页上的游戏 2
1．1 追溯HTML5的历史 2
1．2 在游戏中使用HTML5 3
1．2．1 canvas（画布） 3
1．2．2 audio（声音） 4
1．2．3 WebSocket（网络接口） 5
1．2．4 Web Storage（网络存储） 6
1．2．5 WebGL（网络图形语言） 7
1．2．6 HTML5（不）是Flash杀手 7
1．3 实现向下兼容性 7
1．3．1 特征检测 7
1．3．2 使用Modernizr检测库 8
1．3．3 用polyfill填充缺口 9
1．4 创建一个游戏 10
1．5 总结 10
第2章 迈出第一步 11
2．1 理解游戏 11
2．1．1 交换宝石 12
2．1．2 配成3个 12
2．1．3 等级进阶 12
2．2 识别游戏阶段 12
2．2．1 启动界面 12
2．2．2 主界面 13
2．2．3 游戏画面 13
2．2．4 最高分 13
2．3 创建程序架构 14
2．3．1 建立HTML 15
2．3．2 添加各种风格 16
2．3．3 加载脚本 17
2．4 创建启动画面 21
2．4．1 使用网络字体 21
2．4．2 装饰启动画面 22
2．5 总结 24
第3章 移植到手机 25
3．1 开发移动网页应用程序 25
3．1．1 一次写，多次读 26
3．1．2 移动平台的挑战 26
3．2 处理用户在移动设备里的输入 26
3．2．1 键盘输入 27
3．2．2 鼠标VS．触摸 27
3．3 适配小屏幕分辨率 28
3．3．1 创建可调整的布局 29
3．3．2 控制视口 31
3．3．3 屏蔽缩放功能 31
3．4 创建不同的视图 32
3．4．1 创建主菜单 32
3．4．2 添加屏幕模块 34
3．4．3 使用CSS媒体查询 37
3．4．4 检测设备的旋转 38
3．4．5 添加一个移动样式表 39
3．5 在iOS和Android设备上开发 42
3．5．1 将网页应用程序发布于主界面上 42
3．5．2 清除浏览器的障碍 49
3．6 调试移动网页应用程序 52
3．6．1 启用Safari调试器 52
3．6．2 访问Android日志 54
3．7 总结 54
第二部分 创建一个简单游戏
第4章 建立游戏 56
4．1 建立游戏面板模块 56
4．1．1 初始化游戏状态 57
4．1．2 填充初始面板 60
4．2 生成规则 62
4．2．1 验证交换 62
4．2．2 检测链 65
4．2．3 重新填充面板 69
4．2．4 交换宝石 72
4．3 总结 74
第5章 将任务委托给Web Workers 75
5．1 使用Web Workers 75
5．1．1 工作线程的使用限制 76
5．1．2 工作线程能做什么 77
5．2 使用工作线程 78
5．2．1 发送消息 78
5．2．2 接收消息 79
5．2．3 捕获错误 79
5．2．4 共享工作线程 79
5．2．5 一个素数检测的例子 81
5．3 在游戏中使用Web Workers 84
5．3．1 创建工作线程模块 84
5．3．2 保持相同的接口 86
5．4 总结 91
第6章 在画布（canvas）里创建图形 92
6．1 canvas与其他方法比较 92
6．1．1 位图图像 92
6．1．2 SVG图像 93
6．1．3 画布canvas 93
6．1．4 何时选择canvas 94
6．2 使用canvas绘制 94
6．2．1 绘制形状和路径 95
6．2．2 使用高级画笔与填充样式 103
6．2．3 使用变换 107
6．2．4 添加文本、图像和阴影 108
6．2．5 管理状态栈 112
6．2．6 绘制HTML5徽标 113
6．2．7 图像合成 119
6．3 访问图像数据 120
6．3．1 获取像素值 120
6．3．2 更新像素值 121
6．3．3 导出图像文件数据 122
6．3．4 理解安全限制 123
6．3．5 创建基于像素的效果 123
6．4 总结 125
第7章 创建游戏界面 126
7．1 预加载游戏文件 126
7．1．1 检测宝石大小 127
7．1．2 修改加载器脚本 128
7．1．3 添加一个进度条 132
7．2 改进背景 135
7．3 创建游戏界面 137
7．3．1 使用canvas绘制面板 139
7．3．2 使用CSS和图片绘制面板 145
7．4 总结 151
第8章 游戏互动 152
8．1 获取用户输入 152
8．1．1 在触摸屏上实现鼠标功能 152
8．1．2 虚拟键盘 153
8．1．3 触摸操作 154
8．1．4 输入操作和canvas 159
8．2 创建输入模块 161
8．2．1 执行游戏操作 165
8．2．2 捆绑输入与游戏函数 170
8．3 总结 177
第9章 绘制游戏动画 178
9．1 让游戏动起来 178
9．1．1 动画计时 179
9．1．2 绘制光标 183
9．1．3 绘制游戏动画 185
9．2 添加分数和事件 193
9．2．1 创建UI元素 194
9．2．2 创建游戏计时器 197
9．2．3 奖励分数 199
9．2．4 游戏结束 207
9．3 总结 210
第三部分 添加3D与声音
第10章 为游戏创建音频 212
10．1 HTML5音频 212
10．1．1 检测音频支持 213
10．1．2 理解音频格式之争 213
10．1．3 寻找音效 215
10．2 使用audio元素 216
10．2．1 播放控制 218
10．2．2 在移动设备上使用音频 222
10．3 使用音频数据 222
10．3．1 使用Mozilla音频数据接口 223
10．3．2 一些例子 225
10．4 建立音频模块 229
10．4．1 为音效回播做准备 230
10．4．2 播放声音效果 231
10．4．3 停止播放 233
10．4．4 清除声音 233
10．5 为游戏添加声音效果 235
10．5．1 在游戏界面里播放音频 235
10．6 总结 236
第11章 使用WebGL创建3D图形 237
11．1 网页上的3D 237
11．1．1 开始使用WebGL 238
11．1．2 调试WebGL 239
11．1．3 创建一个辅助模块 239
11．2 着色器 240
11．2．1 变量和数据类型 240
11．2．2 通过WebGL使用着色引擎 244
11．2．3 统一变量 249
11．2．4 变化变量 250
11．3 渲染3D对象 251
11．3．1 使用顶点缓冲区 251
11．3．2 使用索引缓冲区 253
11．3．3 使用模型、视图和投影 254
11．3．4 渲染 257
11．3．5 加载Collada模块 260
11．4 使用纹理和光照 262
11．4．1 添加光效 262
11．4．2 添加per-pixel 光效 265
11．4．3 创建纹理 268
11．5 创建WebGL显示模块 273
11．5．1 加载WebGL文件 274
11．5．2 设置WebGL 275
11．5．3 渲染宝石 278
11．5．4 让宝石动起来 283
11．6 总结 286
第四部分 本地存储与多人游戏
第12章 本地存储与缓存 288
12．1 使用网页存储器（Web Storage）存储数据 288
12．1．1 使用存储接口 289
12．1．2 建立存储模块 292
12．2 使游戏状态持续 294
12．2．1 退出游戏 294
12．2．2 暂停游戏 296
12．2．3 存储游戏数据 298
12．3 建立高分列表 301
12．3．1 建立高分界面 301
12．3．2 存储高分数据 304
12．3．3 显示高分数据 305
12．4 程序缓存 307
12．4．1 缓存舱单 307
12．5 总结 310
第13章 使用网络接口联网 311
13．1 WebSockets的应用 311
13．1．1 连接服务器 312
13．1．2 与WebSocket连接 314
13．2 在服务器上使用Node 315
13．2．1 安装Node 316
13．2．2 利用Node创建HTTP服务器 318
13．2．3 创建一个WebSocket聊天室 319
13．3 总结 326
第14章 资源 327
14．1 使用中间设备 327
14．1．1 Box2D 327
14．1．2 Impact 329
14．1．3 Three．js 331
14．2 在移动设备上部署 332
14．2．1 PhoneGap 332
14．2．2 Appcelerator Titanium 336
14．3 发布游戏 337
14．3．1 Chrome Web Store 337
14．3．2 Zeewe 338
14．3．3 Android Market 338
14．3．4 App Store 339
14．4 使用线上服务 339
14．4．1 TapJS 339
14．4．2 Playtomic 340
14．4．3 JoyentCloud Node 341
14．5 总结 341
猜您喜欢
