Cocos2d JS游戏开发

凌建风

飞鱼科技国际有限公司客户端程序员，触控科技认证CVP，Cocos2d-JS方向的大牛导师。从毕业到现在，一直从事Cocos2d-x和Cocos2d-JS游戏开发，先后在Cocos引擎中文官网和全球领先的苹果开发者社区CocoaChina发表多篇博文以及两套Cocos2d-JS视频教程。

第一部分 基础篇

第1章 Cocos2d-JS介绍2

1.1 Cocos2d引擎家族2

1.1.1 Cocos2d的诞生3

1.1.2 Cocos引擎家族大事记4

1.2 Cocos2d-JS介绍5

1.3 引擎目录结构6

1.4 小结7

1.5 参考资源7

第2章 Hello World8

2.1 Cocos Console8

2.1.1 安装Python8

2.1.2 Android环境配置10

2.2 创建、编译和运行工程12

2.3 HelloWorld的目录结构13

2.4 项目在Web和Native上的启动流程16

2.5 项目在各平台下的打包以及部署18

2.6 js-tests测试工程22

2.7 为《保卫萝卜2》项目做准备23

2.8 实例——利用Cocos DevTools 学习Cocos2d-JS27

2.9 小结29

2.10 参考资源29

第3章 核心框架30

3.1 导演30

3.1.1 设置帧率31

3.1.2 初始化管理器31

3.1.3 初始化渲染器32

3.1.4 获取屏幕大小32

3.1.5 执行游戏主循环32

3.2 Cocos2d-JS坐标系33

3.3 节点34

3.3.1 基础属性35

3.3.2 图形属性39

3.3.3 其他属性41

3.3.4 常用函数43

3.4 场景47

3.4.1 再探导演——场景管理47

3.4.2 切换特效48

3.4.3 场景的生命周期49

3.5 层50

3.6 精灵52

3.6.1 通过图片资源创建52

3.6.2 通过纹理创建52

3.6.3 通过精灵表单创建53

3.6.4 创建带有颜色的精灵53

3.7 场景树54

3.8 标签54

3.8.1 cc.LabelTTF字体标签54

3.8.2 cc.LabelBMFont位图标签56

3.8.3 cc.LabelAtlas字符映射标签57

3.8.4 使用编辑器制作FNT字体58

3.9 实例——《保卫萝卜2》主页面开发61

3.9.1 主页面设计思路62

3.9.2 视图设定63

3.9.3 代码文件架构63

3.9.4 主页面BackgroundLayer开发64

3.9.5 主页面MainLayer开发65

3.10 小结66

3.11 参考资源66

第4章 动作模块67

4.1 cc.Action67

4.2 瞬时动作68

4.2.1 cc.Place69

4.2.2 cc.FlipX和cc.FlipY69

4.2.3 cc.Show和cc.Hide69

4.2.4 cc.ToggleVisibility69

4.2.5 cc.RemoveSelf69

4.2.6 cc.CallFun70

4.3 持续动作70

4.3.1 属性变化动作71

4.3.2 视觉特效动作73

4.3.3 复合动作75

4.4 变速动作76

4.4.1 cc.Speed76

4.4.2 cc.ActionEase77

4.5 实例——让《保卫萝卜2》的主界面动起来79

4.6 小结81

4.7 参考资源81

第5章 事件机制82

5.1 事件82

5.2 事件管理器83

5.2.1 添加事件监听器83

5.2.2 删除事件监听器84

5.2.3 设置事件监听器的优先级84

5.2.4 分发事件85

5.3 触摸事件85

5.3.1 单点触摸85

5.3.2 多点触摸87

5.4 加速计事件88

5.5 键盘事件89

5.6 鼠标事件90

5.7 自定义事件91

5.8 实例——虚拟摇杆封装92

5.9 小结99

5.10 参考资源99

第6章 音频处理100

6.1 Cocos2d-JS中的音频100

6.1.1 cc.audioEngine的常用API100

