CreateJs教程3章:easeljs中的Stage

CreateJs教程:easeljs中的Stage

上面一课提到了舞台,舞台stage是createjs中非常重要的一个类,只要想显示在浏览器中的元素,都需要add到舞台中, 舞台相当于所有其他需要显示的对象的根对象。舞台必须依赖与canvas,所以创建舞台的时候,需要使用canvas作为参数。


createjs.Stage的构造函数

构造函数的参数是一个canvas画布,返回一个舞台对象stage。

Stage ( canvas )

createjs.Stage舞台的坐标系

在浏览器中,舞台就是一个矩形,舞台的坐标系是:

easeljs舞台的原点

  • 左上角是原点(0,0)
  • 向右是x正方向
  • 向下是y正方向

createjs.Stage的addChild函数

有了舞台,需要把要显示的内容加入舞台,这时候,使用addChild函数。

addChild ( child ) DisplayObject

参数child是要加入的显示对象,如果需要同时加入多个对象,可以加入多个元素:

container.addChild(bitmapInstance, shapeInstance, textInstance);

createjs.Stage舞台的update函数

update函数是触发显示对象在canvas上重绘的函数。这个方法将把舞台的中的所有对象绘制一遍。当您向舞台添加一个对象时,你需要调用update函数绘制这个对象。

update ( [props] )

总而言之:update是重绘canvas画布的意思,需要绘制的内容在stage舞台对象中。


更多函数参考文档

ok,我们学会stage的这几个函数就差不多了,更多函数大家可以阅读其官方文档。

createjs.Stage的API文档