http://www.cocoachina.com/bbs/read.php?tid=458895&page=1&toread=1#tpc
New: 教程司令部已经更新了教程 往后不再使用链式的教程结构
午夜来一发教程醒醒神= =
不知道大家明天是不是要上班了呢
呵呵呵 好啦 我们继续吧
这次我们学一下如何修改动画上的属性
关于添加帧动画的内容 请参考 http://www.cocoachina.com/bbs/read.php?tid-458312.html
那么 添加plist 加动画 写脚本的杂活已经干完了= = 我们就直接就看如何加属性好了
半成品源码在这里 (可以从这里开始学习添加动画属性) http://pan.baidu.com/s/1eRfn5Ge,1
打开项目后就是这个样子了
anim文件夹为hero的帧动画
js文件夹就是调度动画的脚本啦
modelAnim文件夹为 model的动画 负责移动的动画
我们要学的就是 如何添加一个model节点 并未model节点添上移动动画 然后将hero绑到model上
这样model移动的动画就和hero的帧动画拆开来了
以后美术换皮就改hero上面的动画就行了
而程序只要对model的移动写逻辑就行了
好了 下面介绍下怎么加model
在canvas上创建一个空节点 重命名为model
然后将hero拖到model上 作为model的子节点 (请将hero拖到model上悬停5~8秒 好东西总要耐心 呵呵呵)
然后呢 选中hero 将属性检查器中的position设置为 0, 0
(完了大家可以试一下蓝色路线,本次教程的根源就是这个= =)
好了这时候我们已经将hero的皮加到model上了
我们选回model 新建一个Animation组件
好啦 然后就能看到动画面板中的节点树关系啦 对上层的影响就会级联到下面的节点了
(好吧 这里出了点小差错 我应该先把modelAnim里面的b1b1删掉的= =)
那我们就直接用这个好了
将modelAnim中的b1b1拖到model的Animation组件的defaultClip
然后将按住鼠标左键全选下方两个蓝色菱形
然后按键盘上Delete就可以了
好了 我们继续吧
首先将当前帧调为第一帧 然后将model移动到适当的开始位置
然后就能看到第一帧添加了一个position的属性啦
然后将当前帧调为第二帧 然后将model移动到适当的结束位置
同样也会添加位置属性啦 然后我们调一下时间间隔吧 一种是将当前帧拉长 （鼠标按住和position同高的后一个蓝色菱形拖动）
另一种就是调采样频率啦 我喜欢用这个 (前一个不知道要拖到猴年马月)
好吧因为之前的时候 这里就不用调时间了
那么到这里我们model的移动就已经调好啦 可以按动画的运行键看一下啦
那么属性的添加就是这样一个过程啦
实际上 只要是该节点上 所有组件(除脚本) 的属性 都可以针对每帧修改的
如果挂上了Sprite组件 就能访问里面的cc.SpriteFrame属性了 也就是我们添加的帧动画了
如果修改的是node组件 就会触发标题所说的AnimationCurve啦 也就是我们这次的教程的原理啦
我们可以继续添加帧属性 比方说位置 如果不在一条线上的话 动画编辑器会自动帮我们把它连成光滑的曲线啦
那么动作曲线和时间曲线的内容我们留到下次再讲吧 我要睡觉了= =
本次源码 : http://pan.baidu.com/s/1nu2FUrR,1
http://www.cocoachina.com/bbs/read.php?tid=458895&page=1&toread=1#tpc
http://www.cocoachina.com/bbs/read.php?tid=459481
下一篇: AnimationCurve(2) 简易教程 coming soon…