6.1.2 各平台下支持的音频格式101

6.2 背景音乐何时播放102

6.3 实例——给《保卫萝卜2》添加音频104

6.4 小结104

6.5 参考资源105

第7章 屏幕适配106

7.1 屏幕适配原理106

7.2 如何使用适配模式108

7.3 系统预设适配模式110

7.3.1 cc.ResolutionPolicy.SHOW_ALL110

7.3.2 cc.ResolutionPolicy.NO_BORDER110

7.3.3 cc.ResolutionPolicy.EXACT_FIT111

7.3.4 cc.ResolutionPolicy.FIXED_HEIGHT112

7.3.5 cc.ResolutionPolicy.FIXED_WIDTH113

7.4 推荐的适配方案113

7.5 小结115

7.6 参考资源116

第二部分 进阶篇

第8章 数据存储118

8.1 cc.sys.localStorage118

8.2 JSON文件读取119

8.3 plist文件读取120

8.4 SQLite实现121

8.5 实例——解锁《保卫萝卜2》的“天天向上”玩法121

8.6 小结126

8.7 参考资源126

第9章 粒子系统127

9.1 粒子系统概述127

9.2 Cocos2d-JS中的粒子系统128

9.3 ParticleDesigner编辑器133

9.4 ParticleEditor编辑器135

9.5 在Cocos2d-JS中使用粒子系统136

9.6 小结137

9.7 参考资源137

第10章 UI控件138

10.1 ccui.Widget父类138

10.2 ccui.Text文本141

10.2.1 ccui.Text字体文本142

10.2.2 ccui.TextBMFont位图文本143

10.2.3 ccui.TextAtlas字符映射文本144

10.3 ccui.Button按钮144

10.4 ccui.CheckBox复选框147

10.5 ccui.Slider滑块149

10.6 ccui.ImageView图片视图150

10.7 ccui.LoadingBar加载条151

10.8 ccui.TextField编辑框152

10.9 ccui.Layout布局154

10.10 ccui.ScrollView滚动视图158

10.11 ccui.PageView分页视图161

10.12 ccui.ListView列表视图163

10.13 实例——《保卫萝卜2》关卡选择页面的开发166

10.14 小结170

10.15 参考资源170

第11章 性能优化171

11.1 对象缓冲池171

11.1.1 让我们的类支持cc.pool管理172

11.1.2 使用cc.pool管理对象173

11.2 批量渲染174

11.2.1 Cocos2d-JS中的SpriteBatchNode类175

11.2.2 使用SpriteBatchNode176

11.3 烘培层177

11.4 SpriteSheet资源优化178

11.4.1 图片内存计算178

11.4.2 TexturePacker179

11.4.3 图片资源压缩182

11.5 小结183

第12章 游戏地图184

12.1 瓦片地图原理184

12.2 Tiled Map Editor简介185

12.3 Tiled Map Editor工作区介绍186

12.3.1 工具栏186

12.3.2 地图编辑区186

12.3.3 迷你地图、对象、图层区187

12.3.4 图块、地形区188

12.3.5 Cocos2d-JS支持的地图类型188

12.3.6 瓦片地图坐标系189

12.4 使用Tiled Map Editor制作一个地图189

12.4.1 新建地图190

12.4.2 新建图块190

12.4.3 新建层191

12.4.4 编辑地图191

12.5 在Cocos2d-JS中使用瓦片地图193

12.5.1 cc.TMXTiledMap地图对象193

12.5.2 cc.TMXLayer图层对象195

12.5.3 cc.TMXObjectGroup对象组197

12.6 小结198

12.7 参考资源198

第三部分 高级篇

第13章 反射调用200

13.1 反射调用概述200

13.2 反射调用Objective-C201

13.3 反射调用Java201

13.4 小结203

13.5 参考资源203

第14章 Chipmunk物理引擎204

14.1 物理概念204

14.1.1 刚体204

14.1.2 面积205

