unity2D动画-角色切片与2DAnimation插件做动画

unity2D动画-角色切片做动画

  • 写在前面的话
  • 开发环境与准备
    • 用角色切片做动画
      • 终于可以Key动画了
    • 2DAnimation插件做动画
    • 总结

写在前面的话

这个不算教程的教程主要是让组里的美术与策划们看的,会写的十分基础与详细,为节约看客的时间,大神请绕道!!!
本教程分两部:
1.用普通的角色切片,直接Key动画,适合用在机械性的人物与动作(如机器人,甲虫等)
2.基于2D Animation插件做骨骼动画(绑定骨骼,刷权重,调动画),这个插件貌似是unity2018的新功能,具体什么时候加进unity中的并没有深究,低版本的如果没有这个插件也可以商店下载Unity Anima2D这个插件也能完成功能.

开发环境与准备

开发环境:unity2018.2.5f1
准备图片:(图片都需要加水印请谅解,相信找个合适的图片难不倒大家的)

unity2D动画-角色切片与2DAnimation插件做动画_第1张图片
(图1)
unity2D动画-角色切片与2DAnimation插件做动画_第2张图片
(图2)

假如说美术给的图是这样的
unity2D动画-角色切片与2DAnimation插件做动画_第3张图片
那么需要把图处理成程序可用的,这样的图片(并不是说肢体都分成小图不能用,而是需要优化DrawCall)
unity2D动画-角色切片与2DAnimation插件做动画_第4张图片
上图中IronMan这张图在程序里是一种资源(texture),这里面真正要用到的是它下面的小图片,叫做精灵(sprite).
把小图拼成大图的方法有多种,因为我们程序里面用了TexturePacker这个插件,所以这里也用这个插件处理,
假设这里我们终于做完了准备工作!
新建一个IronMan文件夹,这个人物的所有资源就放在这个文件夹下面了,
因为需要两种实现动画的方式所以我的资源准备好以后就成了这样
unity2D动画-角色切片与2DAnimation插件做动画_第5张图片

用角色切片做动画

这里用的都是(图2)
unity2D动画-角色切片与2DAnimation插件做动画_第6张图片
点击SpriteEditor,进入精灵编辑面板
unity2D动画-角色切片与2DAnimation插件做动画_第7张图片

上图中的小蓝点,是精灵的中心点,每个精灵都要设置好,精灵的旋转就是以这个点为旋转点.不然调动作的时候会出问题!!!
下一步,在Hierarchy面板空白处右键-CreateEmpty(创建空物体,改好名字,这里是IronMan)
unity2D动画-角色切片与2DAnimation插件做动画_第8张图片

然后在IronMan物体下右键-2DObject-Sprite创建精灵物体,为精灵物体赋上需要的图片,正确命名各个部件的名称,最终拼成想要的人物,如下图
unity2D动画-角色切片与2DAnimation插件做动画_第9张图片
unity2D动画-角色切片与2DAnimation插件做动画_第10张图片
这里层级关系有两个要注意点(层级关系可以设置SpriteRender下面的OrderInLayer参数)
1.人物层级关系处理的时候,比如大臂带动小臂,小臂带动手,那么大臂是小臂的父物体,小臂是手的父物体.
2.上图中IronMan_Rig是整个角色,一般来说这个位置会在人物的中心(tips,这个物体的精灵我一般在编辑的时候会放一个角色的参考图,然后设置一下透明度,做肢体拼接的参考,使用完以后再把SpriteRenderer这个组件去掉)
但是我们多数时候的需求是人物的基准点是脚下而不是中心(这个基准点必须要确定好,不然游戏中人物的位置没办法摆放),这样就需要再加一个父物体IronMan如上图那样设置,把人物的基准位置移到脚下
这里完成之后不要忘了把你辛辛苦苦拼接起来的小人儿保存成个prefab,保存过后就算你在面板上删掉也能找回来了(创建prefab很简单,选中IronMan,拖到相应的资源文件夹下就好了,成功以后prefab看起来是个蓝色的正方体,面板上的物体变成蓝色)如下图
unity2D动画-角色切片与2DAnimation插件做动画_第11张图片

终于可以Key动画了

选中IronMan_Rig这个物体,直接按快捷键Ctrl+6,打开Animation编辑面板,点击Create会让你创建一个动画片段,这里我们就新建一个Idle动画,保存路径就和资源路径一样好了,完成后会看见这个界面

