一、角色序列幀.ani動(dòng)畫(huà)的制作

1、在項(xiàng)目管理器中創(chuàng)建動(dòng)畫(huà)文件

2.創(chuàng)建動(dòng)畫(huà)模板，編輯動(dòng)效名稱(chēng)

3.編輯序列幀動(dòng)畫(huà)

.ani格式動(dòng)畫(huà)的代碼控制

1.動(dòng)畫(huà)加載loadAnmition()

2.播放與停止、動(dòng)效模板切換

3.動(dòng)畫(huà)幀位置控制

4.動(dòng)畫(huà)播放完成事件

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);//對(duì)動(dòng)效模板進(jìn)行監(jiān)聽(tīng)this.tweenui.ani.on(Laya.Event.LABEL,this,onLabel);// loadAnimation三個(gè)參數(shù)this.roleAni = new Laya.Animation();// 第一個(gè)路徑 后面兩個(gè)可以默認(rèn)不填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) }

　　

二、動(dòng)效動(dòng)畫(huà)的制作

主要用于UI中一些相同的，需要批量制作的動(dòng)畫(huà)，比如按鈕動(dòng)畫(huà)

動(dòng)效動(dòng)畫(huà)不能像Animation動(dòng)畫(huà)一樣去代碼控制，但可以在IDE中加入事件觸發(fā)

在IDE中新建

0不變 第5幀設(shè)置縮放0.5 10幀還原? 。在之前需要設(shè)置中心點(diǎn)

制作按鈕回彈效果，制作后直接拖拽到ui中的節(jié)點(diǎn)上。

?

?

?

?三、Animation動(dòng)畫(huà)組件

動(dòng)畫(huà)組件可以直接放入U(xiǎn)I或者視圖中，可視化的設(shè)置位置大小，播放與否等

四、骨骼動(dòng)畫(huà)的轉(zhuǎn)換和使用

LayaAir引擎支持第三方骨骼動(dòng)畫(huà)資源的轉(zhuǎn)換

需要使用IDE骨骼動(dòng)畫(huà)轉(zhuǎn)換工具后轉(zhuǎn)換使用

從spine和DrgonBone中導(dǎo)出資源注意事項(xiàng)

圖集、旋轉(zhuǎn)、版本

LayaAir引擎播放Spine骨骼動(dòng)畫(huà)

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

骨骼動(dòng)畫(huà)轉(zhuǎn)化

生成png和sk的文件

骨骼動(dòng)畫(huà)的代碼加載與使用?

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

1.動(dòng)畫(huà)模板Templet方式創(chuàng)建骨骼動(dòng)畫(huà)Skeleton

代碼量比較大

2.直接加載資源創(chuàng)建骨骼動(dòng)畫(huà)Skeleton

代碼小

從模板獲取動(dòng)畫(huà)? buildArmature()

動(dòng)畫(huà)切換皮膚 showSkinByIndex()

Laya.init(1334,750,Laya.WebGL); //直接創(chuàng)建骨骼動(dòng)畫(huà) // 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); // }// 板創(chuàng)建骨骼動(dòng)畫(huà) 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* 創(chuàng)建骨骼動(dòng)畫(huà)* @param {String} path 骨骼動(dòng)畫(huà)路徑* @param {Number} rate 骨骼動(dòng)畫(huà)幀率，引擎默認(rèn)為30，一般傳24* @param {Number} type 動(dòng)畫(huà)類(lèi)型 0,使用模板緩沖的數(shù)據(jù)，模板緩沖的數(shù)據(jù)，不允許修改 （內(nèi)存開(kāi)銷(xiāo)小，計(jì)算開(kāi)銷(xiāo)小，不支持換裝） 1,使用動(dòng)畫(huà)自己的緩沖區(qū)，每個(gè)動(dòng)畫(huà)都會(huì)有自己的緩沖區(qū)，相當(dāng)耗費(fèi)內(nèi)存 （內(nèi)存開(kāi)銷(xiāo)大，計(jì)算開(kāi)銷(xiāo)小，支持換裝） 2,使用動(dòng)態(tài)方式，去實(shí)時(shí)去畫(huà) （內(nèi)存開(kāi)銷(xiāo)小，計(jì)算開(kāi)銷(xiāo)大，支持換裝,不建議使用）* * @return 骨骼動(dòng)畫(huà)*/ // 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");

　　

?

轉(zhuǎn)載于:https://www.cnblogs.com/joyce123/p/8647478.html

總結(jié)

以上是生活随笔為你收集整理的layaAir引擎制作游戏的图集动画、时间轴动画、和骨骼动画总结二的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。