Question

我在Blender中制作了一个动画网格，其中包含两个动画片段，我将其命名为 intro 和 idle 。我用JSON中的Blender导出器导出它。一切都很好。我可以切换我想要播放的动画。我的问题是我想播放第一个动画完全，然后切换到我将设置为循环的第二个动画。

以下是我用于JSON和动画部分的代码部分：

var jsonLoader = new THREE.JSONLoader();
    jsonLoader.load('models/feuille(19fevrier).json',
    function (geometry, materials) {

        mesh = new THREE.SkinnedMesh(geometry,
            new THREE.MeshLambertMaterial({
            skinning: true
        }));

        mixer = new THREE.AnimationMixer(mesh);

        action.intro = mixer.clipAction(geometry.animations[ 0 ]);
        action.idle = mixer.clipAction(geometry.animations[ 1 ]);

        action.intro.setEffectiveWeight(1);
        action.idle.setEffectiveWeight(1);
        action.intro.enabled = true;
        action.idle.enabled = true;

        action.intro.setLoop(THREE.LoopOnce, 0);


        scene.add(mesh);

        scene.traverse(function(children){
            objects.push(children);
        });

        action.intro.play();

    });

我正在寻找的是一个告诉我动作完成的功能，像clipAction完成播放时的某些事情，比如onComplete事件。我在three.js GitHub上找到了这个回复：

 mesh.mixer.addEventListener('finished',function(e){

   // some code

 });

它似乎有效，但我并不真正理解该上下文中的addEventListener，也不理解function(e)的含义。

有the code I found on GitHub

的链接

Answer 1

addEventListener是处理事件的标准JavaScript dispatchEvent/addEventListener concept的一部分。每当动画结束时，three.js动画子系统都会调度一个事件。来自AnimationAction.js：

this._mixer.dispatchEvent( {
    type: 'finished', action: this,
    direction: deltaTime < 0 ? -1 : 1
} );

如您所见，e事件参数为您提供了完整的AnimationAction对象（e.action），以及表示动画方向的整数（e.direction）。

不要因为这是无证件行为而感到气馁（three.js的增长速度远远超过Doob先生所能正确记录的速度）。利用可用的功能，但要留意功能发布中可能发生的变化。

验证clipAction动画何时在three.js中播放完毕

1 个答案: