概述
PNG是20世纪90年代中期开始开发的图像文件存储格式,其目的是企图替代GIF和TIFF文件格式,同时增加一些GIF文件格式所不具备的特性。流式网络图形格式(Portable Network Graphic Format,PNG)名称来源于非官方的“PNG's Not GIF”,是一种位图文件(bitmap file)存储格式,读成“ping”。PNG用来存储灰度图像时,灰度图像的深度可多到16位,存储彩色图像时,彩色图像的深度可多到48位,并且还可存储多到16位的α通道数据。PNG使用从LZ77派生的无损数据压缩算法。
PNG文件格式保留GIF文件格式的下列特性:
使用彩色查找表或者叫做调色板可支持256种颜色的彩色图像。
流式读/写性能(streamability):图像文件格式允许连续读出和写入图像数据,这个特性很适合于在通信过程中生成和显示图像。
逐次逼近显示(progressive display):这种特性可使在通信链路上传输图像文件的同时就在终端上显示图像,把整个轮廓显示出来之后逐步显示图像的细节,也就是先用低分辨率显示图像,然后逐步提高它的分辨率。
透明性(transparency):这个性能可使图像中某些部分不显示出来,用来创建一些有特色的图像。
辅助信息(ancillary information):这个特性可用来在图像文件中存储一些文本注释信息。
独立于计算机软硬件环境。
使用无损压缩。
PNG文件格式中要增加下列GIF文件格式所没有的特性:
·每个像素为48位的真彩色图像。
·每个像素为16位的灰度图像。
·可为灰度图和真彩色图添加α通道。
·添加图像的γ信息。
·使用循环冗余码(cyclic redundancy code,CRC)检测损害的文件。
·加快图像显示的逐次逼近显示方式。
·标准的读/写工具包。
·可在一个文件中存储多幅图像。
一、png的定义和发展过程:
png是可携式网络图像Portable Network Graphics这三个单词的第一个字母的的缩写。网虫都知道网页图像有gif格式和jpg格式两类,知道png图像格式的人并不多。这不奇怪,因为这个格式的图像最近才得到IE和NETSCAPE两大浏览器阵营的支持。png图像格式发展的时间虽说不长,却历经坎坷。在一九九四年底,由于Unysis公司宣布gif拥有专利的压缩方法,要求开发gif软件的作者须缴交一定费用,因此促使免费的png图像格式的诞生。png一开始便结合gif及jpg两家之长,打算一举取代这两种格式。1996年10月1日由png向国际网络联盟(World Wide Web Consortium)提出并得到推荐认可标准,并且大部分绘图软件支持了png这种格式。这些因素促使微软公司从IE4.0版本开始支持png图像浏览,从此png图像格式生机焕发,我们可以看到在许多欧美网站上大量采用了png图像。
二、png图像的优点
1、兼有gif和jpg的色彩模式。我们知道gif格式图像采用了256色以下的index color色彩模式,jpg采用的是24位真彩模式。png不仅能储存256色以下的index color图像,还能储存24位真彩图像,甚至能最高可储存至48位超强色彩图像。
2、png能把图像文件压缩到极限以利于网络传输,但又能保留所有与图像品质有关的信息的解决方案。png利用了当时已知的有效演算法来储存图像文件中的信息,让图像处理者可以用最小的空间来储存不失真的图像。如果你的图像是以文字、形状及线条为主,png会用类似gif的压缩方法来得到较好的压缩率,而且不破坏原始图像的任何细节。据国际网络联盟测算,八位的png图像比同位的gif图像就小10%到30%。而对于相片品质一类的压缩,png则采用类似jpg的压缩演算法。但是jpg压缩程度越大、影像的品质越差。因为它的压缩是采用的是破坏性压缩法、每次压缩的同时便多多少少漏掉一些像素。png不同于jpg的地方在于:它处理相片类图像亦是采用非破坏性压缩,图像压缩后能保持与压缩前图像质量一样,没有一点失真。
3、更优化的传输显示。熟悉gif格式的图像处理者知道,gif图像有两种模式——normal(普通)模式和interlaced(交错)模式。interlaced模式更适用于网络传输。在传送图像过程中,浏览者先看到图像一个大略的轮廓然后再慢慢清晰。这种理论有点抽象,请各位浏览网页:
http://www.artec.cn/base/ab06033101.htm
在网页右边逐渐出现的人物图像就是采用的interlaced模式。png也采取了interlaced模式,使图像得以水平及垂直方式显像在萤幕上,加快了下载的速度。另外,png还使用CRC检测防止传输时的图档信息流失。
4、透明图像在制作网页图像的时候很有用,我们可以把图象背景设为透明,用网页本身的颜色信息来代替设为透明的色彩,这样可让图像和网页背景很和谐地融合在一起。除此之外,这种方法还可最大范围减少文件大小,增快传输速度。jpg格式无法实现图像透明。采用gif格式透明图像过于刻板,因为gif透明图像只有1与0的透明信息、只有透明或不透明两种选择,没有层次;而png提供了α频段0至255的透明信息,可以使图像的透明区域出现深度不同的层次。在过去,我们处理gif图像需要针对每种背景颜色采用不同的反毛边修饰才行。现在,我们处理png图像就可以让图像覆盖在任何背景上都看不到接缝,改善gif透明图像描边不佳的问题。
5、gif图像在不同系统上所显示的画面也会跟着不一样,但png却可以让你在Macintosh上制作的图像与在Windows上所显示的图像完全相同,反之亦然。某些Macintosh计算机的文件格式图像送到PC机上就必须手动加上副档名才能读取,而png格式图像不存在着这个问题,png被设计成可以通过网络传送到任何机种及作业系统上读取。文字资料(如作者、出处)、储存遮罩(MASK)、伽玛值、色彩校正码等信息均可参杂在png图像中一起传输。
口口声声要取代GIF,连PNG这个名字都摆明了就是要跟死要钱的GIF作对(PNG's Not GIF),那就得拿出真本事来,来能够让使用者信服。以下分别针对各种不同属性的图片文件,做一完整的测试,比较看看,PNG是否有取代GIF的实力。
测试一:全彩Photo图片
取样标准选用短景深的花卉摄影,主要目的在于,比较能够清楚了解图与压缩过后的解像能力。前景花卉的枝叶是否轮廓清晰,而后景朦胧的部分是否清楚展现其连续色级也是重点。红跟绿的对比配色,对于颜色数限制下的色彩展现,也有相当的测试性质。
GIF 16色 7.15k | GIF 32色 9.63k | GIF 64色 12.9k | GIF 128色 15.6k |
![]() | ![]() | ![]() | ![]() |
![]() | ![]() | ![]() | ![]() |
PNG 16色 9.51k | PNG 16色12k | PNG 16色15k | PNG16色 16.5k |
既然画质没有差异,那能够比较的只剩下图片文件大小。在全彩照片的测试中,GIF在每一个颜色数中都占尽上风,平均图片文件只要PNG的80%大小,在全彩复杂图形的压缩上保有一定的优势。PNG在这次的测试中占居第二。
测试二:全彩Photo图片 --> 24bit图形
JPG 25-Q 5.97k | JPG 50-Q 9.19k | JPG 75- Q 18.9k | JPG 100- Q 38.3k |
![]() | ![]() | ![]() | ![]() |
![]() | ![]() | ![]() | ![]() |
PNG 24bit 57.5k |
PNG在规格上可以压制24bit全彩图形,所以我们也增加了与JPG的比较测试。比较方式为,JPG采用分级段缩测试,分别由25、50、75到100,而PNG方面由于PhotoShop并未提供压缩比设定,在PNG规格上亦未标明24Bit图形的压缩品质如何控制,所以仅以一个样本来做比较。(PNG栏中的四张图皆为同一张,为了方便与上面四张JPG比较而复制四份)
测试结果发现,JPG在50的压缩品质下已经相当接近原图,而在75的压缩品质下,几乎已是很难发现压缩失真的痕迹。JPG的压缩方式在压缩全彩图片上确实优秀,而且K 数非常小,9K的画质已是吓吓叫。反观PNG,目前的24bit图片效果似乎中看不重用,图形品质虽好,但是在文件大小上的劣势却相当明显。看来24bit的PNG图形应用,还有待大力改进。
Png 格式分析
现在j2me中能够用到的图片格式一般是png。在游戏开发中,为了得到更好的效果,我们需要对png格式的图片进行处理。下面我就png格式图片结构进行分析。
Png图片结构
Png格式的图片一般由一些数据块组成。列表如下:
数据块符号 | 数据块名称 | 多数据块 | 可选否 | 位置限制 |
IHDR | 文件头数据块 | 否 | 否 | 第一块 |
cHRM | 基色和白色点数据块 | 否 | 是 | 在PLTE和IDAT之前 |
gAMA | 图像γ数据块 | 否 | 是 | 在PLTE和IDAT之前 |
sBIT | 样本有效位数据块 | 否 | 是 | 在PLTE和IDAT之前 |
PLTE | 调色板数据块 | 否 | 是 | 在IDAT之前 |
bKGD | 背景颜色数据块 | 否 | 是 | 在PLTE之后IDAT之前 |
hIST | 图像直方图数据块 | 否 | 是 | 在PLTE之后IDAT之前 |
tRNS | 图像透明数据块 | 否 | 是 | 在PLTE之后IDAT之前 |
oFFs | (专用公共数据块) | 否 | 是 | 在IDAT之前 |
pHYs | 物理像素尺寸数据块 | 否 | 是 | 在IDAT之前 |
sCAL | (专用公共数据块) | 否 | 是 | 在IDAT之前 |
IDAT | 图像数据块 | 是 | 否 | 与其他IDAT连续 |
tIME | 图像最后修改时间数据块 | 否 | 是 | 无限制 |
tEXt | 文本信息数据块 | 是 | 是 | 无限制 |
zTXt | 压缩文本数据块 | 是 | 是 | 无限制 |
fRAc | (专用公共数据块) | 是 | 是 | 无限制 |
gIFg | (专用公共数据块) | 是 | 是 | 无限制 |
gIFt | (专用公共数据块) | 是 | 是 | 无限制 |
gIFx | (专用公共数据块) | 是 | 是 | 无限制 |
IEND | 图像结束数据 | 否 | 否 | 最后一个数据块 |
Png图片数据块列表
Png格式是由四个关键数据块和一些辅助数据块组成,四个关键数据块是必需的。有了它们就可以组成一张png图片,这四个关键数据块就是:
文件头数据块(IHDR)、调色板数据块(PLTE)、图象数据块(IDAT)、图象结束数据块(IEND)。为了使图象的背景色透明,获得更好的效果,我建议还要将tRNS这个数据块加上。原来我在手机上就用四个关键数据块合成一张图片,放到手机上背景色不透明,效果不好,加上tRNS这个数据块就背景色透明。
每个png图片的数据块的结构都是一样的。结构图如下:
名称 | 字节数 | 说明 |
Length (长度) | 4字节 | 指定数据块中数据域的长度,其长度不超过(231-1)字节 |
Chunk Type Code (数据块类型码) | 4字节 | 数据块类型码由ASCII字母(A-Z和a-z)组成 |
Chunk Data (数据块数据) | 可变长度 | 存储按照Chunk Type Code指定的数据 |
CRC (循环冗余检测) | 4字节 | 存储用来检测是否有错误的循环冗余码 |
CRC域中的值是对Chunk Type Code域和Chunk Data域中的数据进行计算得到的。
每个数据块都是由这些数据域组成的。
IHDR
文件头数据块IHDR(header chunk):它包含有PNG文件中存储的图像数据的基本信息,并要作为第一个数据块出现在PNG数据流中,而且一个PNG数据流中只能有一个文件头数据块。
对于一个PNG文件来说,png图片的标志位:
十进制数 | 137 80 78 71 13 10 26 10 |
十六进制数 | 89 50 4E 47 0D 0A 1A 0A |
文件头数据块由13字节组成,它的格式如下表所示。
域的名称 | 字节数 | 说明 |
Width | 4 bytes | 图像宽度,以像素为单位 |
Height | 4 bytes | 图像高度,以像素为单位 |
Bit depth | 1 byte | 图像深度: |
ColorType | 1 byte | 颜色类型: |
Compression method | 1 byte | 压缩方法(LZ77派生算法) |
Filter method | 1 byte | 滤波器方法 |
Interlace method | 1 byte | 隔行扫描方法: |
PLTE
调色板数据块PLTE(palette chunk)包含有与索引彩色图像(indexed-color image)相关的彩色变换数据,它仅与索引彩色图像有关。PLTE数据块是定义图像的调色板信息,PLTE可以包含1~256个调色板信息,每一个调色板信息由3个字节组成:
颜色 | 字节 | 意义 |
Red | 1 byte | 0 = 黑色, 255 = 红 |
Green | 1 byte | 0 = 黑色, 255 = 绿色 |
Blue | 1 byte | 0 = 黑色, 255 = 蓝色 |
因此,调色板的长度应该是3的倍数。
并不是所有的png格式的图片都有调色板数据块,真彩色图片可能就没有。
IDAT
图像数据块IDAT(image data chunk):它存储实际的数据,在数据流中可包含多个连续顺序的图像数据块。
IDAT存放着图像真正的数据信息,因此,如果能够了解IDAT的结构,我们就可以很方便的生成PNG图像。
IEND
图像结束数据IEND(image trailer chunk):它用来标记PNG文件或者数据流已经结束,并且必须要放在文件的尾部。
如果我们仔细观察PNG文件,我们会发现,文件的结尾12个字符看起来总应该是这样的:
00 00 00 00 49 45 4E 44 AE 42 60 82
不难明白,由于数据块结构的定义,IEND数据块的长度总是0(00 00 00 00,除非人为加入信息),数据标识总是IEND(49 45 4E 44),因此,CRC码也总是AE 42 60 82。
上面是png格式图片的四个关键数据块, 暂时分析到这。
注:收集整理自:http://www.blogjava.net/yzjcomcn/articles/4019.html
http://www.mysoo.net/blog/post/png-image-format-analysis.html