本文章原创于www.yafeilinux.com 转载请注明出处。

现在我们来实现在窗口上显示图片,并学习怎样将图片进行平移,缩放,旋转和扭曲。这里我们是利用QPixmap类来实现图片显示的。

一、利用QPixmap显示图片。

1.将以前的工程文件夹进行复制备份,我们这里将工程文件夹改名为painter05。(以前已经说过,经常备份工程目录,是个很好的习惯)

2.在工程文件夹的debug文件夹中新建文件夹,我这里命名为images,用来存放要用的图片。我这里放了一张linux.jpg的图片。如下图所示。

3.在Qt Creator中打开工程。(即打开工程文件夹中的.pro文件),如图。

4.将dialog.cpp文件中的paintEvent()函数更改如下。

void Dialog::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QPixmap pix;
    pix.load(“images/linux.jpg”);
    painter.drawPixmap(0,0,100,100,pix);
}

这里新建QPixmap类对象,并为其添加图片,然后在以(0,0)点开始的宽和高都为100的矩形中显示该图片。你可以改变矩形的大小,看一下效果啊。最终程序运行效果如下。

(说明:下面的操作都会和坐标有关,这里请先进行操作,我们在下一节将会讲解坐标系统。)

二、利用更改坐标原点实现平移。

Qpainter类中的translate()函数实现坐标原点的改变,改变原点后,此点将会成为新的原点(0,0);

例如:

void Dialog::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QPixmap pix;
    pix.load(“images/linux.jpg”);
    painter.drawPixmap(0,0,100,100,pix);

painter.translate(100,100); //将(100,100)设为坐标原点
    painter.drawPixmap(0,0,100,100,pix);
}

这里将(100,100)设置为了新的坐标原点,所以下面在(0,0)点贴图,就相当于在以前的(100,100)点贴图。效果如下。

三、实现图片的缩放。

我们可以使用QPixmap类中的scaled()函数来实现图片的放大和缩小。

例如:

void Dialog::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QPixmap pix;
    pix.load(“images/linux.jpg”);
    painter.drawPixmap(0,0,100,100,pix);

qreal width = pix.width(); //获得以前图片的宽和高
    qreal height = pix.height();

pix = pix.scaled(width*2,height*2,Qt::KeepAspectRatio);
    //将图片的宽和高都扩大两倍,并且在给定的矩形内保持宽高的比值
    painter.drawPixmap(100,100,pix);
}

其中参数Qt::KeepAspectRatio,是图片缩放的方式。我们可以查看其帮助。将鼠标指针放到该代码上,当出现F1提示时,按下F1键,这时就可以查看其帮助了。当然我们也可以直接在帮助里查找该代码。

这是个枚举变量,这里有三个值,只看其图片就可大致明 白,Qt::IgnoreAspectRatio是不保持图片的长宽比,Qt::KeepAspectRatio是在给定的矩形中保持长宽比,最后一个也 是保持长宽比,但可能超出给定的矩形。这里给定的矩形是由我们显示图片时给定的参数决定的,例如 painter.drawPixmap(0,0,100,100,pix);就是在以(0,0)点为起始点的宽和高都是100的矩形中。

程序运行效果如下。

四、实现图片的旋转。

旋转使用的是QPainter类的rotate()函数,它默认是以原点为中心进行旋转的。我们要改变旋转的中心,可以使用前面讲到的translate()函数完成。

例如:

void Dialog::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QPixmap pix;
    pix.load(“images/linux.jpg”);
    painter.translate(50,50); //让图片的中心作为旋转的中心
    painter.rotate(90); //顺时针旋转90度
    painter.translate(-50,-50); //使原点复原
    painter.drawPixmap(0,0,100,100,pix);
}

这里必须先改变旋转中心,然后再旋转,然后再将原点复原,才能达到想要的效果。

运行程序,效果如下。

五、实现图片的扭曲。

实现图片的扭曲,是使用的QPainter类的shear(qreal sh,qreal sv)函数完成的。它有两个参数,前面的参数实现横行变形,后面的参数实现纵向变形。当它们的值为0时,表示不扭曲。

例如:

void Dialog::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QPixmap pix;
    pix.load(“images/linux.jpg”);
    painter.drawPixmap(0,0,100,100,pix);
    painter.shear(0.5,0); //横向扭曲
    painter.drawPixmap(100,0,100,100,pix);
}

效果如下:

其他扭曲效果:

painter.shear(0,0.5); //纵向扭曲

painter.shear(0.5,0.5); //横纵扭曲

图片形状的变化,其实就是利用坐标系的变化来实现的。我们在下一节中将会讲解坐标系统。这一节中的几个函数,我们可以在其帮助文件中查看其详细解释。

http://www.cnblogs.com/hnrainll/archive/2011/05/24/2055766.html

