Blend animation between to animations using code

Basically I wanted to ask if it was possible to blend between two animation poses.

Let’s say I want my character to look up at something and have the head look towards that thing but the body remain in idle or run or whatever pose is appropriate to the player input.

Examples of this is twin shooter genre. Moving and shooting are independent.

My strategy at the moment was to make one model separate than the main model and child it to the main model. Then with code find a way to have it always looking at the cursor or something of that nature.

Sorry holding a baby so hard to type lol

There is a full example of blend 2 diferent animation in a single model. In your case with two separate parts of a model you can try having idle + idle moving head animation separated

https://developer.playcanvas.com/en/tutorials/animation-blending/

hope it helps

Yea this is great! But I saw it already.

It’s clear to me that I’ll have to separate the model (which is not a problem!) and have like the legs on their own model/animation set and the arms and the head etc.
That way I can do crazy dynamic stuff, but for the time being, I’ll probably just keep it basic as I code out the gameplay.

Thanks for the help none the less :slight_smile: I’ll do some testing of this animation on a later date and share the results as they come.

You guys can just jock this as solved since I think I have a makeshift solution.

Check this, a member of the forum did a great job writing this:

https://playcanvas.com/project/348842/overview/root-motion

1 Like

WHOA! I’ll check this out.

Same problem here

var AnimationBlending = pc.createScript(‘animationBlending’);

AnimationBlending.states = {
idle: {

},
punch: {
animation: ‘Great_Sword_Slash.json’
}
};
// initialize code called once per entity
AnimationBlending.prototype.initialize = function() {
this.blendTime = 0.2;

this.setState('idle');

this.app.keyboard.on(pc.EVENT_KEYDOWN, this.keyDown, this);
this.app.keyboard.on(pc.EVENT_KEYUP, this.keyUp, this);

};

AnimationBlending.prototype.setState = function (state) {
var states = AnimationBlending.states;

this.state = state;
// Set the current animation, taking 0.2 seconds to blend from
// the current animation state to the start of the target animation.
this.entity.animation.play(states[state].animation, this.blendTime);

};

AnimationBlending.prototype.keyDown = function (e) {
if ((e.key === pc.KEY_P) && (this.state !== ‘Great_Sword_Slash.json’)) {
this.setState(‘Great_Sword_Slash.json’);
}
};

AnimationBlending.prototype.keyUp = function (e) {
if ((e.key === pc.KEY_P) && (this.state === ‘Great_Sword_Slash.json’)) {
this.setState(‘idle’);
}
};