无法使用 GSAP 内部函数来定位舞台上的 MovieClip (Animate CC)

火线

我是 HTML5 新手,我想知道是否有人可以告诉我我在这里做错了什么。我希望能够使用 GSAP 来为我添加到舞台的矢量文件设置动画,并且在我调用函数时需要能够使其具有动画效果,但是当我尝试这样做时,我不断得到无法补间null object,但如果它没有包含在函数中,动画就可以正常播放。

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

  1. 向空白的 HTML5 画布添加一个符号,使其成为影片剪辑并绘制一个圆圈。我调用了实例mcThing
  2. 在时间轴中,我选择了第一帧并进入了操作
  3. 我写:

    function playAnimation() {
        TweenMax.to(this.mcThing, 3, {y:500});
    }
    playAnimation();
    
  4. 在 Chrome 中测试时,我得到cannot tween a null object如果我将其引用为mcThing(省略this.I 而不是 get mcThing is not defined
  5. 如果我然后删除该功能并只有这个:

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

    它播放得很好,但现在我无法在需要时调用它。

一些背景:

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

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

兰尼

这个问题是因为范围。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);

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

希望有帮助!

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章