Flash CC Canvas 和 GSAP：如何在舞台上设置动画片段的注册点

Question

我将如何动态更改舞台（根）上标记为 "tablet" 的动画片段的注册点？

例如：我有以下内容：

var tablet = this.tablet;    //movieclip labeled "tablet" on stage
function resetTablet(){
tablet.regX = tablet.width/2; //move registration point to center
tablet.regY = tablet.height/2;

}

然而，当我使用 GSAP 调用它时：

var tl = new TimelineLite();
tl.to(tablet, 1, {alpha:1, onComplete:resetTablet})
  .to(tablet, 3, {alpha:0, scaleX:1.5, scaleY:1.5})

注册点仍然设置在左上角而不是中心。

我在这里做错了什么？谢谢！

Answer 1

注册点影响变形点和位置的变化。如果将 100x100 像素的显示对象设置为 regX=50;regY=50，那么它将从该点开始绘制，将内容向左上方移动 50 像素。如果您进行了更改，您还应该将剪辑转换为 x=50;y=50。

您的示例存在一个问题，即 EaselJS 内容 (explained here) 中没有 width 或 height。您可以使用 nominalBounds 属性获取 Flash CC 生成的任何内容的边界，Flash 在每个对象上导出为属性。如果您有多个框架，您可以在发布设置中打开 "multi-frame bounds"，并且 frameBounds 属性也会添加到对象中。

请注意 nominalBounds 和 frameBounds 未被 getBounds 方法使用。

您可以通过以下方式处理它。

var bounds = tablet.nominalBounds;
tablet.regX = bounds.width/2;
tablet.regY = bounds.height/2;

// Optional if your actual registration point was [0,0] before:
tablet.x += tablet.regX;
tablet.y += tablet.regX;

希望对您有所帮助。

Flash CC Canvas 和 GSAP：如何在舞台上设置动画片段的注册点

Flash CC Canvas and GSAP: How to set registration point of movieclip on stage

transform

easeljs

flash-cc

gsap