The Full Wiki

APNG: Wikis

Advertisements
  
  

Note: Many of our articles have direct quotes from sources you can cite, within the Wikipedia article! This article doesn't yet, but we're working on it! See more info or our list of citable articles.

Encyclopedia

From Wikipedia, the free encyclopedia

Animated Portable Network Graphics
Animated PNG example bouncing beach ball.png
An animated PNG featuring a bouncing ball (requires recent versions of common web browsers)
Filename extension .png .apng
Type of format animated raster image format
Extended from PNG

The Animated Portable Network Graphics (APNG) file format is an unofficial extension to the Portable Network Graphics (PNG) specification. It allows for animated PNG files that work similarly to animated GIF files, while supporting 24-bit images and 8-bit transparency not available for GIFs. It also retains backward compatibility with non-animated PNG files.

The first frame of an APNG file is stored as a normal PNG stream, and so most old PNG decoders will be able to display the first frame of an APNG file. The frame speed data and extra animation frames are stored in extra chunks (as provided for by the original PNG specification).

APNG competes with Multiple-image Network Graphics (MNG), a powerful format for bitmapped animations created by the same team as PNG. APNG's advantage is the smaller library size and compatibility with older PNG implementations.

Contents

History

The APNG specification was created in 2004 by Stuart Parmenter and Vladimir Vukicevic of the Mozilla Corporation. APNG support was added to the ubiquitous libpng by a Seneca College student during the Google Summer of Code in 2006. Mozilla Firefox added support for APNG in Firefox 3 trunk builds on March 23, 2007.[1] Iceweasel 3 does not support APNG[2].

The PNG group officially rejected APNG as an official extension on April 20, 2007.[3] There have been several subsequent proposals for a simple animated graphics format based on PNG using several different approaches.[4] Among the maintainers of the PNG and MNG formats, APNG was not received well for several reasons. MNG provides all the features APNG provides, but is not supported at all by PNG-only decoders. APNG uses a technically feasible solution for storing any frames except the first, but the majority of the PNG group thinks this conflicts with the purpose of the PNG format – which is to store a single image. APNG would be compatible to this vision with alterations to its signature and intended MIME type, but these would break the desired backwards compatibility.

In 2008 WorldDMB adopted APNG as a backward compatible extension to enable animation as part of the MOT SlideShow user application for Digital Radio. "APNG 1.0 Specification - Animated Portable Network Graphics" is included as normative Annex A in the ETSI standard TS 101 499 V2.2.1 (2008-07).

Mozilla's role in extending the PNG format to APNG echoes Netscape's much earlier role in popularizing animated GIFs.

Application support

Image processing applications which support APNG:

  • KSquirrel as of version 0.7.2 (October 3, 2007)[5]
  • XnView can read but not write APNG as of version 1.92 (December 19, 2007)[6]
  • Gamani GIF Movie Gear as of version 4.2 (March 2008)[7]
  • ImageJ as of version 1.41g (July 3, 2008)[8]
  • Imagine as of version 1.0.4 (November 14, 2008)[9]

Web browsers which support APNG:

Web browsers which do not support APNG:

Technical details

A PNG file consists of the PNG Signature (8 special bytes), followed by a series of so called chunks. A chunk consists of four parts: Length (4 bytes), Chunk type (4 bytes), Chunk data (length bytes) and CRC (Cyclic Redundancy Code / Checksum, 4 bytes).

Structure of a single PNG chunk
Length
(4 bytes)
Chunk type
(4 bytes)
Chunk data
(length bytes)
CRC
(4 bytes)

There are about 20 different chunk types, but for a minimal PNG, only 3 are required: The IHDR (image header) chunk, one or more IDAT (image data) chunks and the IEND (image end) chunk.

Structure of a very simple PNG file
89 50 4E 47 0D 0A 1A 0A
PNG signature
IHDR
Image header
IDAT
Image data
IEND
Image end

The next graphic shows the contents of such a minimal PNG file, representing just one red pixel. The PNG signature bytes and the individual chunks are marked with colors. On the left side, the byte values are shown in hex format, on the right side in the ANSI charset. This dual display is common for hex editors. Note that the chunks are easy to identify because of their human readable 4-byte type names (in this example IHDR, IDAT & IEND).

Hex ANSI

89 50 4E 47 0D 0A 1A 0A 00 00 00 0D 49 48 44 52
00 00 00 01 00 00 00 01 08 02 00 00 00 90 77 53
DE 00 00 00 0E 49 44 41 54 78 DA 62 F8 CF C0 00
10 60 00 03 01 01 00 66 FD 9F 24 00 00 00 00 49
45 4E 44 AE 42 60 82

.PNG........IHDR
..............wS
Þ....IDATxÚbøÏÀ.
.`.....fý.$....I
END®B`.

