Question

我是一个HTML5新手，我想知道是否有人可以告诉我这里我做错了什么。我希望能够使用GSAP为我添加到舞台的矢量文件设置动画，并且当我调用一个函数时需要能够使它成为动画，但是当我尝试这样做时，我会继续不能补间空对象，但如果它没有包含在函数中，动画就可以正常播放。

我创建了一个新的HTML5画布，以查看问题是否仍然存在并且确实存在，所以这就是我所做的：

在空白HTML5画布上添加了一个符号，使其成为一个Movie Clip并画了一个圆圈。我调用了实例 mcThing
在时间轴中，我选择了第一帧并进入了行动

我写道：

function playAnimation() {
    TweenMax.to(this.mcThing, 3, {y:500});
}
playAnimation();

在Chrome中测试时，我得到无法补间空对象。如果我将其引用为mcThing（省略this.我而不是 mcThing未定义。
如果我然后删除该功能，只需要：
```
TweenMax.to(this.mcThing, 3, {y:500});
```
它播放得很好，但现在我不能在需要时调用它。

某些背景信息：

基本上我现在拥有的是一个侦听消息的WebSocket。收到消息后，它会被添加到队列中。我试图让它播放动画并插入该消息中的文本。文本本身应该没问题：我使用CreateJS来实例化代码中的文本，TweenMax在那里工作，问题是动画形状/绘图。我想我可以实例化代码本身的所有形状，然后TweenMax可以正常工作，但我不认为这是现实的，因为动画/形状相当复杂，所以我试图瞄准舞台。动画将播放，停止，然后消息将从队列中删除，下一个将播放（相同的动画，不同的文本）。

我认为这是一个范围问题，但我不确定我需要改变什么。任何帮助将不胜感激！

Answer 1

这个问题是因为范围。您的playAnimation的范围不限于this，因此在全局范围内调用它。

试试这个：

this.playAnimation = function() {
    TweenMax.to(this.mcThing, 3, {y:500});
}
this.playAnimation();

将mcThing放入功能范围也可以：

var thing = this.mcThing;
function playAnimation() {
    TweenMax.to(thing, 3, {y:500});
}
playAnimation();

或者你可以调用函数调用本身！

function playAnimation() {
    TweenMax.to(this.mcThing, 3, {y:500});
}
playAnimation.call(this);

一旦了解了范围界定的工作方式，有很多方法可以解决这个问题。我推荐第一种方法。

希望有所帮助！

无法使用GSAP内部功能来在舞台上定位MovieClip（Animate CC）

1 个答案: