2.3 案例3 加点料-增加一张图片

news/2024/11/9 4:59:21/

本案例对应的源代码目录:src/chapter02/ks02_03。程序运行效果见图2-21。

图2-21 案例3运行效果

既然要进行界面编程,自然离不开图片。如果认为在按钮上使用文字太枯燥了,那么使用图标是不是会更好呢?本节讨论一下如何在Qt项目中使用图片。

既然要用图片,自然离不开图片文件啦。那么图片在哪里找呢?百度!相信是很多人的第一反应。但是,从网上找到的图片在用Qt进行加载时可能会失败(原因待查,未深究),而且可能导致版权问题。所以,从网上找图片的办法不太靠谱。有规模的软件公司一般都会请专业美工来制作图片,而且这样也不会有版权问题啦。

那么把图片(大象)放到项目(冰箱)中一共分几步呢?就像某著名演员说的,一共分3步。

(1)把图片放到images目录(打开冰箱门)。

(2)将图片文件名添加到xxx.qrc文件,并将qrc文件添加到pro(把大象放进去)。

(3)在界面、代码中引用图片(把冰箱门关上)。

下面详细介绍一下开发过程。

1.把图片放到images目录

拿到需要的图片后,把它放到images目录,这个目录是项目的子目录。如果项目的代码目录为ks02_03,那么就在ks02_03目录下面建立子目录images,并将图片放入该目录。

    ks02_03目录

        --- images(图片子目录)

        ---源代码1.cpp

        ---源代码2.cpp     

2.将图片文件名添加到xxx.qrc文件,并将qrc文件添加到pro

qrc文件是Qt的资源描述文件,可以把用到的图片在该文件中进行描述。现在看一下qrc文件的格式(见代码清单2-11)。

代码清单2-11

// ks02_03.qrc

<!DOCTYPE RCC>

<RCC version="1.0">

<qresource>

    <file>images/logo_text.png</file>                                                

</qresource>

</RCC>

代码清单2-11中标号①处的<file>这一行的内容被用来描述项目中用到的图片。如果还有别的图片,可以再写一行,只要把logo_text.png换成对应的文件名即可。另外,请注意使用相对路径:

images/logo_text.png

images是项目的子目录,在images前面无须写其他内容。然后,将ks02_03.qrc添加到项目,只需要在pro文件加一行:

RESOURCES += ks02_03.qrc

3.在界面、代码中引用图片

如果为文本控件(QLabel)设置一个图片,可以在Designer中单击该文本控件并在属性窗中为它设置图片,方法是:修改属性窗中的pixmap属性,并设置成事先准备好的图片。选择图片时,请用编辑框右侧的…按钮。

如果在代码中为QLabel设置图片,可以写成:

ui.label->setPixmap(QPixmap(":/images/qt.png"));

注意:描述图片文件路径时,使用的是“:/images/qt.png”,不要漏掉路径开头的冒号。

最后给应用程序加上控制菜单图标。方法很简单,首先准备一个图标文件my.ico,将其放到images目录。然后,修改pro文件:

RC_ICONS = images/my.ico

OK,把程序构建一下并运行起来吧。

本案例介绍了向项目中添加图片的方法和过程,现在总结一下要点:

(1)需要图片时,尽量请专业美工制作。避免使用网上的图片,因为有些图片可能无法被Qt识别而且可能存在版权问题。

(2)将图片添加到项目一共分三步:

  1. 第一步,将图片放到images子目录。
  2. 第二步,将图片文件名添加到qrc文件并将qrc文件添加到pro。
  3. 第三步,在界面(UI文件)或代码中引用图片。

(3)为项目添加控制菜单图标的方法是在pro文件中设置RC_ICONS配置项。

(4)在代码中描述图片文件路径时,写成:

ui.label->setPixmap(QPixmap(":/images/qt.png"));

《Qt 5/PyQt 5实战指南》目录

 


http://www.ppmy.cn/news/583709.html

相关文章

微信缓存dat怎么转图片_PC微信dat如何转图片?方式方法

微信dat转码软件使用操作说明在线解码,各位同学下载软件后&#xff0c;如何操作?如何找到dat文件?如何使用?又有哪些注意事项呢?这里会为大家一一道来。问题1 &#xff1a;如果下载失败怎么办?请先检查网络&#xff0c;软件并没有放在我的网站上&#xff0c;而是放在大厂七…

html5无法处理像素点导致图片花了,教你使用Canvas处理图片的方法

Canvas&#xff0c;中文译为“画布”&#xff0c;HTML5中新增了元素&#xff0c;可以结合JavaScript动态地在画布中绘制图形。 今天&#xff0c;我们不讲Canvas的图形绘制&#xff0c;而是讲如何对图片进行处理。 大概流程非常简单&#xff0c;主要分为以下三个步骤&#xff1a…

计算机教室英语手抄报图片,英语手抄报图片四年级

英语手抄报图片四年级 四年级的小朋友们&#xff0c;下面是有关四年级上册英语单词表图片手抄报内容知识&#xff0c;欢迎大家阅读与了解。 小学四年级上册英语单词表&#xff1a;Unit 1 My Classroom window 窗户  board 写字板  light 灯;管灯  picture 画;图画 door 门…

Java大象进冰箱线程_把大象装进冰箱:HTTP传输大文件的方法

上次我们谈到了HTTP报文里的div&#xff0c;知道了HTTP可以传输很多种类的数据&#xff0c;不仅是文本&#xff0c;也能传输图片&#xff0c;音频和视频。 早期互联网上传输的基本上都是只有几k大小的文本和小图片&#xff0c;现在的情况则大有不同。网页里包含的信息实在太多了…

微信小程序上传图片到html,微信小程序-上传图片

在做小冰箱这个项目时&#xff0c;对物品的图片需要有一个上传功能。今天在这里讲一下这个功能是如何实现的。 首先讲述一下这个功能的完整描述&#xff1a;有一个上传图片的按钮&#xff0c;点击按钮&#xff0c;弹出操作菜单&#xff1a;从手机相册选择&#xff0c;拍照。点击…

java html转图片格式_java把html转成图片的方法

代码 1.1 html模版 static String HtmlTemplateStr = " "body {background-color: yellow}"+ "h1 {background-color: #00ff00}"+ "h2 {background-color: transparent}"+ "p {background-color: rgb(250,0,255)}"+ "p.no2 …

java canvas 打开图片_一步步教你利用Canvas对图片进行处理

前言 Canvas,中文译为“画布”,HTML5中新增了元素,可以结合JavaScript动态地在画布中绘制图形。 今天,我们不讲Canvas的图形绘制,而是讲如何对图片进行处理,话不多说了,来一起看看详细的介绍吧。 大概流程非常简单,主要分为以下三个步骤: Canvas图片处理 是的,就像把…

js将图片上传服务器文件夹下,Egg.js 实现向服务器上传图片

1.安装时间处理 及 压缩 模块 yarn add silly-datetime pump 2.文件保存路径 config/config.default.js config.uploadDir = app/public/avatar/upload; 3.创建tools service app/service/tools.js use strict; const Service = require(egg).Service; const path = require(&q…