The APNG specification introduces three new chunks: The animation control chunk (acTL), the frame control chunk (fcTL) and the frame data chunk (fdAT). The animation control chunk is a kind of "marker" chunk, telling the parser that this is an animated png. It contains information about how many frames the animation consists of and how many times the animation should play before coming to rest. The frame control chunk contains several bits of information, the most important of which is the display time of the following frame. The frame data chunks have the same structure as the IDAT chunks, except preceded by a sequence number. Sequence numbers apply to both frame control and frame data chunks, which together follow a common sequence, thus enabling the order and timing of frames to be recovered[14] should an APNG-unaware PNG editor re-order them as allowed by PNG chunk ordering rules[15].

A program wanting to assemble several individual PNG files to an animated PNG could proceed as follows:

  1. Take all chunks of the first PNG file as a building basis.
  2. Insert an animation control chunk (acTL) after the image header chunk (IHDR).
  3. If the first PNG is to be part of the animation, insert a frame control chunk (fcTL) before the image data chunk (IDAT).
  4. For each of the remaining frames, add a frame control chunk (fcTL) and a frame data chunk (fdAT) before the image end chunk (IEND). The content for the frame data chunks (fdAT) is taken from the image data chunks (IDAT) of their respective source images.

The next diagram illustrates this process.

Diagram illustrating a possible way to assemble an animated png from 3 individual PNG files

The PNG specification was designed with future extensions in mind. An application reading a PNG file is supposed to simply ignore any chunks which it does not understand. This is the reason why APNG is "backwards compatible". Existing applications just recognize the first frame and ignore the additional animation chunks.

Alternatives

The MNG file format is a more powerful alternative to APNG, although is a more complex format and has less web browser support.

The GIF file format has better application and browser support than APNG, but it is limited to 256 colors per frame and provides only up to 1 bit alpha transparency.

Vector images such as SVG are sometimes a possibility to provide an animation.

An alternative method for animations in web pages is to use conventional static images and animate them using JavaScript [16], Adobe Flash, Java or other plugin based technologies.

References

  1. ^ "Gran Paradiso Alpha 3 release notes". Mozilla. 2007-03-23. http://www.mozilla.org/projects/firefox/3.0a3/releasenotes/.  
  2. ^ "Debian Bug #486209 iceweasel APNG support". Debian. 2008-06-26. http://bugs.debian.org/cgi-bin/bugreport.cgi?bug=486209.  
  3. ^ "VOTE FAILED: APNG 20070405a". SourceForge. 2007-04-20. http://sourceforge.net/mailarchive/message.php?msg_name=3.0.6.32.20070420132821.012dd8e8%40mail.comcast.net.  
  4. ^ "Discussion for a simple "animated" PNG format". Archived from the original on 2007-11-16. http://web.archive.org/web/20071116150840/http://gjuyn.xs4all.nl/pnganim.html. Retrieved 2009-04-28.  
  5. ^ "ksquirrel Changelog Sektion: ksquirrel-0.7.2". SourceForge. http://ksquirrel.sourceforge.net/changelog.php. Retrieved 2009-05-23.  
  6. ^ While XnView is available for several operating systems, only versions for Windows have been released since APNG support was added.
  7. ^ "Animated PNG: Simple Animation with an Alpha Channel". Gamani. http://www.gamani.com/apng.htm. Retrieved 2009-08-25.  
  8. ^ "ImageJ News". ImageJ. http://rsb.info.nih.gov/ij/notes.html. Retrieved 2009-05-23.  
  9. ^ "Imagine - What's new". http://nyam.pe.kr/dev/imagine/doc/Whatsnew.txt. Retrieved 2009-08-25.  
  10. ^ "Animated PNG graphics". Mozilla. 4 Jul 2008. https://developer.mozilla.org/en/Animated_PNG_graphics. Retrieved 2009-05-23.  
  11. ^ "Firefox 3 for developers". Mozilla. 1 Oct 2008. https://developer.mozilla.org/en/Firefox_3_for_developers. Retrieved 2009-05-23.  
  12. ^ "Opera 9.5 for Windows Changelog". Opera Software. http://www.opera.com/docs/changelogs/windows/950/. Retrieved 2009-05-23.  
  13. ^ "Windows Internet Explorer 8 Expert Zone Chat (June 18, 2009)". Microsoft. http://www.microsoft.com/windowsxp/expertzone/chats/transcripts/09_0618_ez_ie8.mspx. Retrieved 2009-08-24.  
  14. ^ Chunk Sequence Numbers (APNG spec)
  15. ^ Chunk Ordering Rules (PNG 1.2 spec)
  16. ^ "AniPNG Demonstration". 2008-12-08. http://blenheimears.com/anipng_demo/.  

External links

Advertisements

Advertisements






Got something to say? Make a comment.
Your name
Your email address
Message