【Qt】常用控件（三）window frame窗口框架，QWidget的windowTitle，windowIcon属性，qrc机制

小编个人主页详情—请点击小编个人gitee代码仓库—请点击Qt系列专栏—请点击倘若命中无此运孤身亦可登昆仑送给屏幕面前的读者朋友们和小编自己!目录前言一、window frame窗口框架二、QWidget的windowTitle属性三、QWidget的windowIcon属性四、qrc机制qrc机制的引入qrc机制的讲解qrc机制的使用总结前言【Qt】常用控件二QWidget的geometry属性geometrysetGeometry——书接上文 详情请点击——本文由小编为大家介绍——【Qt】常用控件三WindowFrameQWidget的windowTitlewindowIcon属性qrc机制一、window frame窗口框架默认window frame窗口框架是操作系统自带的并且程序运行会自动生成的它的影响主要体现在会在我们原有的GUI程序的基础上添加如上图的上方黑色框以及周围的红色框那么我们原有的GUI程序仅仅有一个上图的下方的黑色框的Widget窗口在这个Widget窗口内有一个按钮QPushButton这个按钮QPushButton的父元素窗口就是Widget需要预先了解第八点Qt坐标系的认识详情请点击—— 默认情况下我们运行的程序是带有window frame窗口框架的所以此时如果按钮QPushButton想要找到原点那么就是父元素Widget本体的界面内的左上角即此时上图的蓝色圆圈就是按钮QPushButton的原点那么如果我们通过一些手段隐藏window frame窗口框架那么此时如果按钮QPushButton想要找到原点那么就是上图window frame本体左上角绿色的圆圈就是按钮QPushButton的原点在Qt中有关位置尺寸提供了很多的API1有的API的位置信息是以Widget本体左上角为原点的例如geometry和setGeometry就不考虑window frame窗口框架2有的API的位置信息是以window frame本体左上角为原点的例如frameGeometry和setFrameGeometry就考虑window frame窗口框架对于geometry函数来讲进行调用那么如果获取横坐标x和纵坐标y都是不考虑window frame框架的即都是从widget本体的左上角开始的即对应上图左上角紫色箭头指向的位置那么对于长度和宽度来讲同样也是不考虑window frame框架的即仅考虑widget本体的长度和宽度对应上图的下方和右侧的紫色箭头所标定的范围对于frameGeometry来讲进行调用那么如果要获取横坐标x和纵坐标y的话是要考虑window frame框架的即都是从window frame本体左上角开始的即对应上图左上角绿色箭头指向的位置那么对于长度和宽度来讲是要考虑window frame框架的那么对应上图的下方和右侧的绿色箭头所标定的范围所以说从上面的讲解中我们可以感知得到如下两点1对于geometry来讲不考虑window frame框架那么获取的横坐标x纵坐标y相对于考虑window frame的frameGeometry要大2那么对于geometry来讲不考虑window frame框架那么获取到的宽度和高度相对于考虑window frame的frameGeometry要小所以接下来我们期望通过代码来验证这两点是否正确所以我们创建项目名为QWidget_5基类为QWidget派生类为Widget的项目#includewidget.h#includeui_widget.h#includeQDebugWidget::Widget(QWidget*parent):QWidget(parent),ui(newUi::Widget){ui-setupUi(this);QRect rect1this-geometry();QRect rect2this-frameGeometry();qDebug()rect1;qDebug()rect2;}Widget::~Widget(){deleteui;}那么我们这里就针对Widget对象w来使用geometry和setGeometry观察是否考虑window frame窗口框架的区别所以如上我们在Widget的构造函数中分别调用geometry和setGeometry然后使用qDebug()打印即可运行结果如下小编为什么结果会是这样你莫不是在骗我不成其实没有这是由于我们将代码放到了Widget的构造函数中此时这个Widget对象正在构造还没有被操作系统自动添加window frame窗口框架所以我们此时还看不到window frame窗口框架的影响所以什么时候Widget对象才会被操作系统自动添加window frame窗口框架呢我们可以认为当Widget对象初始化完成后挂接到对象树的流程完成后才会被操作系统自动添加window frame窗口框架中所以在构造函数中我们是无法观察到window frame窗口框架的影响了那么如果我们想要观察到window framke窗口框架的影响应该是Windget对象w构造完成挂接到对象树上的流程完成之后才可以所以此时我们就要在Widget对象的构造函数结束后进行观察那么我们如何做呢#ifndefWIDGET_H#defineWIDGET_H#includeQWidgetQT_BEGIN_NAMESPACEnamespaceUi{classWidget;}QT_END_NAMESPACEclassWidget:publicQWidget{Q_OBJECTpublic:Widget(QWidget*parentnullptr);~Widget();publicslots:voidhandle();private:Ui::Widget*ui;};#endif// WIDGET_H#includewidget.h#includeui_widget.h#includeQDebug#includeQPushButtonWidget::Widget(QWidget*parent):QWidget(parent),ui(newUi::Widget){ui-setupUi(this);QPushButton*buttonnewQPushButton(this);button-setText(按钮);button-move(200,200);connect(button,QPushButton::clicked,this,Widget::handle);}Widget::~Widget(){deleteui;}voidWidget::handle(){QRect rect1this-geometry();QRect rect2this-frameGeometry();qDebug()rect1;qDebug()rect2;}那么我们创建一个按钮然后将按钮的点击信号关联上槽函数handle那么将原本处于构造函数中用于观察window frame窗口框架的影响的代码拷贝到槽函数handle中执行即可然后再将Widget对象构造函数中原本观察window frame窗口框架的代码注释掉即可那么当按钮点击之后我们就可以观察到window frame窗口框架的影响了运行结果如下所以此时根据上图的对应关系我们就可以看出了整体上geometry获取到的横坐标和纵坐标是要比frameGeometry要偏右下的geometry获取到的宽度和高度是要比frameGeometry要小的1对于geometry来讲不考虑window frame框架那么获取的横坐标x纵坐标y相对于考虑window frame的frameGeometry要大2那么对于geometry来讲不考虑window frame框架那么获取到的宽度和高度相对于考虑window frame的frameGeometry要小二、QWidget的windowTitle属性当前windowTitle属性是从属于QWidget而对于QWidget来讲是一个广泛的概念既可以指QWidget本身也可以指QWidget的派生类Widget及其QWidget的儿孙类都可以泛指QWidget那么其实windowTitle这样的属性只能针对顶层窗口Widget这样的QWidget才有效换言之对于窗口内的子控件去进行使用无效所以接下来小编就使用代码来验证一下那么我们先创建一个项目名为QWidget_6基类为QWidget派生类为Widget的项目那么当项目代码Qt帮我们自动生成好之后此时项目中的主类是Widget所以自然的Widget是顶层窗口那么默认顶层窗口的标题随类名Widget所以此时如上图我们什么都不写直接运行代码那么顶层窗口的标题是Widget那么关于windowTitle属性有两个API分别是windowTitle用于获取控件的窗口标题还有setWindowTitle用于设置控件的窗口标题那么对于setWindowTitle我们直接以字符串的形式传入并设置即可在实际使用中我们通常都是使用setWindowTitle因为对于一个GUI程序运行起来之后我们通常是设置好顶层窗口的标题之后就不再改变了那么对于使用windowTitle获取控件的窗口标题的使用场景需求比较少所以这里小编就不再演示windowTitle而是着重演示setWindowTitle的使用#includewidget.h#includeui_widget.hWidget::Widget(QWidget*parent):QWidget(parent),ui(newUi::Widget){ui-setupUi(this);this-setWindowTitle(这是窗口标题);}Widget::~Widget(){deleteui;}所以在Widget的构造函数中注意this指针指向的是Widget对象w即此时this指针指向的就是顶层窗口的控件Widget我们使用this指针是可以修改窗口标题的那么此时我们使用this指针调用setWindowTitle然后传入要设置的窗口标题即可即传入这是窗口标题运行结果如下所以此时顶层窗口Widget的标题就已经被我们修改了那么如果此时setWindowTitle作用的对象不是顶层窗口Widget而是作用到顶层窗口下的子控件按钮呢而小编前面讲解的是setWindowTitle只能作用于顶层窗口setWindowTitle不能作用于顶层窗口内的子控件这时候按照小编前面讲解的理论setWindowTitle作用到顶层窗口下的子控件是无法修改窗口标题的所以下面我们来验证一下#includewidget.h#includeui_widget.h#includeQPushButtonWidget::Widget(QWidget*parent):QWidget(parent),ui(newUi::Widget){ui-setupUi(this);this-setWindowTitle(这是窗口标题);QPushButton*buttonnewQPushButton(this);button-setText(按钮);button-setWindowTitle(通过按钮设置窗口标题);}Widget::~Widget(){deleteui;}那么我们创建一个按钮button设置好按钮显示的文本为按钮然后使用按钮调用setWindowTitle期望修改顶层窗口标题那么此时我们传入我们想要设置的标题为通过按钮设置窗口标题由于我们这里仅仅是想要使用按钮设置顶层窗口标题那么和槽函数无关所以这里小编就不编写和关联槽函数了然后接下来运行程序如果运行结束顶层窗口标题仍然为这是窗口标题那么就代表setWindowTitle只能对顶层窗口对应的控件Widget才有效如果运行结果顶层窗口的标题被修改为了通过按钮设置窗口标题那么表示setWindowTitle对顶层窗口Widget内的子控件进行设置也有效运行结果如下所以此时运行程序运行结束顶层窗口标题仍然为这是窗口标题代表setWindowTitle只能对顶层窗口对应的控件Widget才有效setWindowTitle对于顶层窗口Widget内的子控件无效那么此时我们来看这行代码button-setWindowTitle(“通过按钮设置窗口标题”)那么我们不应该给按钮设置窗口标题window Title因为实际设置了之后没有任何效果同样的也没有任何报错那么如果在实际开发中要完成某一个功能由于疏忽等我们写出了类似的代码其实我们还是更倾向于Qt可以直接给我们报错提示的因为这可以让我们快速定位问题所在同样的在实际的开发中我们可以多使用assert等或者其它手段来帮助我们检查代码三、QWidget的windowIcon属性QWidget的windowIcon属性表示窗口的图标如上就是窗口的图标网易云的图标豆包的图标微信的图标以及我们自己的Qt程序运行的默认图标可以看出我们自己的Qt程序运行的默认图标还是比较粗糙的那么Qt中针对windowIcon提供了两个API1第一个API 是windowIcon用于获取控件的窗口图标返回QIcon对象Qt中比较好的一点就是把涉及到的各种概念都封装成了类QIcon就表示一个图标2第二个API是setWindowIcon传参一个图标类QIcon用于设置控件的窗口图标同样的这里的窗口图标和窗口标题类似对于第一个API对应的windowIcon是很少使用的因为程序一旦运行起来很少会有获取窗口图标的需求所以对于第一个API对应的windowIcon我们不再进行演示感兴趣的读者友友可以自行验证第二个API对应的setWindowIcon我们经常会进行使用当程序启动的时候就调用setWindowIcon将程序图标设置好因为只要涉及正式的GUI程序那么就要涉及窗口图标的显示通常对于正式的GUI程序我们不使用系统默认的图标而是使用我们自己的图标进行设置窗口图标也类似于窗口标题这两个API即windowIcon和setWindowIcon只能针对顶层窗口进行使用那么我们在窗口标题中已经验证了那么在这里的窗口图标中就不再进行验证了感兴趣的读者友友可以自行验证在这里我们主要聚焦于setWindowIcon的使用那么既然是窗口图标我们就要先准备一张图片才能作为窗口图标这里小编已经准备好了如上元歌的皮肤午夜歌剧院各位读者友友可以选择自己喜欢的图片进行设置窗口图标的设置那么关于这一张图片我们需要下载到电脑本地那么小编下载之后的路径是位于E盘下那么这里我们找出这个图片的路径所以此时我们鼠标单点击选中这个图片然后鼠标右击图片选择复制文件路径即可找出图片的路径E:\YGKing.png如上这个路径是绝对路径这里小编需要强调一点这个路径不要带中文同样也不要带特殊符号这个绝对路径我们后面要进行使用和讲解所以接下来我们创建一个项目名为QWidget_7基类为QWidget派生类为Widget的项目#includewidget.h#includeui_widget.h#includeQIconWidget::Widget(QWidget*parent):QWidget(parent),ui(newUi::Widget){ui-setupUi(this);QIconicon(E:/YGKing.png);this-setWindowIcon(icon);}Widget::~Widget(){deleteui;}那么我们在Widget的构造函数中进行设置顶层窗口的图标即可因为目前的顶层窗口是Widget所以我们使用this指针访问的就是顶层窗口Widget对象w那么首先我们要定义一个QIcon图标对象首先值得注意的是这里我们定义这个QIcon图标对象并没有定义在堆上然后挂接到对象树上而我们之前创建对象都是定义在堆上并且挂接到对象树上那么这里定义QIcon对象并没有这样做这是为什么呢1 那么之前我们使用堆来创建的对象并且将对象挂接到对象树上那么我们之前创建的对象是控件对象主要是为了确保当前控件对象的生命周期是足够的是随窗口的是随程序的此时才不会出现程序运行的时候按钮等控件突然消失的情况并且当窗口关闭程序释放销毁的时候可以通过Qt的对象对象树来进行统一的释放2而对于这里的QIcon来讲QIcon自身是一个比较小的对象创建出来后就是要设置到Widget里面QIcon本身释放与否是不影响图标的最终显示的所以我们在构造函数定义栈上的对象QIcon使用完成后此时已经按照值拷贝的方式设置进了Widget里面了那么构造函数结束临时对象QIcon的生命周期结束自动释放就好了也不会存在任何问题3并且就算我们真的想要将QIcon对象挂接到对象树中前提是QIcon要支持对象树机制但是事实上是QIcon不支持对象树机制我们无法给它指定父对象所以我们才把QIcon对象定义为栈上的对象所以此时我们在QWidget的构造函数中QIcon icon(“E:/YGKing.png”)在栈上创建QIcon对象icon并且把路径进行传入那么我们把传入的路径和我们之前的路径进行对比我们之前的路径是E:\YGKing.png而传入的路径是E:/YGKing.png其中不同的是传入的路径使用了正斜杠/那么这是为什么呢1首先在C/C中使用反斜杠\那么反斜杠及其后面的第一个字符这两个字符就会被解释为一个转义字符所以在路径中我们并不推荐使用反斜杠如果非要使用反斜杠那么可以使用两个反斜杠代替一个反斜杠的形式进行传入例如这种形式E:\YGKing.png2那么在C/C中使用正斜杠则不会被解释为转义字符所以在路径中我们可以使用正斜杠替代反斜杠也就是小编在代码中使用的方式E:/YGKing.png3同样的那么在C11中引入了raw string来解决上述问题使用格式是一个大写的R然后跟双引号然后跟括号括号内填写对应的字符串即可即R(E:/YGKing.png)这种形式即此时的字符串内不会包含任何转义字符即处于raw string格式内的所有字符都不会进行转义那么这种raw string的方式用到这里有点大材小用的感觉了所以这里我们就简单的将反斜杠替换为正斜杠即可完成给QIcon对象icon进行路径的传入所以接下来我们就使用this指针调用setWindowIcon传入QIcon对象icon即可运行结果如下所以此时如上我们就实现了使用setWindowIcon对顶层窗口Widget的windowIcon属性的修改此时GUI程序运行显示的图标就不再是默认的了而是我们自己上传的图标四、qrc机制qrc机制的引入那么我们观察QIcon icon(“E:/YGKing.png”)我们是通过绝对路径引入的图标对应的图片那么比如小编在自己的电脑上是将图片放在了E盘中那么有没有可能用户电脑上没有E盘只有C盘和D盘没有E盘呢完全有可能呀并且对于用户将图标究竟放在C盘D盘还是E盘我们是不清楚的所以我们通过绝对路径引入图片的方式是不科学的我们写的GUI程序是最终要发布到用户电脑上的我们无法确保我们在开发机器上的图片路径和用户电脑上图片的路径完全一致一旦我们无法确保完全一致那么此时绝对路径就会失效那么我们的GUI程序用户拿到之后下载运行那么GUI程序的图标就会成为系统默认的图标用户心想这是哪个公司的程序也太挫了吧连图标都不显示所以相对于使用绝对路径的方式我们使用相对路径的方式是更好的那么对于相对路径来讲是以程序所在目录为基准目录以.点或者…点点的方式开头那么假设用户将可执行程序以及配套的资源安装在了C盘也就意味着此时图片资源和可执行程序的处于同级目录下所以此时我们就可以使用相对路径./YGKing.png的方式去找图片同样的如果和可执行程序的同级目录下放了一个image目录image目录里面才会放置图片所以此时我们就可以使用相对路径./image/YGKing.png的方式去找图片可是这种方式仍然有问题如果用户爱好删除目录清理垃圾用户知道可执行程序不能删除但是却把可执行程序的配套资源这些给删除了即我们可执行程序的图标对应的图片就是处于可执行程序的配套资源中即可执行程序的图标对应的图片就被删除了所以此时即使我们的相对路径写出花来都无法找到可执行程序的图标对应的图片所以GUI程序启动依旧无法显示出GUI程序的图标那么用户心想这是哪个公司的GUI程序连图标都不显示也太挫了吧所以我们作为GUI程序开发者该如何做呢使用qrc机制qrc机制的讲解那么Qt中引入了qrc机制就可以从根本上解决上述两个问题1确保图片等资源所在的路径在目标用户机器上存在2确保图片等资源不会被用户搞没了对于qrc机制的使用首先我们需要先给Qt项目引入一个额外的xml文件对于这个xml文件的后缀名使用.qrc来进行表示在xml中把要使用的图片资源给导入进来并且在xml中进行记录图片的虚拟路径那么在Qt编译项目的时候就会根据qrc中描述的图片信息找到图片内容并且提取出图片的二进制数据把这些二进制数据转换成C代码最终编译到可执行程序.exe中所以此时用户再怎么样将可执行程序安装到哪个目录中图片等资源的相对路径都是有效的并且用户再怎么删除可执行程序的配套资源都无法删除图片等资源了当然如果用户不想使用可执行程序了将可执行程序也卸载的这种情况除外其实在很多的图形化开发框架中都有类似于qrc这样的机制同样的在Android中也有类似于qrc的机制那么对于qrc的缺点无法导入太大的资源文件比如搞个几个GB的这种视频文件qrc就无能为力了qrc机制的使用那么首先我们在我们当前的QWidget_7项目中继续创建一个qrc文件对于这个文件名不要带中文和特殊符号右上角点击文件点击新建文件或项目然后点击左侧的文件和类中的Qt接下来点击中间的Qt Resource File接下来点击右下角的Choose接下来文件名输入resource默认Qt会为我们在qrc文件名的后面添加.qrc后缀对于文件名称可以为任意名称但是不要带中文和特殊符号接下来点击下一步即可如果需要的话就添加版本控制系统不需要的话和小编一样选择None即可接下来选择完成即可所以此时我们就会见到如上界面那么接下来我们要进行的操作就是把图片导入到qrc文件中去了那么接下来我们点击Add Prefix也就是先创建一个前缀Prefix那么对于这个前缀我们可以理解成一个虚拟的目录这个目录并没有在我们的电脑上真实存在是Qt自己抽象出来的注意看第二列的Add Files是禁用状态其实图片或视频等在计算机看来本质上就是一串二进制数据而qrc机制的本质就是把图片的二进制数据转化成C代码最终我们就会在代码中看到很大的char数组里面就是图片的二进制数据那么在后面小编可以把这个很大的char数组找出来看看那么为了方便Qt代码访问到这个图片Qt就自己抽象出了虚拟的目录接下来我们点击Add Prefix之后我们把前缀的名字修改成/即可接下来我们就需要把YGKing.png这个图片导入到资源文件中了那么我们来看上面的Add Files这个按钮在创建前缀Prefix之前是禁用的创建好前缀Prefix之后就可以进行使用了那么点击Add Files之后我们要添加的图片资源文件就是添加到前缀Prefix对应的/下面那么我们点击Add Files之后得到的目录就是当前代码所在的目录而我们的图片所在的目录是在E:\YGKing.png中所以此时我们进入E盘然后选中我们的图片YGKing.png点击打开但是点击打开之后就会弹出如上界面其实qrc想要导入资源文件还有一个要求就是导入图片的时候需要确保导入的图片必须在resource.qrc文件的同级目录或者同级目录的子目录里所以对于上面我们点击复制所以我们把YGKing.png拷贝到当前的项目目录里即可那么找到我们的图片YGKing.png然后选中按下ctrlc进行复制如上我们复制YGKing.png之后粘贴到项目目录中即可那么项目目录如何找那么就是鼠标右击项目的QWidget_7.pro文件然后点击在Explorer中显示即可所以此时我们ctrlv将我们的图片YGKing.png粘贴到到项目目录中即可此时项目目录的同级目录中就已经有了我们的图片YGKing.png了然后此时我们再点击Add Files添加我们的图片文件如上选中我们的图片YGKing.png点击打开然后再点击确定即可接下来我们看到如上效果说明我们导入成功了所以此时我们需要注意两个地方分别是前缀和图片文件名创建的前缀叫/我们的图片文件名叫做YGKing.png这两个后面要用到#includewidget.h#includeui_widget.h#includeQIconWidget::Widget(QWidget*parent):QWidget(parent),ui(newUi::Widget){ui-setupUi(this);// QIcon icon(E:/YGKing.png);QIconicon(:/YGKing.png);this-setWindowIcon(icon);}Widget::~Widget(){deleteui;}所以此时我们已经将我们需要的窗口图标对应的YGKing.png图片文件导入进了qrc文件中那么我们就该在代码层面访问qrc文件中的图片资源了QIcon icon(“:/YGKing.png”)那么当代码中需要访问qrc文件中管理的资源文件的时候就需要在路径的前面带上: 作为前缀那么我们的路径是什么呢那么路径就是在qrc文件中创建的前缀Prefix对应的虚拟目录/加上文件名那么我们这里的图片文件名是YGKing.png注意这里的前缀我们当初创建qrc文件的时候填写什么名字那么代码中就填写什么名字即可前缀Prefix我们填写的/所以合起来就是路径就是前缀/加图片文件名即路径为/YGKing.png由于我们要访问是qrc文件管理的文件所以此时我们需要在路径前带有:作为前缀所以此时我们就使用QIcon icon(“:/YGKing.png”)的形式访问qrc中的图片文件资源YGKing.png即可运行结果如下所以如上此时我们处于qrc文件中的图片文件资源YGKing.png就被访问并且显示到了GUI程序窗口上了小编小编你不是说要给我们找一下大的char类型的数组吗那么下面小编带领大家来找一下所以此时我们先进入项目目录那么就是鼠标右击项目的QWidget_7.pro文件然后点击在Explorer中显示即可然后我们点击qt进入上级目录找到bulid-QWidget_7这个目录并点击接下来点击debug并进入那么我们此时就会找到一个qrc_resource.cpp的文件那么实际上qrc中导入的图片资源就会被转成qrc_resource.cpp这个c代码那么我们鼠标左击点击选中拖拽到Qt中所以此时我们就会看到如上界面其中我们来看最开始的地方有一个char类型的数组这里面我们观察就是以一个字节为单位因为0x10表示两个16进制数一个16进制数是4个比特位两个16进制数是8个比特位1个字节是8个比特位所以这个数组内这里面的字节内容就是YGKing.png里面的每个字节的数据而这个char类型的数组多大取决于我们给出的资源文件的大小资源文件越大这个char类型的数组就越大反之则越小那么当Qt项目进行编译的时候上述qrc_resource.cpp这个cpp文件就被一起编译到了可执行程序.exe中当可执行程序.exe运行的时候上述图片的数据也就被加载到内存中了那么我们再更深入的理解一下其实原本没有qrc文件的时候那么进行编译形成的可执行程序当可执行程序运行的时候对于需要显示的图标对应的图片数据需要到特定实际存在的目录下去找进行加载那么如果有qrc文件之后图片数据就先被放在了qrc文件中那么进行编译形成的可执行程序中就会将qrc中的图片数据加载到可执行程序的代码中即此时的可执行程序就会内置图片数据即原本没有qrc文件的时候当程序运行的时候对于图片数据需要到特定实际存在的目录下去找而有qrc文件之后那么本质上在可执行程序中提供一块缓冲区用于存放图片数据那么此时就不再需要去特定实际存在的目录下去找了就直接将缓冲区的数据进行加载到内存就可以显示图标对应的图片了所以此时我们只需要将可执行程序.exe交给用户可执行程序的代码中内部已经提供了一段缓冲区用于存放图片的数据所以用户启动可执行程序之后当可执行程序加载到内存之后自然的用户存放图片数据的缓冲区也就被加载到了内存中所以此时窗口图标对应的图片就可以进行显示了总结以上就是今天的博客内容啦,希望对读者朋友们有帮助水滴石穿坚持就是胜利读者朋友们可以点个关注点赞收藏加关注找到小编不迷路