[Qt教程] 第15篇
2D绘图(五)绘制图片
发表于 2013-5-2 17:59:00 | 查看:
886| 回复: 3
绘制图片 版权声明 该文章原创于Qter开源社区(www.qter.org),作者yafeilinux,转载请注明出处! 导语 Qt提供了四个类来处理图像数据:QImage、QPixmap、QBitmap和QPicture,它们也都是常用的绘图设备。其中QImage主要用来进行I/O处理,它对I/O处理操作进行了优化,而且也可以用来直接访问和操作像素;QPixmap主要用来在屏幕上显示图像,它对在屏幕上显示图像进行了优化;QBitmap是QPixmap的子类,它是一个便捷类,用来处理颜色深度为1的图像,即只能显示黑白两种颜色;QPicture用来记录并重演QPainter命令。这一节我们只讲解QPixmap。 环境:Windows Xp + Qt 4.8.4+QtCreator 2.6.2 目录 一、简单绘制图片 二、平移图片 三、缩放图片 四、旋转图片 五、扭曲图片 正文 一、简单绘制图片 1.这次我们重新创建一个Qt Gui应用,项目名称为painter_2,在类信息页面,将基类更改为QDialog,类名使用默认的Dialog即可。 2.然后在源码目录中复制一张图片,比如这里是一张背景透明的logo.png图片,如下图所示。 3.在dialog.h文件中添加重绘事件处理函数的声明: protected: void paintEvent(QPaintEvent *); 4.到dialog.cpp文件中先添加头文件包含#include <QPainter>,然后添加函数的定义: void Dialog::paintEvent(QPaintEvent *) { QPainter painter(this); QPixmap pix; pix.load("../painter_2/logo.png"); painter.drawPixmap(0, 0, 129, 66, pix); } 这里使用了相对路径,因为Qt (注意:下面的操作涉及到了坐标系统,这里不再详细讲解,大家先进行操作查看效果,具体的坐标内容将在下一节讲解。) 二、平移图片 QPainter类中的translate()函数实现坐标原点的改变,改变原点后,此点将会成为新的原点(0,0)。下面来看一个例子。 在paintEvent()函数里面继续添加如下代码: painter.translate(100, 100); //将(100,100)设为坐标原点 painter.drawPixmap(0, 0, 129, 66, pix); 运行程序,效果如下图所示。 这里将(100,100)设置为了新的坐标原点,所以下面在(0,0)点贴图,就相当于在以前的(100,100)点贴图。 三、缩放图片 我们可以使用QPixmap类中的scaled()函数来实现图片的放大和缩小。 在paintEvent()函数中继续添加代码: qreal width qreal height //将图片的宽和高都扩大两倍,并且在给定的矩形内保持宽高的比值不变 pix = pix.scaled(width*2, height*2, Qt::KeepAspectRatio); painter.drawPixmap(70, 70,pix); 其中参数Qt::KeepAspectRatio,是图片缩放的方式。我们可以查看其帮助。将鼠标指针放到该代码上,当出现F1提示时,按下F1键,这时就可以查看其帮助了。当然我们也可以直接在帮助里查找该关键字。如下图所示。 这里有三个值,只看其图片就可大致明白,Qt::IgnoreAspectRatio是不保持图片的宽高比,Qt::KeepAspectRatio是在给定的矩形中保持宽高比,最后一个也是保持宽高比,但可能超出给定的矩形。这里给定的矩形是由我们显示图片时给定的参数决定的,例如painter.drawPixmap(0,0,100,100,pix);就是在以(0,0)点为起始点的宽和高都是100的矩形中。 运行程序效果如下图所示。 四、旋转图片 旋转使用的是QPainter类的rotate()函数,它默认是以原点为中心进行旋转的。我们要改变旋转的中心,可以使用前面讲到的translate()函数完成。 painter.translate(64, 33); //让图片的中心作为旋转的中心painter.rotate(90); //顺时针旋转90度painter.translate(-64,-33); //使原点复原painter.drawPixmap(100, 这里必须先改变旋转中心,然后再旋转,然后再将原点复原,才能达到想要的效果。 运行程序,效果如图所示。 五、扭曲图片 实现图片的扭曲,是使用的QPainter类的shear(qreal sh,qreal sv)函数完成的。它有两个参数,前面的参数实现横行变形,后面的参数实现纵向变形。当它们的值为0时,表示不扭曲。 在paintEvent()中继续添加如下代码: painter.shear(0.5, 0); //横向扭曲 painter.drawPixmap(100, 0, 129, 66, pix); 运行效果如下图所示。 结语 这一节中只讲解了QPixmap类的简单应用。对于后面讲到的图片变形的应用,细心的读者可能已经发现了,旋转了坐标系统以后再绘制图片都是纵向的,这就是因为旋转了坐标系统而没有进行恢复造成的。具体的坐标操作我们会在下一节讲解。 如果大家还想系统的学习其他绘图类的应用,可以参考《Qt 涉及到的源码: painter_2.zip (6.91 KB, 下载次数: 20) |