14.1.3 质量205

14.1.4 密度205

14.1.5 转动惯量205

14.1.6 弹性系数205

14.1.7 摩擦系数205

14.2 Chipmunk中的基本概念206

14.2.1 基本类型206

14.2.2 Chipmunk的坐标系统206

14.2.3 Chipmunk中的基本数据结构206

14.3 刚体208

14.3.1 动态刚体210

14.3.2 静态刚体213

14.4 形状214

14.4.1 基类cp.Shape214

14.4.2 圆形216

14.4.3 线段216

14.4.4 凸多边形216

14.5 约束217

14.5.1 基类cp.Constraint217

14.5.2 Pin Joint218

14.5.3 Slide Joint218

14.5.4 Pivot Joint218

14.5.5 Groove Joint218

14.5.6 Damped Spring219

14.5.7 Damped Rotary Spring219

14.5.8 Rotary Limit Joint219

14.5.9 Ratchet Joint219

14.5.10 Gear Joint220

14.5.11 Simple Motor220

14.6 空间220

14.7 碰撞检测222

14.7.1 空间索引222

14.7.2 碰撞过滤224

14.7.3 碰撞回调225

14.7.4 碰撞对228

14.8 查询228

14.8.1 点查询228

14.8.2 线段查询229

14.8.3 区域查询229

14.9 实例——拖动刚体的实现230

14.10 小结235

14.11 参考资源235

第15章 网络编程236

15.1 网络编程相关概念236

15.2 TCP/IP参考模型240

15.2.1 服务端240

15.2.2 客户端240

15.2.3 通信协议241

15.2.4 端口241

15.2.5 URI241

15.3 基于HTTP协议的通信242

15.3.1 运作方式242

15.3.2 XMLHttpRequest对象242

15.4 基于WebSocket的通信246

15.4.1 Cocos2d-JS中的WebSocket246

15.4.2 WebSocket对象常用的属性和方法246

15.5 基于SocketIO的通信249

15.5.1 获取SocketIO对象249

15.5.2 SocketIO的常用方法250

15.6 实例——使用Node.js+Socket.IO实现游戏聊天系统250

15.6.1 Node.js、Express框架和Socket.IO库的安装251

15.6.2 服务端开发253

15.6.3 客户端开发255

15.7 小结258

15.8 参考资源258

第16章 JavaScript Binding259

16.1 Cocos引擎中的脚本绑定框架260

16.2 自动绑定261

16.2.1 自动绑定简介及其限制262

16.2.2 配置绑定环境262

16.3 深入探究绑定技术264

16.3.1 函数注册264

16.3.2 分析C++头文件267

16.3.3 绑定规则268

16.3.4 绑定模板268

16.3.5 转换函数269

16.4 绑定自己的C++类270

16.4.1 编写要绑定的C++类270

16.4.2 生成C++类的自动绑定代码271

16.5 实例——绑定SQLite3278

16.5.1 下载SQLite3源代码278

16.5.2 创建HelloSqlite工程278

16.5.3 生成绑定代码278

16.5.4 注册绑定279

16.5.5 集成到平台中279

16.5.6 测试结果280

16.6 小结281

16.7 参考资源282

第四部分 实战篇

第17章 《保卫萝卜2》实战284

17.1 关卡选择场景开发284

17.1.1 使用瓦片地图编辑器标记关卡按钮坐标285

17.1.2 关卡之间的连线开发288

17.1.3 关卡按钮特效节点开发290

17.2 游戏管理对象GameManager的开发290

17.2.1 关卡数值配置291

17.2.2 GameManager编写292

17.2.3 弹出下一组怪物数据298

17.3 游戏玩法场景开发299

17.3.1 GamePlayScene开发300

17.3.2 背景层GPBackground-Layer开发301

17.3.3 UI层GPUILayer开发302

17.3.4 菜单层GPMenuLayer开发303

17.3.5 游戏玩法层（GPMain-Layer）304

17.4 小结331