基于Qt的QPixmap和Qimage实现无锯齿圆角图片设置

简述

开发环境：Window10，Qt 5.9.9 ，mingw32

近期做的用来展示图片的软件，涉及到使用QLabel控件和QPixmap类来显示圆角图片。

查了一些资料，发现实现的基本步骤是：

1.读取图片。通过Qt中的QImage或Qpixmap类，读取图片路径。

2.处理图片。结合QPainter类（画笔类），绘制遮罩（QBitmap Mask）和形状（QRect）。

3.绘制图片。使用setPixmap();对label进行设置图片。

最后花费了一些时间参考和学习整理了一下。但因为是从项目中整理出来的，所以其中包含了一些相关的代码片段，比如截取图片中心区域的实现代码。可能会有些多余，也可能能拓展思路，请在理解其中含义后，酌情使用。

最后，感谢各位大佬分享的开发经验，愿与君同行，无限进步。

---

代码实现

在头文件中，记得包含使用到的类：

//包含使用的类
#include <QPixmap>
#include <QImageReader>
#include <QImage>

步骤1：读取图片（单独使用一个函数，如void ReaderPic(picPath)）

//读取图片
QImageReader imageReader;//QimageReader图片预读取类，大批量读取图片时有高效
imageReader.setDecideFormatFromContent(true); //通过文件实际内容格式读取文件
imageReader.setFileName(picPath);//通过图片路径读取图片，picPath为图片绝对路径
QSize imageSize = imageReader.size();//获取图片实际的大小（Width,heigeht）
QSize targetSize;//最后要设置的图片大小
QImage image;//正方形的截图
QImage saveimage;//正方形的截图
int itemPicSize = 85;//图片边长，设置为正方形

//截取图片的中心区域
bool isHeight = imageReader.size().width() < imageReader.size().height();
if(isHeight)
{//如果是竖图，就让宽度固定
   targetSize = QSize(itemPicSize, (itemPicSize*imageSize.height())/imageSize.width());
   imageReader.setScaledSize(targetSize);//对缩放后的图片进行截取
   //直接读取图片
   image = imageReader.read();
   //竖图时，正方形截取图片的左上角的顶边长度
   int picLeftside = (targetSize.height()- targetSize.width()) / 2;
   //从原图中复制出正方形的图片中心区域
   saveImage = image.copy(0,picLeftside,targetSize.width(),targetSize.width());
}
else
{//如果是横图，让高度固定
    targetSize = QSize((imageSize.width()*itemPicSize)/imageSize.height(),itemPicSize);
    imageReader.setScaledSize(targetSize);//对缩放后的图片进行截取
    //直接读取图片
    image = imageReader.read();
    //横图时，正方形截取图片的左上角的左边长度
    int picTopside = (targetSize.width() - targetSize.height()) / 2;
    qDebug()<<"【数据输出测试】---当前Topside的大小："<<picTopside;
    saveImage = image.copy(picTopside,0,targetSize.height(),targetSize.height());
}
//输出已裁剪为正方形的图片
saveImage.save(QString("D:/PicTest.png"));

 截取图片的中心区域

步骤2：处理图片（设置圆角矩形）

 //以上获取了saveImage的图形数据，在将其设置为pixmap
qreal dpi =devicePixelRatioF();//以浮点数形式返回设备的设备像素比。
int itemPicSize = 85;//图片边长

//将Qimage图片转化为QPixmap
QPixmap pixmap = QPixmap::fromImage(image);
//将图片大小乘以显示设备的像素比
QSize realSize = QSize(pixmap.width() * dpi, pixmap.height() * dpi);

//新建一个大小为目标图片大小的背景板
QPixmap resultPixmap(realSize);
//设置透明的颜色,表示RGBA值为 (0,0,0,0)的透明色
resultPixmap.fill(Qt::transparent);

//以QPixmap 为绘画背景进行画笔绘制
QPainter painter(&resultPixmap);
painter.setRenderHints(QPainter::Antialiasing);//抗锯齿
painter.setRenderHints(QPainter::SmoothPixmapTransform);//平滑像素图变换

QPainterPath path;//绘制路径
//绘制圆角矩形，其中最后两个参数值的范围为（0-99），就是圆角的px值
path.addRoundedRect(0, 0, itemPicSize, itemPicSize, 10, 10);

//将绘制的圆角矩形路径中内容进行切片
painter.setClipPath(path);
//将切片绘制到resultPixmap中，IgnoreAspectRatio忽视图片比例
painter.drawPixmap(0, 0, itemPicSize, itemPicSize, pixmap.scaled(realSize, Qt::IgnoreAspectRatio, Qt::SmoothTransformation));

resultPixmap.setDevicePixelRatio(dpi);//设置设备像素比

步骤3：设置图片（对label设置）

//对相应的标签设置Qpixmap
ui->label->setPixmap(resultPixmap);

最后的结果如图所示：