聊一聊一些熒幕和現(xiàn)場(chǎng)背后的圖像故事（30）--什么是spine動(dòng)畫

2022-04-23 02:58 作者:盲人號(hào) 0人讀過(guò) | 我要投稿

如果你曾經(jīng)開(kāi)發(fā)過(guò)2D游戲并需要使用精靈動(dòng)畫，你可能要求美術(shù)人員創(chuàng)建逐幀動(dòng)畫，例如這個(gè)教程中的iOS Games by Tutorials:

然后你可能會(huì)寫一些代碼來(lái)快速播放這個(gè)圖片序列，以模擬出動(dòng)畫效果，就像這樣：

這個(gè)方法實(shí)現(xiàn)起來(lái)很簡(jiǎn)單，但有幾個(gè)嚴(yán)重的缺陷：

內(nèi)存和閃存占用率高。
要因?yàn)槟阋獮閯?dòng)畫的每一幀生成一張精靈圖片，它們會(huì)占用大量存儲(chǔ)空間。你要?jiǎng)討B(tài)處理一個(gè)不小的精靈，而在你的動(dòng)畫中有大量的精靈要處理，這會(huì)帶來(lái)一個(gè)坑爹的問(wèn)題。這個(gè)問(wèn)題在移動(dòng)設(shè)備上尤為嚴(yán)重，因?yàn)閮?nèi)存容量和閃存容量都很有限。
制作動(dòng)畫的成本高昂。
繪制完整的一幀需要花費(fèi)美術(shù)人員很多時(shí)間。如果在動(dòng)畫完成后，要進(jìn)行調(diào)整將會(huì)更耗時(shí)。
能自已做動(dòng)畫的碼農(nóng)畢竟不多。
因?yàn)橐掷L每一幀，如果你是個(gè)碼農(nóng)那就得跪求美術(shù)人士來(lái)做動(dòng)畫，如果隨后要加特效你還得去跪求人家。
在您的游戲中使用2D骨骼動(dòng)畫系統(tǒng)，就能解決這些麻煩。它并不會(huì)把動(dòng)畫中的每一幀存儲(chǔ)下來(lái)，取而代之的是存儲(chǔ)像下面這樣身體的各個(gè)部分：

然后你可以創(chuàng)建一個(gè)很小的動(dòng)畫文件，它定義了如何移動(dòng)身體各個(gè)部分，使其按照你想要的效果表演動(dòng)畫，如走、跑或跳。然后你可以在游戲中用代碼讀取動(dòng)畫文件，自動(dòng)為身體的每個(gè)部分創(chuàng)建精靈，然后按照文件中描述的數(shù)據(jù)動(dòng)畫它們。
當(dāng)然手動(dòng)創(chuàng)建一個(gè)2D骨骼動(dòng)畫系統(tǒng)，是項(xiàng)瘋狂的工作。幸福的是Esoteric Software 已經(jīng)為我們創(chuàng)建了這樣偉大的工具Spine。
Spine的圖形界面能讓你以交互的方式，為每一個(gè)精靈創(chuàng)建骨骼，然后用骨骼創(chuàng)建你要在游戲中使用的動(dòng)畫。

Spine還自帶了龐大的預(yù)制運(yùn)行庫(kù)Spine runtimes，這是一個(gè)奇妙的方式“在你的游戲中添加讀取Spine文件的代碼，然后它為創(chuàng)建動(dòng)畫?！盨pine的運(yùn)行庫(kù)，支持目前所有主流的游戲引擎Unity, Sprite Kit, cocos2d 等等。

在本教程中，你將用Spine制作一個(gè)笨拙的小精靈行走和跌倒的動(dòng)畫。這個(gè)過(guò)程中你將學(xué)會(huì)：

導(dǎo)入圖片到Spine中
為精靈構(gòu)建一套骨架
創(chuàng)建兩個(gè)不同的動(dòng)畫
保存和導(dǎo)出你的成果
要注意的是本教程不包括將動(dòng)畫結(jié)果導(dǎo)入到游戲中；那將是一個(gè)獨(dú)立的教程。本教程的重點(diǎn)是如何使用Spine本身，而不理會(huì)你將選擇哪種游戲引擎。
如果你已準(zhǔn)備好邁出Spine的第一步，那就讓我們開(kāi)始吧！

開(kāi)始（Getting Started）

