引言

用Qt程序在手机上显示一幅图片对编程人员来说是再基础不过的一件事情了。那么先让大家看两段代码:

//dangerous should not be used, cannot display earth.png,  //but if we change earth.png to a smaller image e.g. apple.png, apple.png can be displayed QPixmap pixmap; pixmap.load( ":/pics/earth.png" ); label->setPixmap( pixmap );

//dangerous should not be used, cannot display earth.png,  //but if we change earth.png to a smaller image e.g. apple.png, apple.png can be displayed QPixmap pixmap; pixmap.load( ":/pics/earth.png" ); QPainter painter(this); painter.drawPixmap(0,0, pixmap);

大家认为这两段代码有什么问题吗? 
看起来好像没什么问题啊。是的,在Windows操作系统上是没有问题的。问题是我们做的是Qt for Symbian! 手机上的资源本来就是比较紧缺的,所以我们使用的时候就需要更加注意。 Qt 为我们提供了四个处理图像的类:QImageQPixmapQBitmap 和QPicture。其中前两个是最常使用的。

本文就通过一个例子,一步一步为大家讲解QImage与QPixmap的使用奥秘,在此过程中为大家揭示以上代码存在的缺陷。本文所用例子程序可通过本文末尾所附链接下载。

QPixmap依赖于硬件

首先需要知道的是QPixmap的具体实现是依赖于系统的。在Symbian系统上QPixmap是被存放在Server端的。

目前的Qt会把QPixmap都存储在graphics memory中,这明显是依赖硬件的。因此我们对QPixmap的使用需要格外注意。这也正是以上两段代码存在问题的根源。
那么Qt为什么要这么做呢?很简单,设计之初QPixmap就是用来加速显示的,例如我们在paint的时候用QPixmap就会比用其他类的效果好许多。

现在回到我们最初的问题,以上代码到底有什么问题呢?我们可以先用本文提供的例子程序做个试验。当使用上述代码显示较小图片的时候(比如例子程序中的background.png 和apple.png)是没有问题的,图片都能在手机上正确显示。
但是当我们把图片换成一副较大图片287KB,1058 x 1058的“earth.png”的时候就出现问题了,图片无法显示,程序的界面是一片空白。

据测算,“earth.png”被完全解码后存储在graphics memory中会占用大约4.3MB的空间。如果此时还有其他加载的窗口和QPixmap,很可能就没有空间了。

使用QImage加载后转换成QPixmap 显示

那么安全和正确的方法应该是什么呢?答案是我们需要用QImage做一下预处理:

//correct and recommended way QImage image; image.load( ":/pics/earth.png" );   QPainter painter(this); QPixmap pixmapToShow = QPixmap::fromImage( image.scaled(size(), Qt::KeepAspectRatio) ); painter.drawPixmap(0,0, pixmapToShow);

和QPixmap 不同,QImage是独立于硬件的,它可以同时被另一个线程访问。QImage是存储在客户端的,对QImage的使用是非常方便和安全的。 又由于 QImage 也是一种QPaintDevice,因此我们可以在另一个线程中对其进行绘制,而不需要在GUI 线程中处理,使用这一方式可以很大幅度提高UI响应速度。 
因此当图片较大时,我们可以先通过QImage将图片加载进来,然后把图片缩放成需要的尺寸,最后转换成QPixmap 进行显示。 下图是显示效果(图片是按照earth.png的原始尺寸比例缩放后显示的):

其中需要注意的是Qt::KeepAspectRatio的使用,默认参数是Qt::IgnoreAspectRatio,如果我们在程序中这么写:

QPixmap pixmapToShow = QPixmap::fromImage( image.scaled(size(), Qt::IgnoreAspectRatio) );

效果就是下面这个样子,earth.png被拉伸以充满整个屏幕:

直接使用QImage 显示

我们也可以直接使用QImage做显示,而不转换成QPixmap ,这要根据我们应用的具体需求来决定,如果需要的话我们可以这么写:

//correct, some times may be needed QImage image; image.load( ":/pics/earth.png" );   QPainter painter(this); painter.drawImage(0,0, image);

下面是显示效果(当然我们也可以对其进行缩放之后再显示)
从图片可以看出来它是按照原始尺寸显示earth.png的:

测试设备

本代码已通过在N97和N8上的测试。

本文转载自:http://developer.nokia.com/community/wiki/%E5%A6%82%E4%BD%95%E6%AD%A3%E7%A1%AE%E5%9C%B0%E5%9C%A8%E6%89%8B%E6%9C%BA%E4%B8%8A%E6%98%BE%E7%A4%BA%E5%9B%BE%E7%89%87%E2%80%94%E2%80%94QImage%E4%B8%8EQPixmap%E5%AE%8C%E5%85%A8%E8%A7%A3%E6%9E%90

此外,关于Qt绘图,还可以借鉴这篇文章:http://www.360doc.com/content/12/0717/14/1291795_224728691.shtml

