微信小游戏开发教程 2018-07-09

微信小游戏创建

正常到mp.weixin.qq.com新建小程序，在新建完后选择类目选上小游戏即可。
之后到微信开发者工具创建新的小程序，填入appid，就可以新建demo。

微信小程序实例

在demo里面，已经有打飞机的一个游戏，里面readme已经给了整体架构：

./js
├── base                                   // 定义游戏开发基础类
│   ├── animatoin.js                       // 帧动画的简易实现
│   ├── pool.js                            // 对象池的简易实现
│   └── sprite.js                          // 游戏基本元素精灵类
├── libs
│   ├── symbol.js                          // ES6 Symbol简易兼容
│   └── weapp-adapter.js                   // 小游戏适配器
├── npc
│   └── enemy.js                           // 敌机类
├── player
│   ├── bullet.js                          // 子弹类
│   └── index.js                           // 玩家类
├── runtime
│   ├── background.js                      // 背景类
│   ├── gameinfo.js                        // 用于展示分数和结算界面
│   └── music.js                           // 全局音效管理器
├── databus.js                             // 管控游戏状态
└── main.js                                // 游戏入口主函数

main.js

在game.js里面主要调用了小游戏适配器和Symbol，并且创建了游戏控制主程序。所以现在看一看main.js的内容。

引入玩家和npc，引入背景、游戏信息、音乐和游戏状态管理器。新建canvas。

主函数中，每次游戏开始都调用restart（包括刚开始启动游戏），刚启动的时候还要重置动画帧ID的信息。restart里面重置数据，重置触摸事件，重置背景、玩家、游戏信息、音乐，绑定事件循环并且清除动画，之后请求动画帧以在canvas上面绑定循环。

还有npc产生，碰撞检测，触摸事件（在游戏结束后，这也是为什么开始游戏需要重置触摸事件），每一帧都需要重新画，并且有状态更新和循环。

sprite.js

一个精灵类（一个精灵是一个物体的抽象，具有画在图像上的能力与碰撞检测的能力）