[1.项目背景】createjs是一个基于canvas的库，用于制作H5游戏、动画、交互。包括EaselJs、TweenJs、SoundJs、PreloadJs四个部分。它是基于容器显示的，其中根容器是舞台（stage）对象。今天教大家用EaselJs和TweenJs做一个配色游戏。【2.项目准备】1、进入如下网址：http://www.createjs.cc/，下载EaselJs和TweenJs两个模块。2.软件：Dreamweaver[3.项目目标】随机生成4种颜色，让下方的色块随鼠标移动与上方的色块相匹配。如果上面的色块和下面的色块颜色相同。如果所有的色块都匹配，则认为是成功的。[4.项目实现】1.导入EaselJs和TweenJs模块。2、bodycreatecanvas画布设置画布的大小，给画布添加描边，id属性。3.创建shapes.js文件。定义一个初始化init()方法来创建一个舞台对象。functioninit(){stage=newcreatejs.Stage("canvas");}4.定义图形绘制方法buildShapes()，调用createjs.Shape()方法绘制一个带图形的描边正方形。填色。functionbuildShapes(){varcolors=['blue','red','green','yellow'];变量i，形状，槽；for(i=0;i<4;i++){//slotsdescriptionsidesquareslot=newcreatejs.Shape();插槽.推送（插槽）；//shapessquareshape=newcreatejs.Shape();shape.graphics.beginFill(颜色[i]);shape.graphics.drawRect(0,0,100,100);shape.regX=shape.regY=50;形状.key=i;shapes.push(形状);}}5。设置方块x,y的位置，用for循环随机填充颜色，添加到舞台上。slot.graphics.beginStroke(colors[i]);slot.graphics.beginFill(createjs.Graphics.getRGB(255,255,255,1));slot.graphics.drawRect(0,0,100,100);槽.regX=插槽.regY=50;插槽.key=i;插槽.y=80;插槽.x=(i*130)+100;stage.addChild（插槽）；6.定义setShapes方法，for循环会随机生成一个r值添加到shapes中。生成移动方块。添加到舞台（stages）。函数setShapes(){vari,r,shape;varl=形状。长度;对于(i=0;i
