Createjs 给图片添加文字

Question

我正在尝试创建一个对话框，里面有一些对齐的文本。为此，我发现了这个优秀的 github:

现在的问题是我似乎无法将我的文本放入其中。我想知道你们中是否有人尝试过。

这是我为此目的编写的一些代码：

   var image = new Image();
image.onload = function() { stage.update(); }
image.src = "assets/ScaleBitmapImage.png";

var text = new createjs.Text("Hello World", "20px Arial", "#ff7700");
var sb = new createjs.ScaleBitmap(image, new createjs.Rectangle(12, 12, 5, 50));

sb.setDrawSize(200, 300);

stage.addChild(sb);

createjs.Tween.get(sb).to({alpha: 0},5000).call(doneAnimating);

function doneAnimating() {
    createjs.Ticker.removeEventListener("tick", stage);
}

现在我想对齐图像内部的 Hello world 但我对 createjs 很陌生，不知道如何:)

Answer 1

您需要创建一个 Container 来保存位图和文本实例。

var container = new createjs.Container();
var sb = new createjs.ScaleBitmap();
var text = new createjs.Text();

container.addChild(sb, text);
stage.addChild(container);

您已经知道 ScaleBitmap 的矩形，因此您应该能够使用它来定位文本。

Createjs 给图片添加文字

Createjs add text to image

javascript

createjs