游戏是一种很耗费资源的应用,特别是在移动设备中的游戏,性能优化是非常重要的
纹理图集(Texture Atlas)也称为精灵表(Sprite Sheet),它是把许多小的精灵图片组合到一张大图里面。使用纹理图集(或精灵表)有如下主要优点:
减少文件读取次数,读取一张图片比读取一堆小文件要快。
减少OpenGL ES绘制调用并且加速渲染。
减少内存消耗。OpenGL ES 1.1仅仅能够使用2的n次幂大小的图片(即宽度或者高度是2、4、8、64…)。如果采用小图片OpenGL ES1.1会分配给每个图片2的n次幂大小的内存空间,即使这张图片达不到这样的宽度和高度也会分配大于此图片的2的n次幂大小的空间。那么运用这种图片集的方式将会减少内存碎片。虽然在Cocos2d-x v2.0后使用了OpenGL ES 2.0,它不会再分配2的几次幂的内存块了,但是减少读取次数和绘制的优势依然存在。
Cocos2d-x全面支持Zwoptex和TexturePacker,所以创建和使用纹理图集是很容易的。
我们通常可以使用纹理图集制作工具Zwoptex 和TexturePacker帮助我们设计和生成纹理图集文件如下图所示,以及纹理图集坐标文件(plist)组成。
plist是属性列表文件,它是一种XML文件,SpirteSheet.plist文件代码如下:
http://blog.csdn.net/tonny_guan/article/details/26232685#http://blog.csdn.net/tonny_guan/article/details/26232685#https://code.csdn.net/snippets/352798

https://code.csdn.net/snippets/352798/fork
http://blog.csdn.net/tonny_guan/article/details/26232685#http://blog.csdn.net/tonny_guan/article/details/26232685#https://code.csdn.net/snippets/352798

https://code.csdn.net/snippets/352798/fork
<
span style=“font-size:14px;”
<? xml version="1.0"encoding="UTF-8" ?> <!DOCTYPE plist PUBLIC "-//AppleComputer//DTD PLIST 1.0//EN""http://www.apple.com/DTDs/PropertyList-1.0.dtd"<
plist version=“1.0”
<
dict
<
key
frames
</
key
<
dict
①
<
key
hero1.png
</
key
②
<
dict
<
key
frame
</
key
<
string
{{2,1706},{391,327}}
</
string
③
<
key
offset
</
key
<
string
{6,0}
</
string
<
key
rotated
</
key
<
false
/>
<
key
sourceColorRect
</
key
<
string
{{17,0},{391,327}}
</
string
<
key
sourceSize
</
key
<
string
{413,327}
</
string
④
</
dict
……
<
key
mountain1.png
</
key
<
dict
<
key
frame
</
key
<
string
{{2,391},{934,388}}
</
string
<
key
offset
</
key
<
string
{0,-8}
</
string
<
key
rotated
</
key
<
false
/>
<
key
sourceColorRect
</
key
<
string
{{0,16},{934,388}}
</
string
<
key
sourceSize
</
key
<
string
{934,404}
</
string
</
dict
… …
</
dict
<
key
metadata
</
key
<
dict
<
key
format
</
key
<
integer
2
</
integer
<
key
realTextureFileName
</
key
<
string
SpirteSheet.png
</
string
<
key
size
</
key
<
string
{1024,2048}
</
string
<
key
smartupdate
</
key
<
string
TexturePacker:SmartUpdate:5f186491d3aea289c50ba9b77716547f:abc353d00773c0ca19d20b55fb028270:755b0266068b8a3b8dd250a2d186c02b
</
string
<
key
textureFileName
</
key
<
string
SpirteSheet.png
</
string
</
dict
</
dict
</
plist
</
span
上述代码是plist文件,其中代码①~④描述了一个精灵帧(小的精灵图片)位置,第②行代码是精灵帧的名字,一般情况下它的命名与原始的精灵图片名相同。第③行代码描述了精灵帧的位置和大小,{2,1706}是精灵帧的位置,{391,327}是精灵帧的大小。由于我们不需要自己编写plist文件,其它的属性我们就不再介绍了。
使用精灵表文件最简单的方式是使用Sprite 的create (const std::string &filename, const Rect &rect)函数,其中创建矩形Rect对象可以参考坐标文件中第③行代码的{{2,1706},{391,327}}数据。使用create代码如下:
http://blog.csdn.net/tonny_guan/article/details/26232685#http://blog.csdn.net/tonny_guan/article/details/26232685#https://code.csdn.net/snippets/352798

https://code.csdn.net/snippets/352798/fork
<
span style=“font-size:14px;”
auto mountain1 = Sprite::create(“SpriteSheet.png”,Rect(2,391,934, 388)); mountain1-
setAnchorPoint(Point::ZERO); mountain1-
setPosition(Point(-200,80)); mountain1-
addChild(mountain1,0);
</
span
在创建纹理Texture2D对象,也可以使用精灵表文件,代码如下:
http://blog.csdn.net/tonny_guan/article/details/26232685#http://blog.csdn.net/tonny_guan/article/details/26232685#https://code.csdn.net/snippets/352798

https://code.csdn.net/snippets/352798/fork
<
span style=“font-size:14px;”
Texture2D* cache = TextureCache::getInstance()-
addImage(“SpirteSheet.png”); auto hero1 = Sprite::create(); hero1-
setTexture(cache); hero1-
setTextureRect(Rect(2,1706,391,327)); ① hero1-
setPosition(Point(800,200)); this-
addChild(hero1,0);
</
span
上述代码第①行中的setTextureRect函数,使用坐标文件中描述的数据。
更多内容请关注Cocos2d-x系列图书http://cocoagame.net/forum.php?mod=forumdisplay&fid=42
本书交流讨论网站:http://www.cocoagame.net/
欢迎加入cocos2d-x技术讨论群:257760386、327403678