首先第一件事：你要先下載并安裝Spine.
Spine支持 Windows, Mac 和 Linux. 有三個(gè)版本，五種授權(quán)方式供你選擇。詳情看下面說(shuō)明。
( 教程原文中關(guān)于購(gòu)買Spine這一塊的資料年代過(guò)于久遠(yuǎn)，這里直接看官方的購(gòu)買頁(yè)面吧：?http://esotericsoftware.com/spine-purchase?)

對(duì)于本教程的內(nèi)容，你在試用版中都可以做到。然而在教程最后，你會(huì)發(fā)現(xiàn)試用版無(wú)法導(dǎo)出你的動(dòng)畫。如果你完成了教程的其它本分，并且渴望在你的應(yīng)用中看到自已制作的動(dòng)畫，那你應(yīng)該考慮購(gòu)買基本版或?qū)I(yè)版Spine許可，這樣你就可以保存和導(dǎo)出你的成果了。
那么選擇一個(gè)版本下載吧，安裝并運(yùn)行它。如果你用的是Mac，當(dāng)你試圖運(yùn)行Spine時(shí)你可能會(huì)看到下面的提示信息：

點(diǎn)擊繼續(xù)你將打開(kāi)Apple的支持頁(yè)面。在頁(yè)面中的第一段里點(diǎn)擊http://xquartz.macosforge.org鏈接。跳到X Quartz下載頁(yè)面。下載并安裝X11，然后再次運(yùn)行Spine,現(xiàn)在它能正常啟動(dòng)了。

一旦你順序打開(kāi)Spine,歡迎你的將是一個(gè)示例項(xiàng)目。

當(dāng)你準(zhǔn)備開(kāi)始學(xué)習(xí)如何創(chuàng)建自已的動(dòng)畫時(shí)，如果你有興趣，可以隨意研究示例項(xiàng)目。

Spine導(dǎo)入圖片

導(dǎo)圖的工作已經(jīng)有導(dǎo)圖腳本可以實(shí)現(xiàn)了，但你還是應(yīng)該明白它都自動(dòng)幫你做了些什么
為了讓你專心學(xué)習(xí)Spine，我為你準(zhǔn)備好了小精靈的切片素材，接下來(lái)你將用它創(chuàng)建制作動(dòng)作。
點(diǎn)擊這里下載素材，把文件夾解壓到桌面，這樣便于在Spine中找到它。
點(diǎn)擊左上角的Spine標(biāo)志，選擇新建項(xiàng)目New Project.

在右邊的層級(jí)樹面板中選擇圖像節(jié)點(diǎn)Images,然后點(diǎn)擊下面的瀏覽Browse.

在你的桌面上找到?SpineElf_START?文件夾，選中后確定。

現(xiàn)在文件夾中所有的圖片顯示在了Images節(jié)點(diǎn)下。

現(xiàn)在按正常情況來(lái)說(shuō)你應(yīng)該保存項(xiàng)目了，第一條準(zhǔn)則“在整個(gè)過(guò)程中，隨時(shí)保存！”。
遺憾的是如果你用的是試用版，就木有保存功能。當(dāng)然拉，如果你升級(jí)到基礎(chǔ)版或?qū)I(yè)版，你就可以按Ctrl+S?或Cmd+S?保存項(xiàng)目了，把它保存在SpineElf_START?文件夾中。
如要你使用的是試用版，也別煩惱。你在使用Spine制作動(dòng)畫的過(guò)程，也就是體驗(yàn)一場(chǎng)刺激的冒險(xiǎn)游戲的過(guò)程。到于Ctrl+S是膽小鬼才干的事，對(duì)于威武雄壯的你自然是不屑一顧的。

裝配角色

要?jiǎng)?chuàng)建你的角色，你需要去當(dāng)?shù)氐拇髮W(xué)里，報(bào)名參加點(diǎn)解剖學(xué)和美術(shù)學(xué)方面的課程。呵呵！騙你的！其實(shí)本教程為你提供了美術(shù)素材，你只要拖放切片素材到場(chǎng)景中就行了。
在Images節(jié)點(diǎn)中選中body?然后拖放到場(chǎng)景中。

一開(kāi)始我不知道怎么平移動(dòng)畫布，所以我用一個(gè)超搓的辦法來(lái)改變畫布位置。用鼠標(biāo)滑輪先縮放，然后光標(biāo)放到另一個(gè)位置放大，這樣來(lái)移動(dòng)畫面。后來(lái)Update:@mig_akira告訴我，可以按住右鍵移動(dòng)鼠標(biāo)來(lái)移動(dòng)畫布！非常感謝他。
現(xiàn)在再把head拖到場(chǎng)景中。