There are many existing image formats. Here we focus on JPG, GIF, PNG and BMP.
A quick explanation about “color depth”. Color depth, bit depth, or pixel depth, refers to the number of bits per pixel to represent a specific color.
For 8-bit color depth, the total number of colors is 28 = 256.
for 24-bit color depth (usually 8-bit Red, 8-bit Green, 8-bit Blue), the total number of color is 224.
for 32-bit color depth (8-bit Red, 8-bit Green, 8-bit Blue, 8-bit Alpha channel), the total number of color is 224, with 8 bits representing the transparency of a color.
1. JPEG (Joint Photographic Experts Group)
JPEG doesn’t support transparency — no alpha channel.
A couple of side notes:
(1) JPEG uses lossy compression, which means encoding always causes a loss in quality.
(2) JPEG 2000 was developed by the same company as JPEG. However, they are totally different. JPEG 2000 provides both lossy and lossless compression and support transparency.
2. GIF (Graphics Interchange Format
GIF support 1-color or 1-bit transparency. While it sounds confusing, it would be easier to understand if we know how GIF stores transparency information.
There is a block called Graphics Control Extension (Started with 0x21 0xF9) which describes the chunk of image data which follows it. Inside the Graphics control extension, there is one bit called “Transparent Color flag”, and one byte which refers to “transparent color index”.
the 1-bit Transparent Color flag tells the decoder if there is transparency. Hence, either opaque or transparent, there are no values between.
The 1-byte transparent color index tells the decoder which color the transparency will be applied to.
Note that there could be a few sub-blocks of image data in one file, so there could be a few colors to be transparent, as long as they are located in different sub-blocks.
A few more to know about GIF —
(1) GIF is palette-based, which means the color used in an image have their RGB values defined in a palette table which can hold up to 256 entries. GIF uses 8-bit color depth, Which means it can use 256 colors at most.
(2) GIF uses lossless compression.
(3) GIF file format
- header: GIF87a or GIF89a
- logical screen Descriptor, which specifies the size of the image, whether a global color table presents or not.
- global color table (optional).
- sub- blocks
- graphics control extension (starting with 0x21 0xF9)
- image descriptor (starting with 0x2C).
- local color table (optional?)
- Image data
reference: http://giflib.sourceforge.net/whatsinagif/animation_and_transparency.html
3. PNG (Portable Network Graphics)
PNG supports full transparency, and PNG compression is lossless.
4. BMP (Bitmap Image file)
BMP is defined by Microsoft. It is able to use various color depths, and optionally with data compression, alpha channel and color profiles.
in BMP header,
(1) offset 1Ch tells the number of bits per pixel, it could be 1,2,4,8, 16, 24, 32.
(2)offset 1Eh tells the compression method being used. Note that this field contains more than compression method. popular values for this field:
- BI_RGB (0), means no compression.
- BI_BITFILEDS, this basically indicates RGBA, no pixel array compression used.
- BI_JPEG
- BI_PNG
(3) if BI_FITFIELDS is used, offset 36 ~ 42h are used to indicate the bit masks for each channel (R, G, B, A).
(4) offset 0x12 and 0x16 indicate the width and height of the picture, in pixels. Note that both values are signed numbers.
A few tricks
(1) If you specify RGBA format (32bit color depth, BI_FIFIELDS), but you don’t specify the bit mask for alpha channel, the decoder will discard the alpha channel value — the picture will be fully opaque ( all the alpha values in the decoded image will be shown as 255).
(2) the pixel data in the BMP files are supposed to be from left to right, and bottom to top, by default. As a result, if you write the height of the image to 0x16 and copy your raw image into a BMP file, you will see an upside-down image when you open it with a img viewer. Supply a negative height value to the offset 0x16 will help get it corrected!