unity2D动画-角色切片与2DAnimation插件做动画_第12张图片
讲一下这个模块:
Preview – 预览,这个选项在你移动timeline的时候自动会勾选上,
红点 – 是否自动录制,选中以后timeline会变成红色,属性面板中会参与动画的属性也会变成红色,默认是藏蓝色
一堆箭头 – 不解释了,不懂的话随便点点就知道
动画片段 – 上图中的Idle按钮,这里点开以后可以切换动画片段和创建新的动画片段,这些片段都是针对这个物体的
samples – 每秒多少帧,默认60,这个一般不用变
AddProperty – 添加属性,就是把将要做动画的属性放进里面,属性有很多都能做动画,(这里建议开启自动录制,timeline选择非第一帧的地方直接操作hierarchy(层级)面板,摆pose,它会自动添加你更改的属性,并在第一帧补全当前的属性信息的关键帧)
Curves – 曲线面板,调动画节奏用的,里面的关键帧对应外面的关键帧,主要用作调中间帧的动画节奏
timeline – 上面的0:00 0:05 0:10 冒号前面是"秒",冒号后面是"帧",不要理解错了,冒号后面可不是毫秒
key帧之后,timeline每个关键帧都会有个小菱形表示,选中(支持多选)可以拖动,复制,粘贴等
具体操作
点击小红点,就开始自动录制了(timeline与属性面板中被改变的属性会有个暗红色的底),我们在30帧的位置开始创建关键帧,编辑器会在第一帧的位置自动创建一个当前动作信息的关键帧,我编辑出来的关键帧如下图:
第一个关键帧,自动生成的,startPose
unity2D动画-角色切片与2DAnimation插件做动画_第13张图片
第二个关键帧,人物稍微站起来了一点,胳膊稍微夹起来一点
unity2D动画-角色切片与2DAnimation插件做动画_第14张图片

unity2D动画-角色切片与2DAnimation插件做动画_第15张图片
动画面板,第60帧是复制第一帧得到的,这样就得到一个Idle动画了,
编辑的更生动一些,身体上升动画前移一些,让人物站起来时更有些力度,胳膊与手部动画相对于身体上升动画,稍作延迟,(动画运动原理,别问我怎么知道的,哈哈),
关键帧就变成下面这样了
unity2D动画-角色切片与2DAnimation插件做动画_第16张图片
动画效果如下

如果注意观察就会发现,脚是会踩进去的,像是站在棉花上面一样,这个BUG很难调好,需要用到IK动画才会变得简单,现在这种简陋的做法肯定是不支持的IK的,只能慢慢调了.这里就不做了.
到这里所有的整个动作都完成了,千万别忘了最后一步!!!
点击Apply保存下你做的东西,成功保存后,你所有的操作都会被保存进这个prefab中了,(不放心是否应用成功的话,把prefab拖过来看看你的最新改动在不在就好了)
unity2D动画-角色切片与2DAnimation插件做动画_第17张图片
这个角色切片做动画的到此结束.

2DAnimation插件做动画

