在Qt中显示gif动画中会有锯齿,为了解决在换肤过程中的显示效果,一般采用不同皮肤下,加载不同的gif动画(锯齿的地方用背景色填充),这是一种做法。
最近发现APNG也可以解决动画周边锯齿的问题。
APNG
APNG又叫动态PNG(Animated PNG),第1帧为标准PNG图像,剩余的动画和帧速等数据放在PNG扩展数据块里,因此只支持原版PNG的软件会正确显示第1帧。
关于APNG的基本使用,可以参考雨田哥的APNG在QT中的使用(一)
Qt中支持APNG,是以第三方插件的形式(源码编译,静态库或者动态库都可以)。
下载和配置
下载地址:
https://install.skycoder42.de/qtmodules/
选择系统,以下以windows10为例,Qt5.14.1为例。
https://install.skycoder42.de/qtmodules/windows_x86/
点进去:
下载体积最大的。
在plugins目录中,有个qapng.dll,将它放到D:\Qt\Qt5.14.1\5.14.1\mingw73_64\plugins\imageformats
(类似这样的目录中,要对应起来)。
使用举例:
#include <QMovie>
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
ui->label_image_apng->setPixmap(QPixmap(QStringLiteral(":/data/sample.apng")));
ui->label_image_png->setPixmap(QPixmap(QStringLiteral(":/data/sample.png"), "apng"));
auto m1 = new QMovie(QStringLiteral(":/data/sample.apng"), "apng", this);
m1->start();
ui->label_movie_apng->setMovie(m1);
auto m2 = new QMovie(QStringLiteral(":/data/sample.png"), "apng", this);
m2->start();
ui->label_movie_png->setMovie(m2);
}
以下是该demo的显示apng动画的效果(无锯齿)
手动编译
从github上下载:
https://github.com/Skycoder42/QtApng
打开最外层的pro文件:
像编译我们使用的Qt工程一样,生成qapng.dll,和debug版本的qapng.dll.debug(我用的是mingw73_x64,改名成qapngd.dll即可,vs的不用改名)
将编译好的dll放到对应的plugins\imageformats目录中。
非常简单,不用自己去手动打apng的补丁什么的,这个github仓库的作者已经做了这些事情,我们只需要将pro用Qt打开,选择编译器,debug还是release,进行编译就行了。