Qt 显示图片 放大 缩小 移动(都是QT直接提供的功能)的更多相关文章

  1. 自定义mousewheel事件,实现图片放大缩小功能实现

    本文是承接 上一篇的<自定义鼠标滚动事件>  的基础上实现的,建议大家先看一下上一篇的mousewheel的实现,再浏览下文: 上篇中我们介绍到: $element.mousewheel( ...

  2. wpf下的图片放大缩小

    WPF下实现图片的放大缩小移动   在windows 7里面有自带的图片查看器,这个软件可以打开一张图片然后以鼠标在图片中的焦点为原点来进行缩放,并且放大后可以随意拖动.下面我们在WPF中实现这个功能 ...

  3. 鼠标滚轮图片放大缩小功能,使用layer弹框后不起作用

    今天在项目中遇到的一个问题:点击按钮使用layer弹框弹出一张图片,需要加一个鼠标滚轮放大缩小,图片也跟着放大缩小的功能.于是在网上找了一个demo. DEMO: <!DOCTYPE html ...

  4. javascript仿新浪微博图片放大缩小及旋转效果

    javascript仿新浪微博图片放大缩小及旋转效果 经常看到新浪微博里有图片放大缩小旋转效果,感觉效果还不错,所以就想试着做一个类似的demo出来,至于旋转对于IE可以用滤镜来解决,标准的浏览器可以 ...

  5. imageView图片放大缩小及旋转

    imageView图片放大缩小及旋转 一.简介 二.方法 1)设置图片放大缩小效果 第一步:将<ImageView>标签中的android:scaleType设置为"fitCen ...

  6. hammer使用: 代码:捏合、捏开、图片放大 的一个手机图片“放大缩小可拖动”的小效果

    hammer.js 的使用. (手机手势插件) 捏合.捏开.图片放大 的一个手机图片“放大缩小可拖动”的小效果. 相关js 到 http://www.bootcdn.cn/  查找和下载. hamme ...

  7. vue项目 一行js代码搞定点击图片放大缩小

    一行js代码搞定xue项目需要点击图片放大缩小,其实主要用的是用到了vue:class的动态切换,内容比较简单.一开始我把维护的需求想得太复杂了,和测试小姐姐聊了一下才反应过来. 两个月不到跟了四个项 ...

  8. 图片放大缩小(和ViewPager配合使用流畅显示)--第三方开源--PhotoView

    图片的放大缩小实现效果是使用的github上的一个开源项目photoView实现的,下载地址:https://github.com/chrisbanes/PhotoView 下面看测试代码: acti ...

  9. Canvas实现图片放大缩小移动操作

    对于HTML5相信大家都不陌生,很早就出来了,但是貌似都没有真正的使用过.最近做项目时要实现这样一个需求:一个图片,大小不固定,要求能实现类似地图一样放大.缩小.移动功能.这里就很合适使用html5的 ...

随机推荐

  1. (转载)HTML:模拟链接被按下,在新标签页打开页面,不使用window.open(可能被拦截)

    原文: http://www.cppblog.com/biao/archive/2010/08/21/124196.html 当按下一个按钮时,想打开一个新的标签页,可以使用window.open去实 ...

  2. HSSF,XSSF和SXSSF的区别

    HSSF是POI工程对Excel 97(-2007)文件操作的纯Java实现 XSSF是POI工程对Excel 2007 OOXML (.xlsx)文件操作的纯Java实现 从POI 3.8版本开始, ...

  3. UVALive - 6955 Finding Lines 随机算法

    题目链接: http://acm.hust.edu.cn/vjudge/contest/126968#problem/F 题意 给你n个点,问是否有>=p/100*n个点共线(p>=20& ...

  4. 线段树--Color the ball(多次染色问题)

    K - Color the ball Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u ...

  5. 【BZOJ】【3613】【HEOI2014】南园满地堆轻絮

    思路题 考试结束前5.6min的时候想到……但是写挂了QAQ 其实就是(差值最大的逆序对之差+1)/2; 找逆序对其实维护一个max直接往过扫就可以了……因为逆序对是前面的数大于后面的数…… 正确性显 ...

  6. sampleGradient(sampler,uv,dds,ddy)

    vsm里面用这个梯度采样 采放了z,z*z的shadowmap 这种采样方式和普通sample有什么区别

  7. css hack一览

    浏览器对css hack的支持情况

  8. 使用CSS3实现3D图片滑块效果

    使用 CSS3 的3D变换特性,我们可以通过让元素在三维空间中变换来实现一些新奇的效果. 这篇文章分享的这款 jQuery 立体图片滑块插件,利用了 3D transforms(变换)属性来实现多种不 ...

  9. Unity3D研究院之LZMA压缩文件与解压文件

    原地址:http://www.xuanyusong.com/archives/3095 前两天有朋友告诉我Unity的Assetbundle是LZMA压缩的,刚好今天有时间那么就研究研究LZMA.它是 ...

  10. Java日志记录的事儿

    一.java日志组件 1.common-logging common-logging是apache提供的一个通用的日志接口.用户可以自由选择第三方的日志组件作为具体实现,像log4j,或者jdk自带的 ...