先导入2DAnimation插件
window-PackageManager,调出下面面板.In Project是已经导入项目中的插件,All是所有的
unity2D动画-角色切片与2DAnimation插件做动画_第18张图片
导入2D Animation和 2DIK这两个插件(点击上图蓝色的View documentation 可进入官方档,里面也有工具使用方式
这里还有另外一份文档
https://forum.unity.com/threads/2d-animation-preview-packages.521778/
demo by GitHub:
https://github.com/Unity-Technologies/2d-animation-samples)

点击图1,同样点击SpriteEditor进入图片编辑模式

unity2D动画-角色切片与2DAnimation插件做动画_第19张图片
BoneEditor是绑骨骼,SkinWeightsAndGeometryEditor是蒙皮(就是改变骨骼控制的范围)
选择BoneEditor进行骨骼编辑
使用右下角的Tools进行编辑,基本上使用前两个工具就可以完成了,后面的四个工具有兴趣可以自己试一下,都很简单,(注意我专门在脚下多加了一小段骨骼,这个骨骼就顺着父骨骼的方向就可以,等下加IK控制器要用到它)
骨骼要正确命名
unity2D动画-角色切片与2DAnimation插件做动画_第20张图片
我们点击apply应用一下,再切换到SkinWeightsAndGeometryEditor,创建一下蒙皮
unity2D动画-角色切片与2DAnimation插件做动画_第21张图片
上面一排按钮,
Geometry模式下,是把图片切片,可以理解成3D建模中的建模吧,这里遵循够用就是最优的原则,不要创建过多的顶点和三角形,会对游戏性能有影响,一般是关节处生成较多的三角形,蒙皮过后会得到更平滑的形变效果,肢体部分基本不会发生形变的就要少点三角形,以免产生过多的形变.
Geomete是个下拉框这是我上图中用的参数信息,
outlineDetail就是边缘细节精细程度,数值越大越精细,
alphaTolerance是剔除透明区域的精确度
subdivide,细分程度,直接影响到三角形数量的多少
选好后再点击cenerate按钮就能看效果了,可以多调调数值试试
unity2D动画-角色切片与2DAnimation插件做动画_第22张图片
上图中我的人物左手由于与身体贴的很近所以没有很好地剔除透明区域
这时候我们就可以用这些功能修补一下在这里插入图片描述
Selection - 选择模式
CreateVertex - 增加顶点
CreateEdge - 增加线段(把顶点连起来)
splitEdge - 在线上加点
修补完成后的效果
unity2D动画-角色切片与2DAnimation插件做动画_第23张图片

点击Weights,菜单栏出现变化,
unity2D动画-角色切片与2DAnimation插件做动画_第24张图片
点击Auto就出现上面的效果,每个骨骼控制的区域都用相应的颜色标出来了,这时候你可以移动骨骼,看看骨骼的影响范围,
WeightEditor-Brush标签页中可以刷权重,比较麻烦,正常情况下如果你的网格与骨骼设置的合理,就不会出太大问题,毕竟2D的权重影响范围还是很直观的.如果出现不如意的情况,建议先优化骨骼与网格,最后还不行的话再来刷权重.如上图中,设置好了骨骼与网格,两只小臂的权重已经完全受小臂骨骼的影响,
Apply保存,出来准备做动画啦!!!

如图创建物体,有个父物体IronMan1,仍然为了把角色中心定位在脚底下,
unity2D动画-角色切片与2DAnimation插件做动画_第25张图片

在属性面板上添加SpriteSkin脚本,点击CreateBones按钮,会直接生成一套刚才编辑好的骨骼,
这时候打开动画面板,就可以编辑动画了,不过这里面还有个好用的IK动画没说呢,
在属性面板中再添加一个脚本IKManager2D
unity2D动画-角色切片与2DAnimation插件做动画_第26张图片

Weight - 指的是骨骼受IK影响的程度.0是不影响
Restore Default Pose - 恢复默认动作
IKSolvers点加号出现上面的弹窗,三种IK模式
Chain(CCD)Chain(FABRIK)这两个放在一起说,两个比较像,区别是会FABRIK把关节角度变成反方向,而CCD不会,
Limb默认只能选前两个关节,跟CCD差不多,
unity2D动画-角色切片与2DAnimation插件做动画_第27张图片
上面的选项点了之后都会自动创建一个对应的管理器,
我们用CCD,就拿CCD来说创建出来的东西如下图
unity2D动画-角色切片与2DAnimation插件做动画_第28张图片
这里面 Target就是末端骨骼了,Effector这是个控制器,点击下面CreateEffector创建(位置就是Target骨骼的位置,记得之前说脚部多创建出来一小段骨骼吗,作用就在这里,不然控制器的位置在Target骨骼的根部,并不是尾部,不方便做动画)
ChainLength就是影响的范围.会依次寻找骨骼的父骨骼
最后,不要忘记保存prefab
下面是用这套插件做的GIF,这次脚部不会乱动了

总结

推荐用2DAnimation插件做动画
优点:
1.美术工作量小,
2.动画柔和,做软材质的角色最合适(比如上面机器人的肘部,会自动弯折,很生动)
3.有IK可以使用,
缺点:
由于有了蒙皮,并且肢体并没有被拆分,所以做机械性的刚体属性的角色不能完成.(比如上面的机器人,用了这个后,我并没有让上臂动,因为上臂与身体重合,会带动身体产生形变)
角色切片这种动画模式Key帧麻烦,组装角色也比较麻烦,美术工作量大,
但是,类似于刚体动画,2DAnimation插件难以完成的,只能用这个方式

END

你可能感兴趣的:(unity)