http://blog.csdn.net/jan5_reyn/article/details/38959519

如何正确地在手机上显示图片——QImage与QPixmap完全解析的更多相关文章

  1. transform:rotate在手机上显示有锯齿的解决方案

    transform:rotate 属于简单好用的效果,但在手机上显示时,会有比较明显锯齿. 解决方案也很简单, 利用外层容器的overflow:hidden 加上图片margin:-1px 就可以解决 ...

  2. QImage与QPixmap完全解析

    转载自http://www.civilnet.cn/bbs/browse.php?topicno=4691 用Qt程序在手机上显示一幅图片对编程人员来说是再基础不过的一件事情了.那么先让大家看两段代码 ...

  3. IE浏览器中图片路径正确< img ... />标签不显示图片

    如下图所示,下面的html要去加载上面的jpg图片: 代码如下: <img src="luzhanshi1.jpg" alt="图片加载失败"> 使 ...

  4. Android 代码中文字在手机上显示乱码问题解决方法

    在学习Android过程中,用于测试时发现,代码中的中文在真机上会显示乱码, 网上查阅了些资料,参考如下: http://www.androidchina.net/3024.html http://b ...

  5. .Net语言 APP开发平台——Smobiler学习日志:如何在手机上显示类似EXCEL表格

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 样式一 一.目标样式 我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的&qu ...

  6. transform:rotate在手机上显示有锯齿的解决方案大全

    先来个兼容性说明,洗洗脑: div{transform:rotate(7deg);-ms-transform:rotate(7deg); /* IE 9 */-moz-transform:rotate ...

  7. Web页面在手机上显示过大问题

    网上抄来了,自己也备忘下:增加<meta name="viewport" content="width=device-width, initial-scale=1. ...

  8. pyqt pyside QLabel 显示图片

    pyqt pyside QLabel 显示图片 pixmap = QtGui.QPixmap("D:/myPicture.jpg") label.setPixmap(pixmap) ...

  9. InteractiveHtmlBom 在手机上无法显示 BOM List 和装配图的问题

    InteractiveHtmlBom 在手机上无法显示 BOM List 和装配图的问题 InteractiveHtmlBom 插件是一款用于 KiCad BOM 装配图生成插件. 最近新生成的 文件 ...

随机推荐

  1. Android布局_LinearLayout布局

    一.LinearLayout 布局,类似于一个盒子 1. 主要属性有: (1)android:orientation 设置LinearLayout容器布局组件的方式:要么按行要么按列.只能取值:hor ...

  2. Android 之窗口小部件高级篇--App Widget 之 RemoteViews - 跨到对岸去

    在之前的一篇博文( Android 之窗口小部件详解--App Widge t)中,已经介绍了App Widget的基本用法和简单实例.这篇主要讲解 App Widget 的高级内容,即通过 Remo ...

  3. hdu 4612 Warm up 双连通缩点+树的直径

    首先双连通缩点建立新图(顺带求原图的总的桥数,事实上因为原图是一个强连通图,所以桥就等于缩点后的边) 此时得到的图类似树结构,对于新图求一次直径,也就是最长链. 我们新建的边就一定是连接这条最长链的首 ...

  4. linux之线程之互斥

    线程概述: 其实在Linux中,新建的线程并不是在原先的进程中,而是系统通过一个系统调用clone().该系统copy了一个和原先进程完全一样的进程,并在这 个进程中执行线程函数.不过这个copy过程 ...

  5. 10条影响CSS渲染速度的写法与建议

    1.*{} #zishu *{} 尽量避开由于不同浏览器对HTML标签的解释有差异,所以最终的网页效果在不同的浏览器中可能是不一样的,为了消除这方面的风险,设计者通常会在CSS的一个始就把所有标签的默 ...

  6. windows hook (转)

    http://blog.csdn.net/friendan/article/details/12226201 原文地址:http://blog.sina.com.cn/s/blog_628821950 ...

  7. .net 更改时间格式

    /// <summary> /// 更改时间格式[HH:mm:ss]到[HHmmss] /// </summary> /// <param name="inpu ...

  8. java 简单的词法分析

    package com.seakt.example; import java.io.*; import java.lang.String; public class J_Scanner { publi ...

  9. IOS 警告框 (UIAlertView)的使用方法

    1.普通警告框 IOS的SDK中提供了一个方便的类库UIAlertView,配合着不同参数来使用此类可以做出大多数的警告框,如下代码是IOS最简单的警告框. UIAlertView *alert = ...

  10. IOS 学习笔记(6) 控件 文本域(UITextField)的使用方法

    UITextField控件的诸多特性都和UITextView相似,比如成为输入文本焦点时键盘自动显示,支持长按弹出动作选项,能够接收输入事件(开始输入,修改内容,结束输入和点击回车等). 1.特有的特 ...