Question

这里创建新的新手：

创造了这个小提琴：example。我希望矩形从中心生长而不是从左上角生长。我找不到任何帮助，我不知道该搜索什么。

代码：

const   PAGE_WIDTH  = 150,
        PAGE_HEIGHT = 75;

var stage = new createjs.Stage("canvas");
createjs.Ticker.setFPS(60);
createjs.Ticker.on("tick", tick);

var page = new createjs.Shape();
page.regX = PAGE_WIDTH/2;
page.regY = PAGE_HEIGHT/2;
page.x = 50;
page.y = 50;
stage.addChild(page);

var pageCommand = page.graphics
   .beginFill('red')
   .drawRect(0, 0, 1, 1).command;

createjs.Tween.get(pageCommand)
   .to({w:PAGE_WIDTH, h: PAGE_HEIGHT}, 700, createjs.Ease.elasticOut)

function tick() {
  stage.update();
}

感谢。

Answer 1

最好的方法是更改图形的注册点，使其从中心开始增长。

您的代码：

.drawRect(0, 0, 1, 1).command;
.to({w:PAGE_WIDTH, h: PAGE_HEIGHT})

相反：

.drawRect(-1.-1, 2, 2);
.to({x:-PAGE_WIDTH/2, y:-PAGE_WIDTH/2, w:PAGE_WIDTH, h: PAGE_HEIGHT})

小提琴：http://jsfiddle.net/1kjkqo2v/

[编辑：我最初说了两个选项，但第二个（使用regX和regY）不能正常工作，因为你必须补间该值以及你的尺寸变化。] < / p>

TweenJS rect命令“从中心增长”

1 个答案: