unity3d学习笔记-动画（2.控制动画与Animator Controller）

Posted 2023-03-29 Amateur_master

一、探索Animator Controller动画控制器

每当为选定的游戏对象创建第一个动画剪辑时，就会自动创建动画器组件。Animator负责分配动画；但是，它不控制实际的动画剪辑。这个任务落到了动画控制器身上，它也是用第一个动画剪辑自动创建的。 

1.State Machine状态机

动画控制器运行在一种称为状态机的特殊系统上。状态机跟踪对象可以执行的所有可能操作，并根据当前情况（或状态）要求选择适当的操作。传达当前状态的逻辑由外部控制，通常通过脚本进行，但从一个动作移动到另一个动作的过程由状态机直接处理，称为转换。

2.设置默认图层

1. 在网格化的 Animator 工作区中，右键单击并选择Create State > Empty。

2.选择新状态节点，在 Inspector 中，将名称从 New State 0 更改为 Closed。

3. 右键单击​​ Closed 状态并选择 Set as Layer Default State。

Closed 状态将变为橙色，并通过橙色线连接到 Entry 节点，表示转换。入口节点代表状态机开始时应该发生的事情。它会在场景播放后自动运行，以及在使用Exit 节点时自动运行

3.Make Transition创建过渡

右键单击​​ Closed 节点，然后选择 Make Transition；选择 Door_Open 节点。过渡箭头将附加到节点。动画控制器将通过 Closed 节点运行一次。完成后，它将立即过渡到 Door_Open 动画，然后在动画结束时处于空闲状态。为了防止一个节点立即转换到另一个节点，必须在转换上放置某种逻辑门。这是您将使用的脚本将在最终版本中检查的内容。这将通过使用参数来完成。

4.设置Parameters参数

1.选择参数选项卡以访问当前为空的参数列表。

2.在参数列表的顶部，单击+并选择触发器。

一旦通过脚本调用触发器参数，它就会立即转换。

3. 将触发器命名为 PlayerProximity，注意拼写和大小写与此处所写的完全相同。后面会在脚本中引用。

4.单击白色箭头，选择 Closed 和 Door_Open 之间的转换。在检查器中，找到条件部分。

5. 选择条件列表底部的+ 。由于它是唯一的参数，因此 PlayerProximity 将自动填充到列表中。

5.Any State节点

Any State 节点可以中断状态机中的任何转换，并调用与之关联的任何动画。

二、共享控制器

它们都共享同一个 Animator Controller，您可能会注意到它们的动画效果不同。这是因为 Animator Controller 有三个空闲动画，它会随机选择。每个角色都有自己的动画控制器实例（换句话说，各个角色都有自己的控制器副本，而不是所有角色都使用完全相同的控制器），这意味着为空闲选择的随机动画可能会有所不同！

 override public void OnStateEnter(Animator animator, AnimatorStateInfo stateInfo, int layerIndex)
    
        animator.SetInteger("IdleSelect", Random.Range(1, 4));
    

Control animation with an Animator - Unity Learn

Import animation - Unity Learn

待续。。。

layaAir引擎制作游戏的图集动画时间轴动画和骨骼动画总结二

一、角色序列帧.ani动画的制作

1、在项目管理器中创建动画文件

2.创建动画模板，编辑动效名称

3.编辑序列帧动画

.ani格式动画的代码控制

1.动画加载loadAnmition()

2.播放与停止、动效模板切换

3.动画帧位置控制

4.动画播放完成事件

uui截图：

 

Laya.init(1334, 750);

Laya.loader.load(["res/comp.atlas","res/role.atlas"],Laya.Handler.create(this,onload));
function onload(){
    this.tweenui = new ui.tweenuiUI();
    Laya.stage.addChild(this.tweenui);
    this.tweenui.ani.play(0,false);
    //播放完成后事件
    // this.tweenui.ani.on(Laya.Event.COMPLETE,this,oncompelete);
    //对动效模板进行监听
    this.tweenui.ani.on(Laya.Event.LABEL,this,onLabel);

    // loadAnimation三个参数
    this.roleAni = new Laya.Animation();
    // 第一个路径 后面两个可以默认不填
    this.roleAni.loadAnimation("res/roleAni.ani");
}
function oncompelete(){
        console.log("我完成播放了！！")
}

function onLabel(label){
    this.tweenui.leftPage.addChild(this.roleAni);
    this.roleAni.pos(this.tweenui.leftPage.width/2,this.tweenui.leftPage.height/2);
    this.roleAni.play(0,true,"die");
    
    console.log(this.tweenui.ani.index)
}

 

　　

二、动效动画的制作

主要用于UI中一些相同的，需要批量制作的动画，比如按钮动画

动效动画不能像Animation动画一样去代码控制，但可以在IDE中加入事件触发

在IDE中新建

0不变 第5帧设置缩放0.5 10帧还原  。在之前需要设置中心点

制作按钮回弹效果，制作后直接拖拽到ui中的节点上。

 

 

 

 三、Animation动画组件

动画组件可以直接放入UI或者视图中，可视化的设置位置大小，播放与否等

四、骨骼动画的转换和使用

LayaAir引擎支持第三方骨骼动画资源的转换

需要使用IDE骨骼动画转换工具后转换使用

从spine和DrgonBone中导出资源注意事项

图集、旋转、版本

LayaAir引擎播放Spine骨骼动画

https://ldc.layabox.com/doc/?nav=zh-js-1-5-5

骨骼动画转化

生成png和sk的文件

骨骼动画的代码加载与使用 

API链接：https://layaair.ldc.layabox.com/api/?category=Bone&class=laya.ani.bone.Skeleton#Skeleton()

1.动画模板Templet方式创建骨骼动画Skeleton

代码量比较大

2.直接加载资源创建骨骼动画Skeleton

代码小

从模板获取动画  buildArmature()

动画切换皮肤 showSkinByIndex()

Laya.init(1334,750,Laya.WebGL);
//直接创建骨骼动画
// this.skeleton = new Laya.Skeleton();
// Laya.stage.addChild(this.skeleton);
// //1是支持换装的值
// this.skeleton.load("res/goblins-mesh.sk",Laya.Handler.create(this,oncompelete),1)

// function oncompelete(){
//     this.skeleton.pos(300,300);
//     this.skeleton.showSkinByIndex(1);
// }

// 板创建骨骼动画
this.templet = new Laya.Templet();
this.templet.loadAni("res/goblins-mesh.sk");
this.templet.on(Laya.Event.COMPLETE,this,onLoaded);
function onLoaded(){
    // this.skeleton = this.templet.buildArmature(1);
    //或者
    this.skeleton = new Laya.Skeleton(this.templet,1);
    Laya.stage.addChild(this.skeleton);
    this.skeleton.pos(200,300);
    this.skeleton.showSkinByIndex(1);
    this.skeleton.play(0,true);    

    this.skeleton1 = new Laya.Skeleton(this.templet,1);
    Laya.stage.addChild(this.skeleton1);
    this.skeleton1.pos(400,300);
    this.skeleton1.showSkinByIndex(2);
    this.skeleton1.play(0,true);    
}



// 封装好的方法
/**
 * @public
 * 创建骨骼动画
 * @param {String} path 骨骼动画路径
 * @param {Number} rate 骨骼动画帧率，引擎默认为30，一般传24
 * @param {Number} type 动画类型 0,使用模板缓冲的数据，模板缓冲的数据，不允许修改	（内存开销小，计算开销小，不支持换装） 1,使用动画自己的缓冲区，每个动画都会有自己的缓冲区，相当耗费内存 （内存开销大，计算开销小，支持换装） 2,使用动态方式，去实时去画	（内存开销小，计算开销大，支持换装,不建议使用）
 * 
 * @return 骨骼动画
 */
// var createSkeleton = function (path, rate, type) {
//     rate = rate || 30;
//     type = type || 0;
//     var png = Laya.loader.getRes(path + ".png");
//     var sk  = Laya.loader.getRes(path + ".sk");
//     if(!png || !sk){return null;}

//     var templet = new Laya.Templet();
//         templet.parseData(png, sk, rate);

//     return templet.buildArmature(type);
// }
// // 一般使用只需要传路径
// var skeleton = new createSkeleton("path");