如何检测 Tween.js 动画是否完成？答案

【问题标题】：How to detect Tween.js animation finished?如何检测 Tween.js 动画是否完成？
【发布时间】：2015-04-05 06:53:49
【问题描述】：

我正在使用此代码使用 tween.js 为场景中的相机设置动画是否存在任何已完成或已完成的事件？

            tween : function (target){
                var position = camera.position;
                var tween = new TWEEN.Tween(position).to(target, 1800);

                tween.onUpdate(function(){
                    camera.position.x = position.x;
                    camera.position.y = position.y;
                    camera.position.z = position.z;
                    if (android){
                        camera.lookAt(android.position)
                    }
                });
                tween.easing(TWEEN.Easing.Bounce.Out);
                tween.start(); 
            },

【问题讨论】：

仅供其他人参考，同时我在 tween.js 帖子中潜伏 - 这个 sn-p 不需要在 onUpdate 中再次设置位置，此时 Tween 已经设置了它。它只是将自己的值重新分配给自己。

标签： javascript animation three.js tween.js

【解决方案1】：

提供一个onComplete函数：

tween.onComplete(function() {
  console.log('done!')
});

Docs

【讨论】：

【解决方案2】：

截至 2018 年 4 月，文档中不存在 .onComplete。相反，您可以使用 .call 函数，然后传递自定义函数。

   createjs.Tween.get(target).to({alpha:1}, 1000).call(handleComplete);
    function handleComplete() {
        //Tween complete
    }

参见文档：https://www.createjs.com/docs/tweenjs/modules/TweenJS.html

【讨论】：

这是一个不同的库，一个是tween.js，另一个是tweenjs。