利用HTML5、CSS3和WebGL开发HTML5游戏 [平装] 7121224232

本书利用最新的开放式网页技术，结合JavaScript，CSS3和WebGL技术，使用WebSockets、Canvas、HTML5音频、Web Storage及WebSockets等功能，从零开始创建一个游戏，并搭建一个框架，从而完成整个3D游戏的开发、设置及发布，生动展现可以流畅运行于各种移动终端及浏览器的HTML5游戏的开发过程。《利用HTML5、CSS3和WebGL开发HTML5游戏》是学习HTML5移动终端游戏及应用开发的很好的入门图书，适合Web前端开发工程师、网友开发人员和游戏设计人员阅读。 黄蔚瀚，有10年的移动产品设计经验，熟悉多种移动开发技术，对游戏设计、音效配乐、用户体验分析有丰富的经验，是HTML5梦工场用户体验分析师。现任百度商业产品研究规划部高级产品设计师。 第一部分HTML5游戏入门指导 第1章网页上的游戏2 1.1追溯HTML5的历史2 1.2在游戏中使用HTML53 1.2.1canvas（画布）3 1.2.2audio（声音）4 1.2.3WebSocket（网络接口）5 1.2.4WebStorage（网络存储）6 1.2.5WebGL（网络图形语言）7 1.2.6HTML5（不）是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建立HTML15 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章将任务委托给WebWorkers75 5.1使用WebWorkers75 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在游戏中使用WebWorkers84 5.3.1创建工作线程模块84 5.3.2保持相同的接口86 5.4总结91 第6章在画布（canvas）里创建图形92 6.1canvas与其他方法比较92 6.1.1位图图像92 6.1.2SVG图像93 6.1.3画布canvas93 6.1.4何时选择canvas94 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输入操作和canvas159 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.1HTML5音频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网页上的3D237 11.1.1开始使用WebGL238 11.1.2调试WebGL239 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设置WebGL275 11.5.3渲染宝石278 11.5.4让宝石动起来283 11.6总结286 第四部分本地存储与多人游戏 第12章本地存储与缓存288 12.1使用网页存储器（WebStorage）存储数据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.1WebSockets的应用311 13.1.1连接服务器312 13.1.2与WebSocket连接314 13.2在服务器上使用Node315 13.2.1安装Node316 13.2.2利用Node创建HTTP服务器318 13.2.3创建一个WebSocket聊天室319 13.3总结326 第14章资源327 14.1使用中间设备327 14.1.1Box2D327 14.1.2Impact329 14.1.3Three.js331 14.2在移动设备上部署332 14.2.1PhoneGap332 14.2.2AppceleratorTitanium336 14.3发布游戏337 14.3.1ChromeWebStore337 14.3.2Zeewe338 14.3.3AndroidMarket338 14.3.4AppStore339 14.4使用线上服务339 14.4.1TapJS339 14.4.2Playtomic340 14.4.3JoyentCloudNode341 14.5总结341 版权页： 插图：