光触媒网站建设,拖拽式建站源码,大学二级学院网站建设必要性,世界服装鞋帽网免费做网站1: 掌握sp.Skeleton组件的使用;spine骨骼动画工具1: 骨骼动画: 把动画打散, 通过工具#xff0c;调骨骼的运动等来形成动画2: spine是一个非常流行的2D骨骼动画制作工具3: spine 动画美术人员导出3个文件:(1) .png文件:动画的”骨骼”的图片集;(2).atlas文件: 每个骨骼在图片集…1: 掌握sp.Skeleton组件的使用;spine骨骼动画工具1: 骨骼动画: 把动画打散, 通过工具调骨骼的运动等来形成动画2: spine是一个非常流行的2D骨骼动画制作工具3: spine 动画美术人员导出3个文件:(1) .png文件:动画的”骨骼”的图片集;(2).atlas文件: 每个骨骼在图片集里面位置大小;(3).json文件: 骨骼动画的anim控制文件,以及骨骼位置等信息;4: 骨骼动画导入: 直接把三个文件拷贝到项目的资源目录下即可;5: 使用骨骼动画:(1) 直接拖动到场景;(2) 创建一个节点来添加sp.Skeleton组件;sp.Skeleton1: sp.Skeleton: 控制面板属性:Skeleton Data: 骨骼的控制文件.json文件;Default Skin: 默认皮肤;Animation: 正在播放的动画;Loop: 是否循环播放;Premuliplied Alpha 是否使用贴图预乘;TimeScale: 播放动画的时间比例系数;Debug Slots: 是否显示 Slots的调试信息;Debug Bone: 是否显示Bone的调试信息;2: sp.Skeleton重要的方法: Skeleton是以管道的模式来播放动画管道用整数编号管道可以独立播放动画Track;(1)clearTrack(trackIndex): 清理对应Track的动画(2)clearTracks(); 清楚所有Track动画(3)setAnimation(trackIndex, “anim_name”, is_loop)清楚管道所有动画后再从新播放(4)addAnimation(trackIndex, “anim_name”, is_loop);往管道里面添加一个动画;动画事件监听1: setStartListener: 设置动画开始播放的事件;2: setEndListener : 设置动画播放完成后的事件;3: setCompleteListener: 设置动画一次播放完成后的事件;cc.Class({extends: cc.Component,properties: {// foo: {// default: null, // The default value will be used only when the component attaching// to a node for the first time// url: cc.Texture2D, // optional, default is typeof default// serializable: true, // optional, default is true// visible: true, // optional, default is true// displayName: Foo, // optional// readonly: false, // optional, default is false// },// ...// 界面绑定ske_anim: {type: sp.Skeleton, //default: null,},// end},// use this for initializationonLoad: function () {// 代码获取var spine this.node.getChildByName(spine);var ske_com spine.getComponent(sp.Skeleton);this.ske_com ske_com;this.ske_com.setStartListener(function() {console.log(anim started);});this.ske_com.setEndListener(function() {console.log(anim end);});this.ske_com.setCompleteListener(function() {console.log(play once);});},enter_click: function() {// 清理动画播放管道, 索引来表示// this.ske_com.clearTracks(); // 清理所有播放队列的动画this.ske_com.clearTrack(0); // 指定管道的索引// end// step1, 播放我们的入场动画this.ske_com.setAnimation(0, in, false); // 把管道清空加入当前这个this.ske_com.addAnimation(0, idle_1, true); // 将我们的动画以排队的方式 加入到管道// end// step2: 播放我们的idle// end},click1_anim_click: function() {this.ske_com.clearTrack(0); // 指定管道的索引this.ske_com.setAnimation(0, clk_1, false); // 把管道清空加入当前这个this.ske_com.addAnimation(0, idle_1, true); // 将我们的动画以排队的方式 加入到管道},click2_anim_click: function() {this.ske_com.clearTrack(0); // 指定管道的索引this.ske_com.setAnimation(0, clk_1, false); // 把管道清空加入当前这个this.ske_com.addAnimation(0, idle_1, true); // 将我们的动画以排队的方式 加入到管道},// called every frame, uncomment this function to activate update callback// update: function (dt) {// },
