Apng动画介绍

作者: 湘北南 | 来源:发表于2016-11-26 17:00 被阅读261次

    Apng

    Apng是png格式的扩展,支持动图,并且添加了对24比特图片和8比特alpha通道的支持,而gif动图是不支持alpha通道的。

    1. Apng的整体结构

    Apng的文件后缀名是.png,一张Apng图片包含一系列的png帧,每个png帧又包含当前png的相关信息,其结构图(图片来自维基百科,请点击查看)如下:

    **Apng结构图**
    以下对上面的结构图进行说明:
    1)Apng的IHDR(Image Head Chunk)用来包含Apng图片的宽、高等信息,acTL(Animation Control Chunk)包含动画播放的控制信息。
    2)每一帧的fcTL(Frame Control Chunk)包含帧的一些控制信息,如Apng总的帧数,循环播放的次数,fdAT(Frame Data Chunk)包含每帧的图片数据信息,这跟png图片的IDAT块格式保持一致。
    3)Apng的第一帧比较特殊,如果Apng的第一帧作为Apng默认显示的图片,则Apng结构跟上图的保持一致。如果Apng的第一帧不作为默认显示的图片,则Apng的默认显示图片从IDAT块取得,而Apng的结构图如下:
    **Apng结构图(第一帧非默认图)**
    Apng与正常的png数据结构差不多是一样的,只不过是多了三个chunk类型,分别是:acTL(Animation Control Chunk)fdAT(Frame Data Chunk)fcTL(Frame Control Chunk),下面分别对这三种chunk类型做具体说明。

    2. acTL

    acTL是Apng的动画控制Chunk,包含总的帧数num_frames,播放次数num_plays,num_frames和num_plays都占有4个字节,结构如下:

    byte    含义 
    0    num_frames:0~3字节表示该Apng总的播放帧数。
    4    num_plays:4~7字节表示该Apng循环播放的次数。
    

    num_frames一定大于等于1,如果等于1,表示Apng只有一帧,可以看成就是一张png图。
    num_plays一定大于等于0,如果等于0,表示Apng动画是循环播放的。
    备注:acTL一定是在IDAT前面。

    3. fdAT

    fdAT是每帧的数据Chunk,与png的IDAT结构保持一致,只是额外增加了一个序列号,fdAT的结构如下:

    byte    含义 
    0    sequence_number:0~3字节表示动画帧的编号,从0开始。
    4    frame_data :帧的数据信息。
    

    这里需要说明的是,Apng的每一帧至少包含一个fdAT,而每一个fdAT是一张png的像素压缩数据,从该fdAT中,我们可以读取数据获得一张png图片。

    4. fcTL

    fcTL是每帧的控制信息块,fcTL一定是出现在fdAT或者IDAT的前面(第一帧为默认图片),fcTL的结构如下:

    byte    含义 
    0    sequence_number:控制帧的序号,从0开始。
    4    width:帧的宽度。
    8    height:帧的高度。
    12    x_offset:在x方向的偏移。 
    16    y_offset:在y方向的偏移。 
    20    delay_num:帧动画时间间隙的分子 
    22    delay_den:帧动画时间间隙的分母
    24    dispose_op:在显示该帧之前,需要对前面缓冲输出区域做何种处理。
    25    blend_op:具体显示该帧的方式。
    

    下面对fcTL控制块包含的内容做具体说明:
    1) x_offset,y_offset表示显示当前帧时,x方向和y方向需要偏移的距离,如果第一帧为默认显示图片,则x_offset,y_offset为0。
    2)width、height、x_offset、y_offset、Apng的宽高(包含在IHDR块中)之间存在下面的约束条件:

    x_offset >= 0
    y_offset >= 0
    width > 0
    height > 0
    x_offset + width<= IHDR width
    y_offset + height <= IHDR height 
    

    3) Apng动画每帧的显示时长可以通过delay_num * DELAY_FACTOR / delay_den来获得,时间单位是ms,其中DELAY_FACTOR是一个常量,为1000,下面对delay_num、delay_den为0的情况做下说明。
    delay_num = 0 :得到帧动画时间间隙为0,当前帧播放完了,立即播放下一帧。
    delay_den = 0:delay_den为0,默认把其当做100来计算帧动画时间间隙,计算公式是:delay_num * DELAY_FACTOR / 100
    4) dispose_op有三种类型,如下:

    value    含义 
    0       APNG_DISPOSE_OP_NONE:不做任何处理。
    1       APNG_DISPOSE_OP_BACKGROUND:前一帧的x方向的偏移、y方向的偏移和当前帧的宽、高做一个剪裁,并将剪裁的区域抠成全黑色透明。
    2       APNG_DISPOSE_OP_PREVIOUS:将当前缓冲输出区域恢复到先前的内容区域。
    

    5)blend_op有两种类型,如下:

    value    含义 
    0       APNG_BLEND_OP_SOURCE:通过dispose处理后得到的bitmap,在该bitmap对当前帧的x方向的偏移、y方向的偏移和当前帧的宽、高做一个剪裁,并将剪裁的区域抠成全黑色透明,最后将当前帧写到该剪裁区域上。
    1       APNG_BLEND_OP_OVER:当前帧覆盖到当前的缓冲区域并显示。
    

    5. 总结

    以上只是对Apng的结构做了些简要说明,Apng的具体结构可以参见APNG Specification。在介绍完Apng的结构后,后续会介绍Apng的解析和播放。

    相关文章

      网友评论

      本文标题:Apng动画介绍

      本文链接:https://www.haomeiwen.com/subject/dpamuttx.html