description: 为什么要谈纹理的问题,游戏的画面无时无刻不充斥着图像,通俗意义上一款精致的游戏都有着非常精美的画面。这样往往能给玩家带来更好的游戏体验,这一点也是对于游戏制作者来说所尽力追求的,可是无奈有CPU和GPU的限制,手持设备上的硬件资源就更窘迫一些了。怎样处理好图片资源。往往能给游戏提供更大的扩展空间。从画面上给游戏加分。

为什么要谈纹理的问题。游戏的画面无时无刻不充斥着图像,通俗意义上一款精致的游戏都有着非常精美的画面。这样往往能给玩家带来更好的游戏体验。这一点也是对于游戏制作者来说所尽力追求的,可是无奈有CPU和GPU的限制,手持设备上的硬件资源就更窘迫一些了。怎样处理好图片资源,往往能给游戏提供更大的扩展空间,从画面上给游戏加分。

就我个人的经历来说。手机上图片资源处理主要是环绕两个点来周旋的,一个是图片占用的内存,图片载入后生成的纹理会存储在GPU中。而纹理的像素格式就决定了在GPU中的内存,占用的内存小来保证了游戏的机型支持。在低端机上也能执行游戏;还有一个非常重要的点就是图片的载入速度,速度太慢会导致CPU占用太大,游戏会显得比較卡。这一点非常影响用户体验。

对于我们来说须要处理的就是在这两者与游戏画面之间找到自己的平衡点,採用适合自己游戏的图片资源处理方式。以下来慢慢介绍图片部分的基础知识,后面会再更新-x底层是怎样载入和处理图片的一些文章,分享自己的一些看法。

像素格式

(以下为texturepacker支持的打包格式)

像素格式

描写叙述

RGBA8888

默认32位真彩色,4 bytes per pixel, 8 bits per channel

BGRA8888

32位。4 bytes per pixel, 8 bits per channel

RGBA4444

16位色,2 bytes per pixel, 4 bits per channel

RGB888

24位真彩色,3 bytes per pixel, 8 bits per channel, no transparency

RGB565

16位色,2 bytes per pixel, 5 bits for red and blue, 6 bits for green, no transparency。人的眼睛对绿色更敏感

RGBA5551

16位色,2 bytes per pixel, 5 bits per color channel, 1 bit transparency

RGBA5555

20位色,比較特殊的格式,大部分游戏引擎都不支持,3 bytes per pixel, 5 bits per channel, not supported on all platforms

PVRTC2

2 bits per pixel, iPhone only, only PVR files, no real-time preview available

PVRTC4

4 bits per pixel, iPhone only, only PVR files, no real-time preview available

PVRTC2_NOALPHA

2 bits per pixel, iPhone only, only PVR files, no real-time preview available

PVRTC4_NOALPHA

4 bits per pixel, iPhone only, only PVR files, no real-time preview available

ALPHA

Black and white image of the alpha channel

ALPHA_INTENSITY

16 bit alpha + intensity, PVR export only

ETC1

ETC1 compression (pkm file only)

其它的常见格式

像素格式

描写叙述

A8

8位色。仅仅有8位通道的透明通道,用来做遮罩图

I8

8位色,仅仅存储8位的灰度或强度值。用来做灰度图使用

AI88

16位色。存储透明和灰度双功能的值

S3TC_DXT1

Compressed color texture format.

S3TC_DXT3

3.0新加的,后面研究后再更新

S3TC_DXT5

3.0新加的,后面研究后再更新

ATC_RGB

ATC (ATITC) 4 bits/pixel compressed RGB texture format.

ATC_EXPLICIT_ALPHA

3.0新加的,后面再更新

ATC_INTERPOLATED_ALPHA

3.0新加的。后面再更新

纹理格式

1、png

png图片可谓最常见的真彩图片了,png格式有3种,png8,png24。png32,24位png不支持透明。除了PVRTC和ETC1的像素格式外,大部分的像素格式都支持。

格式

支持色彩通道

索引色编辑支持

透明支持

PNG8

256索引色。每索引色24位(1600万色)

支持

支持设定特定索引色为透明色(布尔透明),支持为索引色附加8位透明度(256阶alpha透明)

PNG24

约1600万色

不支持

不支持

PNG32

约1600万色

不支持

支持8位透明度(256阶alpha透明)

2、pvr

pvr纹理格式是针对iOS设备进行了特殊优化的一种格式了,PowerVR显卡能够直接载入,速度快(相似win下的dds图片)。并且每像素2或4位的像素格式使得占用内存非常小,基本上在iOS平台的pvr图片格式从载入速度和占用内存两点来说都具有非常大的优势。

