标签：

核心Js代码： var canvas,     stage,     w = window.innerWidth,     h = window.innerHeight; function init() {     //设置canvas属性     canvas = document.getElementById(‘game‘);     canvas.width = w;     canvas.height = h;     //创建舞台     stage = new createjs.Stage(canvas);     //绘制居中文字     var text1 = new createjs.Text("Hello World", "20px Arial", "#ff4400"),         bounds = text1.getBounds();     text1.x = stage.canvas.width - bounds.width >> 1;     text1.y = stage.canvas.height - bounds.height >> 1;     //绘制左边文字     var text2 = new createjs.Text("Hello World", "20px Arial", "#ff4400");     //绘制右边文字     var text3 = new createjs.Text("Hello World", "40px Arial", "#ff4400"),         bounds = text3.getBounds();     text3.x = w - bounds.width;     //下居中文字     var text4 = new createjs.Text("Hello World", "20px Arial", "#ff7700"),         bounds = text4.getBounds();     text4.x = stage.canvas.width - bounds.width >> 1;     text4.y = stage.canvas.height - bounds.height;     stage.addChild(text1);     stage.addChild(text2);     stage.addChild(text3);     stage.addChild(text4);     stage.update(); }

说明讲解：

1：绘制舞台类

createjs.Stage(canvas HTML)

2：绘制文字类

createjs.Text(‘text‘, ‘font-size font-family‘, ‘#color‘)

3：获得文字边界属性

Text.getBounds();

其中包含的属性有： width，height等；

4：添加到舞台

stage.addChild(displayObject);

5：更新画板显示出来

 stage.update(); 效果展示：

CreateJs系列教程之 EaselJs_1_绘制文字（Text）

标签：