Animation Splitting?

Help & Support
1

I have an animation file where all the animations are in one and what I would like to do is write a script to manually break them apart but entity.animation has no way for me to pause and play at a certain duration within my animation.

Example: Animation is 13 sec long
Play 2 sec of the animation ( pose cycle ) ,
then Play 8 sec of the animation ( run cycle ).

Is there a way in the docs to get this done or do I have to go back and make separate animations?

1 Like
2

The animation system was designed to play back separate animations, not single animations that contain multiple cycles. The recommended way is to import an animation per cycle.

That said, if you do want to solve the problem with script, one option could be to generate multiple pc.Animation objects from the master animation. Again, you might run into some unforeseen hurdles because I don’t think anybody has tried creating animations procedurally yet. However, this script on an entity with a model component set to type ‘Box’ will animate it:

pc.script.create('animate', function (app) {
    // Creates a new Animate instance
    var Animate = function (entity) {
        this.entity = entity;
    };

    Animate.prototype = {
        // Called once after all resources are loaded and before the first update
        initialize: function () {
            var key1 = new pc.Key(0, new pc.Vec3(0, 0, 0), new pc.Quat(0, 0, 0, 1), new pc.Vec3(1, 1, 1));
            var key2 = new pc.Key(1, new pc.Vec3(1, 0, 0), new pc.Quat(1, 0, 0, 0), new pc.Vec3(2, 2, 2));

            var node = new pc.Node();
            node._name = "Untitled";
            node._keys = [key1, key2];
            
            var anim = new pc.Animation();
            anim.setDuration(1);
            anim.addNode(node);

            this.entity.addComponent('animation');
            this.entity.animation.data.animations = {
                myanim: anim
            };
            
            this.entity.animation.setModel(this.entity.model.model);
            this.entity.animation.play("myanim");
        },

        // Called every frame, dt is time in seconds since last update
        update: function (dt) {
        }
    };

    return Animate;
});

There’s a few places in this code that is not considered API and is therefore subject to change. But, hey…it works. :smiley:

The animation system will be improved in the coming months.

3 Likes
3

In that script did you manually create the animation through using key 1 and key 2 ? If so suppose you have an animation file already how would you set the individual keys ?

Also thanks for your help

4

I was suggesting that you could have a script which parsed the single animation and split it into multiple pc.Animation objects based on start/end times. The code snippet I gave should be sufficient to demonstrate how to build a pc.Animation in code. It’s really just a matter of copying the data across from the source animation. The only bit to take care with is to create new keys at start/end times and for that, you’d have to linearly interpolate position and scale keys and slerp rotation keys.

1 Like