Cocosd使用骨骼動畫Spine

2021-07-09 06:24:24 字數 2310 閱讀 3122

遊戲中人物的走動,跑動,攻擊等動作是必不可少,實現它們的方法一般採用幀動畫或者骨骼動畫。

幀動畫與骨骼動畫的區別在於:幀動畫的每一幀都是角色特定姿勢的乙個快照,動畫的流暢性和平滑效果都取決於幀數的多少。而骨骼動畫則是把角色的各部分身體部件繫結到一根根互相作用連線的「骨頭」上,通過控制這些骨骼的位置、旋轉方向和放大縮小而生成的動畫。

它們需要的資源各不相同,如下分別是幀動畫和骨骼動畫所需的資源圖:  

骨骼動畫比傳統的逐幀動畫要求更高的處理器效能,但同時它也具有更多的優勢,比如:

spine是一款針對遊戲的2d骨骼動畫編輯工具,它具有良好的ui設計和完整的功能,是乙個比較成熟的骨骼動畫編輯器。spine旨在提供更高效和簡潔的工作流程,以建立遊戲所需的動畫。

使用spine建立骨骼動畫分兩大步驟:

在setup模式下,組裝角色部件,為其繫結骨骼;

在animate模式下,基於繫結好的骨骼建立動畫。

下面簡單介紹下具體步驟,更多詳細內容請檢視官方**教程:spine快速入門教程。

1)在setup模式下,選中images屬性,匯入所需資源所在資料夾,其中路徑名和資源名中不能出現中文,否則解析不了;  

2)拖動images下的到場景,對角色進行組裝(把各個身體部位拼在一起),可通過draw order屬性調整所在層的順序;  

3)建立骨骼,並繫結到骨骼上,要注意各骨骼的父子關係。  

4)切換到animate模式,選中要「動」的骨骼,對其進行旋轉、移動、縮放等操作,每次改動後要記得打關鍵幀。 

5)在選單欄找到texture packer項,對角色紋理進行打包,資源檔案字尾為atlas(而非cocos2d-x常用的plist)。打包後將生成兩個檔案,即:png 和 atlas。  

6)匯出動畫檔案json。 

cocos2d-x程式中,使用spine動畫首先需要包含spine的相關標頭檔案。

#include #include "spine/spine.h"

using namespace spine;

其常用方法如下: 

建立乙個spine動畫物件,將動畫檔案和資源檔案匯入。

auto skeletonnode = new skeletonanimation("enemy.json", "enemy.atlas");
skeletonnode->setanimation(0, "walk", true);
skeletonnode->addanimation(0, "walk", true);

skeletonnode->addanimation(0, "attack", false);

skeletonnode->setmix("walk", "attack", 0.2f);

skeletonnode->setmix("attack", "walk", 0.4f);

skeletonnode->timescale = 0.6f;
設定是否顯示骨骼通過設定debugbones,true表示顯示,false表示隱藏。

skeletonnode->debugbones = true;
auto skeletonnode = new skeletonanimation("enemy.json", "enemy.atlas");

skeletonnode->setmix("walk", "attack", 0.2f);

skeletonnode->setmix("attack", "walk", 0.4f);

skeletonnode->setanimation(0, "walk", false);

skeletonnode->setanimation(0, "attact", false);

skeletonnode->addanimation(0, "walk", false);

skeletonnode->addanimation(0, "attact", true);

skeletonnode->debugbones = true;

size windowsize = director::getinstance()->getwinsize();

skeletonnode->setposition(point(windowsize.width / 2, windowsize.height / 2));

addchild(skeletonnode);

效果圖:  

骨骼動畫公式

本節你將回顧一些骨骼動畫用到的概念和數學公式。乙個骨骼動畫是由許多關鍵幀組成的,每個關鍵幀儲存了乙個bone的配置 朝向和位置 和bone對應的時間。在每個時間間隔,你使用乙個或多個關鍵幀改變bone的配置。圖11 7展示了一張如圖11 3中的骨骼的動畫,當left shoulder bone的朝向...

骨骼動畫換裝

之前看過好多有關骨骼動畫換裝的文章,雖然給予很大幫助,然而自己也是費了很大勁,最終也是自己解決了問題,我把自己的解決方式分享出來,希望對你有所幫助 void changearmaturebone cocostudio armature armature const char bonename coc...

LAYA 骨骼動畫

建立骨骼動畫 private var sk skeleton private function showski void private function onloaded t templet void if sk null sk.url t.url sk t.buildarmature 0 sk....