pvr除了支持场景的RGB像素格式意外还支持有损压缩PVRTC。尽管PVRTC和jpg同样是有损压缩,可是PVR纹理不会在内存中解压缩纹理。

PVR特殊的像素格式:PVRTC2。PVRTC4,PVRTC2_NOALPHA,PVRTC4_NOALPHA。这里的没有ALPHA值就是指图片里面没有透明像素,同一时候很多其它的色位会用来表示颜色,图片的颜色质量就会高一点。

须要注意的:假设去官网下载PowerVR的SDK来生成pvr格式的纹理有非常大的局限,不仅必须是2的幂还必须要是正方形的。

3、etc1

etc1的格式(pkm或ktx扩展名)是opengles2.0均支持的格式,但android机型众多。显卡型号也有非常大的区别,我们的游戏出现过在一些山寨机上etc1图片无法正常显示或者崩溃的情况,并且部分显卡不支持NPOT的etc1图片。所以在android上如今不太推荐使用etc1。

以下针对iOS下纹理格式进行载入的測试,时间单位是微秒,測试设备是iPhone5。用的是原生的cocos2dx3.0的引擎(没有进行改动),纹理的像素格式均为RGBA8888。所以在显示效果上相几乎相同的,实验的结果基本符合多次測试得出的平均情况。

//RGBA8888 & POT
cocos2d: id=test_png.png(809.6KB) | x: 1024 y: 1024 | time: 25316 | 32 bpp | 4096 KB
cocos2d: id=test_jpg.jpg(119.4KB) | x: 1024 y: 1024 | time: 54506 | 32 bpp | 4096 KB
cocos2d: id=test_pvr.pvr(4.1MB) | x: 1024 y: 1024 | time: 22931 | 32 bpp | 4096 KB
cocos2d: id=test_pvrgz.pvr.gz(1MB) | x: 1024 y: 1024 | time: 24309 | 32 bpp | 4096 KB
cocos2d: id=test_pvrccz.pvr.ccz(1MB) | x: 1024 y: 1024 | time: 17981 | 32 bpp | 4096 KB

//RGB565 & POT
cocos2d: id=test_png.png(460.8KB) | x: 1024 y: 1024 | time: 28319 | 32 bpp | 4096 KB
cocos2d: id=test_jpg.jpg(106.4KB) | x: 1024 y: 1024 | time: 58430 | 32 bpp | 4096 KB
cocos2d: id=test_pvr.pvr(2MB) | x: 1024 y: 1024 | time: 11914 | 16 bpp | 2048 KB
cocos2d: id=test_pvrgz.pvr.gz(385.6KB) | x: 1024 y: 1024 | time: 15373 | 16 bpp | 2048 KB
cocos2d: id=test_pvrccz.pvr.ccz(387.3KB) | x: 1024 y: 1024 | time: 10642 | 16 bpp | 2048 KB

//RGB565 & NPOT
cocos2d: id=test_png.png | x: 504 y: 1157 | time: 192065 | 32 bpp | 2277 KB
cocos2d: id=test_jpg.jpg | x: 504 y: 1157 | time: 104246 | 32 bpp | 2277 KB
cocos2d: id=test_pvr.pvr | x: 504 y: 1157 | time: 5704 | 16 bpp | 1138 KB
cocos2d: id=test_pvrgz.pvr.gz | x: 504 y: 1157 | time: 23246 | 16 bpp | 1138 KB
cocos2d: id=test_pvrccz.pvr.ccz | x: 504 y: 1157 | time: 253244 | 16 bpp | 1138 KB


这里默认的-x还是会以RGBA8888的像素格式创建png和jpg的纹理。须要我们手动改动引擎。从測试结果能够看出,pvr基本完胜了其它纹理格式,载入速度快,特别是pvr.ccz。图片大小仅为pvr格式的1/4,并且载入速度还比pvr要快。

jpg的载入速度还是要慢非常多。.gz和.ccz有个异常情况,NPOT格式纹理载入时间非常长,而对于其它格式纹理。NPOT格式使得载入时间和内存占用上都得到了提升。

持续更新中…

色深:

cocos2dx默认採用32位(RGBA8888)的色深的像素格式来载入纹理。

不考虑纹理压缩,颜色位数少用png8,颜色位数多非透明用jpg。颜色位数多含半透明使用png24,总的思路就是用png8和jpg来降低图片体积大小