記得剛進遊戲業的時候常常聽人家講 Sprite Sheet，但是不知道是什麼意思。
(上圖為 Zwoptex sprite sheet 製作工具中編排 sprite 的畫面)
Sprite sheet 顧名思義就是存有很多 sprite 的資料，通常包含一個 png 檔以及 plist 檔，PNG 檔存有所有程式中要用到的 sprite，plist 則定義所有 sprite 的位置跟大小。
為什麼要使用 sprite sheet 呢？一般來說有以下幾個原因：
1. 減少 OpenGL ES 執行 draw call 的次數，有 sprite sheet 的話只要執行一次就可以把所有的 sprite 處理完儲存在記憶體中
2. 減少記憶體的使用量：因為在電腦裡 sprite 的大小是儲存為二的倍數，所以假如你有一張 129x129 的貼圖 (只比128大一點點)，系統將配置一個 256x256 (2的倍數) 的貼圖來做儲存，中間會有許多空白的記憶體空間浪費掉。
3. 可利用 PNG 透明區塊儲存更多的圖像
市面上有兩個工具支援 Cocos2D 的 sprite sheet 製作：
1. Texture Packer
2. Zwoptex (此範例使用 Zwoptex 來產生 sprite sheet 因為此軟體可免費使用。)
先使用軟體將 sprite sheet 製作出來後，在 Cocos2D-x 中的語法相當簡單：
|
CCSpriteBatchNode *spriteBatchNode; spriteBatchNode = CCSpriteBatchNode::create("scene1atlas.png"); CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("scene1atlas.plist"); pSprite = CCSprite::createWithSpriteFrameName("city1.png"); pSprite->setAnchorPoint(ccp(0, 0)); pSprite->setPosition(ccp(0,0)); spriteBatchNode->addChild(pSprite); this->addChild(spriteBatchNode,1); |
1. 建立一個 CCSpriteBatchNode, 並 create with 您已製做完成的 sprite sheet (.png)
2. 建立一個 CCSpriteFrameCatche 並使用 addSpriteFramesWithFile 將 .plist 加入
3. 建立 sprite 物件，使用 createWithSpriteFrameName
4. 將 sprite 物件加入到 CCSpriteBatchNode 中 (所有要透過 sprite sheet 建立的 sprite 物件都必須加入到 CCSpriteBatchNode 中)
5. 最後將 CCSpriteBatchNode 加入到場景中
希望對初學遊戲程式設計的朋友有所幫助。
----------------------------------
筆者：Alan Feng
大學由資管系畢業後便投入職場，先後擔任程式設計師，系統設計師，系統分析師，專案管理師等職務。
曾服務於資訊服務業，電子代工設計公司，目前在內湖一間遊戲公司擔任專案管理師～
持有國際 PMP 證照並努力學習 Scrum 敏捷式開發框架中。
留言列表
專案管理 (2)
