let camera=lightAndCamera()
let ground=BABYLON.MeshBuilder.CreateGround('ground',
{width:100,height:100},scene)
let box=BABYLON.MeshBuilder.CreateBox('box',{width:5,height:3,depth:2},scene)
const framerate=10
const up=new BABYLON.Animation('animation','position',framerate,
BABYLON.Animation.ANIMATIONTYPE_VECTOR3,
BABYLON.Animation.ANIMATIONLOOPMODE_CYCLE)
const keysFrames=[]
keysFrames.push({
frame:framerate,
value:new BABYLON.Vector3(0,0,0)
})
keysFrames.push({
frame:2*framerate,
value:new BABYLON.Vector3(10,5,0)
})
keysFrames.push({
frame:4*framerate,
value:new BABYLON.Vector3(6,10,10)
})
up.setKeys(keysFrames)
let rotation=new BABYLON.Animation('animation','rotation.x',framerate,
BABYLON.Animation.ANIMATIONTYPE_FLOAT,
BABYLON.Animation.ANIMATIONLOOPMODE_CYCLE)
const framArr=[]
framArr.push({
frame:framerate,
value:0
})
framArr.push({
frame:2*framerate,
value:Math.PI
})
framArr.push({
frame:4*framerate,
value:Math.PI*2
})
rotation.setKeys(framArr)
//scene.beginDirectAnimation(box,[rotation,up],0,4*framerate,true)
const rote=new BABYLON.Animation('animation','alpha',framerate,
BABYLON.Animation.ANIMATIONTYPE_FLOAT,
BABYLON.Animation.ANIMATIONLOOPMODE_CYCLE)
const Frames=[]
Frames.push({
frame:framerate,
value:0
})
Frames.push({
frame:5*framerate,
value:Math.PI/2
})
Frames.push({
frame:10*framerate,
value:Math.PI
})
rote.setKeys(Frames)
//scene.beginDirectAnimation(camera,[rote],0,10*framerate,true)
var animationGrounp=new BABYLON.AnimationGroup('group')
animationGrounp.addTargetedAnimation(up,box)
animationGrounp.addTargetedAnimation(rotation,box)
animationGrounp.addTargetedAnimation(rote,camera)
animationGrounp.normalize(0,40)
animationGrounp.play(true)
创建分组使用:
var animationGroup1 = new BABYLON.AnimationGroup("Group1");
然后使用addTargetedAnimation方法将动画与网格链接起来,并将它们添加到组中:
animationGroup1.addTargetedAnimation(animation1, mesh1);
animationGroup1.addTargetedAnimation(animation3, mesh1);
animationGroup1.addTargetedAnimation(animation2, mesh2);
normalize方法:
使用normalize方法使所有动画的帧数相同:
animationGroup2.normalize(0, 40);
speedRatio方法:
speedRatio方法可以设置动画组与原动画组的速度比:
animationGrounp.speedRatio=0.5
从现有动画创建组
可以通过枚举动画表中包含的动画来从动画表中创建新的 AnimationGroup:
var animationGroup = new BABYLON.AnimationGroup("my-animation-group");
for (anim of idleAnim.getAnimations()) {
animationGroup.addTargetedAnimation(anim.animation, anim.target);
}
onAnimationEndObservable方法:
动画组结束时触发的函数:
animationGroup1.onAnimationEndObservable.add(function() {
mesh1.material = newMaterial;
});
onAnimationLoopObservable方法:
动画组在循环时触发的函数:
animationGroup1.onAnimationLoopObservable.add(function(targetAnimation) {
console.log(targetAnimation.animation.name);
});
onAnimationGroupLoop方法:
所有动画组循环播放时触发的函数:
animationGroup1.onAnimationGroupLoopObservable.add(function(group) {
console.log("Group looped!");
});