Cocos2d-x优化中图片优化

一、选择图片格式

在探讨如何选择图片格式之前，我们需要先了解目前移动平台所使用的图片文件格式，以及Cocos2d-x对这些格式的支持情况。虽然图片格式众多，但在移动平台上，主要推荐使用PNG格式，JPG格式也可考虑，其他文件格式则建议转化为PNG格式。下面来详细了解它们的特点。

1. PNG文件

PNG文件格式的设计初衷是替代GIF和TIFF文件格式，它是一种位图存储格式。PNG采用无损压缩，支持Alpha通道数据，可实现透明效果，但不支持动画。该格式能够保存高保真的复杂图像，不过文件体积相对较大。PNG格式具体可分为PNG8和PNG24，后面的数字代表这种PNG格式最多可以索引和存储的颜色值。

2. JPG文件

JPG全称为JPEG，它以24位颜色存储单个位图图形。JPG是一种与平台无关的格式，支持高级别的压缩，压缩比率最高可达100:1。然而，这种压缩是以牺牲图像质量为代价的，目的是换取更小的文件大小。JPG不支持透明效果，比较适合摄影图像或写实图像作品，因为这类图像颜色丰富。但对于颜色较少、具有大块相近颜色区域或亮度差异明显的简单图片，JPG就不太适用了。

3. JPG与PNG的选择

很多人认为JPG文件小，加载到内存纹理时占用的内存也少，这种观点是错误的。需要明确的是，纹理和图片是两个不同的概念。如果把纹理比作搭好的野营帐篷，那么图片格式就像是收纳折叠后的帐篷袋子，袋子的大小并不能代表帐篷搭起来后的大小。在Cocos2d-x平台上，JPG加载后会先被转化为PNG格式，再转换为纹理并保存在内存中，这无形中增加了JPG文件的解码时间。因此，无论JPG在其他平台表现如何，在移动平台下它都无法与PNG相媲美。

二、拼图

大家可能会有这样的疑问：为什么要把场景中的小图片都拼接成一个大图片呢？在使用精灵表时我们曾简单提及，下面详细介绍其原因。

1. 拼接大图的优势

将多个小图拼接成一个大图（纹理图或精灵表），可以减少IO操作。使用散图时，每次都要针对一个图创建精灵并添加到纹理缓存，若频繁且大量创建，会对CPU和内存造成较高的开销。而使用大图时，可一次性创建精灵帧缓存，并将它们的纹理添加到纹理缓存中，能显著提高效率。

2. 拼接注意事项

在进行图片拼接时，若能满足用户对图像保真度的要求，大图越小越好。我们可以借助TexturePacker等纹理拼图工具，并设置纹理支持NPOT。关于这些工具的使用，可参考《Cocos2d-x实战（卷Ⅳ）：工具详解》。

3. NPOT的概念及优势

NPOT是“non power of two”的缩写，即非2的N次幂。在OpenGL ES1.1中，纹理图片要求是2的N次幂（即POT），否则无法创建纹理。在POT要求下，使用纹理工具拼接成的大图可能会存在很多空白区域，造成空间浪费，同时增加图片大小。例如，某张按POT要求拼接的图片大小为2048KB，右下角存在一些空白区域。

而在OpenGL ES2.0之后，支持了NPOT。采用NPOT拼图时，整个图片基本没有大的空白区域，能充分利用图片空间。如一张采用NPOT拼图的图片大小为1822KB，相比之前节省了200KB，这在移动平台上是相当可观的。