如何用Createjs写HTML5游戏EaselJS介绍
先从官网的createJs下载。createJs分为四个部分:easelJs(图形动画)、preloadJs(文件加载)、soundJs(音频控制)和tweenJs(补间动画)。下载时，建议下载两个文件，一个是压缩文件，供项目中参考，一个是源文件，用于查看用法、API、demo等。因为楼主目前只用easelJs和preloadJs，所以我暂时只说这两个。其实这两个就很够了。
接下来，开始分析代码:
首先，介绍js文件。
& ltscript src = " easeljs-0 . 7 . 1 . min . js " >& lt/script & gt；
& ltscript src = " preload js-0 . 4 . 1 . min . js " >& lt/script & gt；
然后执行阶段初始化操作:
函数init(){
stage = new createjs。阶段(“cas”)；
C_W = stage.canvas .宽度；
c _ H = stage . canvas . height；
var清单= [
{src:"image/man.png "，id:"man"}，
{src:"image/ground.png "，id:"ground"}，
{src:"image/bg.png "，id:"bg"}，
{src:"image/high.jpg "，id:"high"}，
{src:"image/coins.png "，id:"coin"}
]
loader = new createjs。load queue(false)；
loader . addevent listener(" complete "，handle complete)；
loader . load manifest(manifest)；
draw loading()；
}
上面使用preloadJs中的方法实例化一个加载器，把要加载的图像文件放到manifest中，加载，加载完成后调用回调handleCompelete函数:
函数handleComplete(){ //加载图片素材时，执行该方法。
var man image = loader . get result(" man ")，
low ground = loader . get result(" ground ")，
high ground = loader . get result(" high ")，
bgImage = loader.getResult("bg ")，
coins = loader . get result(" coin ")；
sky = new createjs。shape()；
sky.graphics.bf(bgImage)。drawRect(0，0，C_W，C _ H)；
sky.setTransform(0，0，1，C _ H/bgimage . height)；
stage.addChild(天空)；
man = createMan(200，326，man image)；
//这个框就是判断角色的判断区。
kuang = new createjs。shape()；
Kuang . graphics . begin stroke(" rgba(255，0，0，0.5)")。drawRect(0，0，man.size()。w，man.picsize()。h * 1.5)；
// stage.addChild(匡)；
mapHandle(低地、高地、硬币)；
createjs。Ticker.timingMode = createjs。Ticker . RAF//设置循环方法，可以是requestAnimationFrame或setTimeout。
createjs。ticker . setfps(30)；//阶段帧速率控制
createjs。Ticker.addEventListener("tick "，滴答)；//在舞台上绑定每一帧的逻辑生成函数。
window . addevent listener(" keydown "，function(event){
event = event | | window.event
if(event . key code = = = 32 & amp；& ampman.jumpNum & ltman.jumpMax){
man . jump()；
}
})
}
加载后获取后端的图像数据，直接用loader.getResult就可以得到，跑酷游戏需要背景，我们先实例化一个天空，画一个位图。bf方法是beginBitmapFill的缩写，就是开始绘制位图。后面的drawRect是位图的绘制区域，区域当然是整个画布，所以是drawRect(0，0，C_W，C_H)。实例化sky后，直接添加到舞台上即可。下一步是实例化一个角色，该角色被自己封装，稍后在createMan方法中会提到。
然后设定阶段循环，有评论就不说了。