【Qt】QWidget核心属性&相关API

avatar
作者
猴君
阅读量:0

目录

一. enabled——是否可用

二. geometry——几何位置

window frame

三. windowTitle——窗口标题

四. windowIcon——窗口图标

​qrc文件

五. windowOpacity——透明度 

六. cursor——光标

自定义光标

七. font——字体

八. toolTip——提示栏

九. focusPolicy——焦点策略(选中策略)

十.  styleSheet——样式表

 

Widget(组件)，是Qt的核心概念，常叫做“控件”。控件是构成图形化界面的基本要素。

常见的控件有：按钮，输入框，下拉框，窗口等

在开发图形化界面时，为了布局和功能，控件有多种属性和管理对应属性的API

在Qt Designer中，已经有简便我们开发的图形化界面

  • 左侧是Qt提供的所有的控件，可通过拖拽到程序界面的方式添加控件
  • 选中一个控件，右下方会显示该控件的objectName，和其属性。后续使用代码开发时，可以通过ui->objectName的方式访问到该控件对象

一. enabled——是否可用

控件的首要目的是让用户使用，接受用户事件。而enabled属性是标识该控件是否可用

  • 不可用，即“禁用”指的是该控件不能接收任何用户的输入事件，并且外观上往往是灰色
  • 如果一个widget被禁用，则该widget的子元素也被禁用。例如一个窗口被禁用了，那么该窗口上的按钮，输入框等也会被禁用
API说明
isEnabled()获取该控件的可用状态
setEnabled()设置该控件是否可用，true表示可用，false表示禁用

 示例：

通过拖拽添加两个按钮：pushButton和pushButton_enabled(各自的objectName)

接着右键控件，选中“转到槽”，再选择要关联的信号——clicked。

该部分知识设计信号与槽，可参看【Qt】信号与槽

接着就可以在代码编写界面实现具体的槽函数。widget.cpp代码如下：

#include "widget.h" #include "ui_widget.h" #include <QDebug>  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this); }  Widget::~Widget() {     delete ui; }   void Widget::on_pushButton_clicked() {     qDebug() << "当前按钮可用";//pushButton的打印测试 }  void Widget::on_pushButton_enabled_clicked() {     bool enabled = ui->pushButton->isEnabled();     if(enabled)         ui->pushButton->setEnabled(false);//设置不可用     else         ui->pushButton->setEnabled(true);//设置可用 }

不可用的控件一般为灰色，按钮点击效果如下： 

在Qt Designer中也可以通过右下方的控件属性改变控件的可用状态

二. geometry——几何位置

在Qt中，界面的分布使用左手坐标系，如图所示

描述一个控件所在界面位置，通过这四个属性——x，y，height，width

Qt将这四个属性封装在了QRect(矩阵)中

API说明
geometry()获取到控件的位置和尺寸.返回值是一个QRect
setGeometry(QRect)设置控件的位置和尺寸，通过QRect设置
setGeometry(int x, int y, int width, int height)设置控件的位置和尺寸，通过四个属性分别设置

示例：通过四个按钮，控制一个按钮的上下左右移动

界面布局，即各按钮的objectName如下

 控制移动的四个按钮都关联clicked信号，各自槽函数实现如下：

void Widget::on_pushButton_up_clicked() {     QRect rect = ui->pushButton->geometry();     rect.setY(rect.y() - 5);//向上移动5个像素点     ui->pushButton->setGeometry(rect); }  void Widget::on_pushButton_down_clicked() {     QRect rect = ui->pushButton->geometry();     rect.setY(rect.y() + 5);//向下移动5个像素点     ui->pushButton->setGeometry(rect); }  void Widget::on_pushButton_left_clicked() {     QRect rect = ui->pushButton->geometry();     rect.setX(rect.x() - 5);//向左移动5个像素点     ui->pushButton->setGeometry(rect); }  void Widget::on_pushButton_right_clicked() {     QRect rect = ui->pushButton->geometry();     rect.setX(rect.x() + 5);//向右移动5个像素点     ui->pushButton->setGeometry(rect); }

实际程序运行效果如下：

实际程序运行发现，该方式设置的控件位置，不仅会改变控件对象的左上角位置，还可以改变控件的height和width。

如果要想实现控件对象的平移，相应槽函数可以如下编写

void Widget::on_pushButton_up_clicked() {     QRect rect = ui->pushButton->geometry();     //向上移动5个像素点 //    rect.setY(rect.y() - 5); //    ui->pushButton->setGeometry(rect);     ui->pushButton->setGeometry(rect.x(), rect.y() - 5, rect.width(),rect.height()); }  void Widget::on_pushButton_down_clicked() {     QRect rect = ui->pushButton->geometry();     //向下移动5个像素点 //    rect.setY(rect.y() + 5); //    ui->pushButton->setGeometry(rect);     ui->pushButton->setGeometry(rect.x(), rect.y() + 5, rect.width(),rect.height()); }  void Widget::on_pushButton_left_clicked() {     QRect rect = ui->pushButton->geometry();     //向左移动5个像素点 //    rect.setX(rect.x() - 5); //    ui->pushButton->setGeometry(rect);     ui->pushButton->setGeometry(rect.x() - 5, rect.y(), rect.width(),rect.height()); }  void Widget::on_pushButton_right_clicked() {     QRect rect = ui->pushButton->geometry();     //向右移动5个像素点 //    rect.setX(rect.x() + 5); //    ui->pushButton->setGeometry(rect);     ui->pushButton->setGeometry(rect.x() + 5, rect.y(), rect.width(),rect.height()); }

程序运行效果如下：

window frame

实际上Qt的QWidget的位置信息，有两个参照物。我们在Qt Designer中操作的界面是不包含标题栏和边框的

边框和标题栏都是Qt帮我们自动生成的，这就是window frame，是操作系统提供的，有特定API，在Qt中，window frame是在QWidget的构造函数中创建的

所以相对位置就有两个参照物， 包含window frame的和不包含window frame的

上述的geometry()和setGeometry()就是不包含window framede的

包含window frame

API说明
frameGeometry()获取到控件的位置和尺寸.返回值是一个QRect，包含window frame
setFrameGeometry(QRect)设置控件的位置和尺寸，通过QRect设置
setFrameGeometry(int x, int y, int width, int height)设置控件的位置和尺寸，通过四个属性分别设置

还有直接获取位置信息的方法，其返回值也是包含window frame的位置信息

ui->pushButton->x(); ui->pushButton->y(); ui->pushButton->width(); ui->pushButton->height();

 而通过geometry返回的QRect获取的位置信息就不包含window frame的

ui->pushButton->geometry().x(); ui->pushButton->geometry().y(); ui->pushButton->geometry().width(); ui->pushButton->geometry().height();

三. windowTitle——窗口标题

windowTitle顾名思义，就是窗口的标题

API说明
setWindowTitle设置当前控件的窗口标题

注意：只有最外层的窗口设置窗口标题才会有效果，如果是窗口中一个按钮调用setWindowTitle方法，是没有任何效果的

四. windowIcon——窗口图标

窗口图标就是图形化程序左上角的图标，任务列表中也会显示窗口图标，例如：

API说明
windowIcon()获取控件的窗口图标，返回QIcon对象
setWindowIcoen(const QIcon& icon)设置控件的窗口图标

setWindowIcon和setWindowTitle一样，只对最外层/顶层的窗口有效 

API说明
QIcon(const char*)将该路径的图片转为二进制，构造出QIcon对象

示例：

#include "widget.h" #include "ui_widget.h"  #include <QIcon>  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);      QIcon icon(R"(C:\Users\Lenovo\Desktop\code\7.jpg)");//使用原始字符串字面量     this->setWindowIcon(icon); }  Widget::~Widget() {     delete ui; }

 qrc文件

上述构造windowIcon使用的图片是绝对路径，这是不合理的

  1. 用户不一定有该路径，比如绝对路径是F:/image/1.jpg，但如果用户只有C盘和D盘，那该路径就不存在
  2. 如果该路径的图片丢失，则无法加载窗口图标

使用相对路径的方式，可以保证路径存在

假设基准目录是D:/，给定的相对路径是./image/1.jpg  =》 在基准目录下找image目录，再在image目录中找1.jpg

 .  表示当前目录  ..表示上级目录

对于Qt程序来说，当前工作可能是变化的。比如通过Qt Creator运行的程序，当前工作目录是项目的构建目录；直接双击.exe运行，工作目录则是exe所在目录

所谓构建目录，是和Qt项目并列的，专门用来放生成的临时文件和最终exe的目录

但相对路径的方式无法解决路径图片丢失的问题，Qt提供的解决方法是qrc文件

qrc文件是一种xml格式的资源配置文件，用xml(标签)记录硬盘上的文件和对于的随意指定的资源名称，应用程序通过资源名称来访问这些资源

在Qt开发中，可以通过将资源文件添加到项目中来方便地访问和管理这些资源，这些资源文件可以位于qrc文件所在目录的同级或其子目录下

在构建程序的过程中，Qt会把资源文件的二进制数据转成cpp代码，编译到exe中，从而使依赖资源变得“路径无关”

使用qrc文件设置窗口图标

1. 点击文件，选择新建文件

2. 选择“文件和类”中的Qt 

3. 选择Qt Resource File

4. 填写文件名，路径名 ，注意文件名和路径名都要包含中文和特殊符号

版本控制根据自己的项目，跟创建项目时选择一致即可

Qt Creator为我们提供了qrc文件的图形化开发界面

5. 在qrc编辑器中，添加前缀(prefix)

所谓的前缀，可以理解为“目录” . 该前缀决定了后续我们如何在代码中访问资源。

此处我添加了一个"/"前缀

6. 选择添加的图片——Add Files

Qt要求添加的文件必须是在qrc文件的同级目录，或者同级目录的子目录中，所以需要提前把图片复制到该目录下

如果选择其他目录下的图片，Qt不允许添加

如下是添加成功的效果，然后我们就可以在代码中使用该图片

#include "widget.h" #include "ui_widget.h"  #include <QIcon>  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);     QIcon icon(":/7.jpg");//:开头表示从qrc中获取资源，/是我们设置的前缀，7.jpg是资源名     this->setWindowIcon(icon); }  Widget::~Widget() {     delete ui; }

运行程序后，在项目的构建目录下，我们可以看到目录多了一个qrc_XXX.cpp和qrc_XXX.o文件。这两个文件都是Qt的元编程生成的：Qt基于qrc文件生成C++代码(qrc_XXX.cpp)，在程序编译时一同编译(qrc_XXX.o)，最后链接生成.exe文件

其中，图片是被转换成了一个字符数组，内置在程序代码中

 如此就既不需要关心图片资源的路径问题，也不需要关心图片丢失的问题

缺点：qrc文件是通过将图片资源转化为字符数组的形式存储在程序中，这势必会增加程序的大小，导致程序的编译，加载，运行更消耗资源。

五. windowOpacity——透明度 

windowOpacity用于控制控件的透明度，其数值为0.0 ~ 1.0，数值越大越不透明。0.0表示全透明，1.0表示完全不透明

如此的数值含义，理解为不透明度更合适，数值越大越不透明

API说明
windowOpacity()返回float类型，控件的不透明度
setWindowOpacity(float n)设置控件的不透明度

示例：添加两个按钮，一个增大不透明度，一个减小不透明度 

1. 使用Qt Designer添加按钮，设置objectName

2. 关联信号和槽 

void Widget::on_pushButton_add_clicked() {     //增加不透明度     float opacity = this->windowOpacity();     if(opacity >= 1.0)         return;     opacity += 0.1;     this->setWindowOpacity(opacity); }  void Widget::on_pushButton_sub_clicked() {     //减小不透明度     float opacity = this->windowOpacity();     if(opacity <= 0.0)         return;     opacity -= 0.1;     this->setWindowOpacity(opacity); }

3. 运行程序，点击“-”，降低不透明度

六. cursor——光标

在Qt中，我们可以通过设置鼠标移动到不同控件，显示不同光标来增加程序的丰富性和美观

API说明
cursor()

获取当前控件的光标属性，返回QCursor对象

当鼠标悬停在该控件上，就会显示出对应形状

setCursor(const QCursor &cursor)设置该控件的光标，仅鼠标停留在该控件上生效
QGuiApplication::setOverrideCursor(const QCursor &cursor)设置全局光标的形状，整个程序的控件都会生效，覆盖各自控件setCursor设置的内容

图形化开发 

直接通过属性的cursor选择

代码编写 

 Qt封装了一个枚举类，枚举了内置的光标类型

#include "widget.h" #include "ui_widget.h"  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);      QCursor cursor(Qt::WaitCursor);     ui->pushButton->setCursor(cursor); }  Widget::~Widget() {     delete ui; }

自定义光标

为了让程序更加美观，我们也可以自定义光标，将图标做成光标

图片导入项目的方法也是使用qrc文件的方式，此处不过多赘述

#include "widget.h" #include "ui_widget.h"  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);     QPixmap pixmap(":/candy.png");//位图对象     pixmap = pixmap.scaled(40, 40);//对图片进行缩放——尺寸40 * 40像素     QCursor cursor(pixmap, 0, 0);//构造光标     ui->pushButton->setCursor(cursor);//设置光标 }  Widget::~Widget() {     delete ui; }
  1. QCursor构造函数的后两个参数是指明热点的位置，热点就是光标实际点击的点，此处设置的位置是相对光标的左上角的位置，(0, 0)就代表光标的最左上角
  2. QPixmap的scaled函数不是对原本图标的改变，是返回一个改变后的图标的副本

七. font——字体

Qt封装了QFont类，实现对控件中字体的管理，其属性包括字体家族，字体大小，字体粗细等等

属性说明
family字体家族，如“楷体”，“宋体”，“微软雅黑”等
pointSize字体大小
weight字体粗细，以数值方式表示粗心程度取值范围[0,99]，数值越大，字体越粗
bold是否加粗，bool值，设置true，相当于weight = 75，false相当于weight = 50
italic是否倾斜
underline是否有下划线
strikeOut是否带有删除线

相关API

API说明
font()获取当前控件的字体信息，返回QFont对象
setFont(const QFont &font)设置当前控件的字体信息

示例：

图形化开发

使用Qt Designer可以直接在属性处选择字体信息

代码编写 

#include "widget.h" #include "ui_widget.h"  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);     QFont font = ui->label->font();//获取字体信息     font.setBold(true);//加粗     font.setFamily("宋体");//设置字体家族     font.setPointSize(10);//设置大小     font.setItalic(true);//设置倾斜     ui->label->setFont(font); }  Widget::~Widget() {     delete ui; }

八. toolTip——提示栏

当用户将鼠标悬置在控件上方时，我们可以添加提示栏来告诉用户如何使用该控件或者显示一些信息。例如在编译器中，我们将鼠标悬停在一个方法上，编译器就会弹出一个窗口显示其方法声明，这就是提示栏

相关API

API说明
toolTip()返回提示栏的文本，返回值为QString
setToolTip(const QString &string)设置提示栏文本
toolTipDuration()返回提示栏持续时间，int类型，单位为毫秒
setToolTipDuration(const int msec)试着提示栏持续时间，单位为毫秒。传-1代表提示栏不消失

示例：

图形化开发

可直接设置toolTip文本和toolTipDuration持续时间

代码编写

#include "widget.h" #include "ui_widget.h"  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);     ui->pushButton_yes->setToolTip("Yes按钮");     ui->pushButton_yes->setToolTipDuration(-1);     ui->pushButton_no->setToolTip("No按钮");     ui->pushButton_no->setToolTipDuration(4000); }  Widget::~Widget() {     delete ui; }

九. focusPolicy——焦点策略(选中策略)

所谓“焦点”，指的是能选中这个元素的方法，比如键盘操作。

“”焦点“”对于输入框、单选框、复选框等控件很重要

常见的焦点策略（选中策略）有点击和Tab

相关API 

API说明
focusPolicy()获取该控件的focusPolicy，返回值类型为Qt::FocusPolicy
setFocusPolicy(const Qt::FocusPolicy)设置该控件的focusPolicy

Qt::FocusPolicy是Qt内置的一个枚举类，取值如下：

  • Qt::NoFocus：该控件不会接受键盘焦点，不可被选中
  • Qt::TabFocus：该控件可通过Tab键接受焦点，可通过Tab选中
  • Qt::ClickFocus：该控件可通过鼠标点击接受焦点，看通过点击选中
  • Qt::StrongFocus：该控件可通过Tab键和点击选中
  • Qt::WheelFocus：该控件可通过Tab键，点击，鼠标滚轮选中

示例：

图形化开发

代码编写

#include "widget.h" #include "ui_widget.h"  Widget::Widget(QWidget *parent)     : QWidget(parent)     , ui(new Ui::Widget) {     ui->setupUi(this);     ui->lineEdit->setFocusPolicy(Qt::StrongFocus); }  Widget::~Widget() {     delete ui; }

十.  styleSheet——样式表

Qt可以通过CSS设置widget样式

CSS(Cascading Style Sheets 层叠样式表) 是网页前端技术，主要就是用来描述界面的样式

所谓“样式”，包括但不限于大小、位置、颜色、间距、字体、背景、边框等

CSS中可以设置的样式属性非常多，基于这些属性，Qt可以支持其中一部分，称为QSS(Qt Style Sheets)。具体的支持情况可以参看Qt文档中"Qt Style Sheets Reference"章节 

示例：设置文本样式

图形化开发

(1). 在Qt Designer添加一个Label标签，右键，选择“改变样式表”，使用CSS设置样式

语法同CSS，使用键值对的方式设置样式，其中键和值之间使用  ：分隔。键值对之间使用；分隔

Qt Designer只能对样式的基本格式进行校验，不能检测出哪些样式不被Qt支持

比如text-align:center，这样的文本居中操作，就无法支持

 代码实现

API说明
styleSheet()返回该控件的样式表，返回值为QString
setStyleSheet(const QString &styleSheet)设置样式表，使用QSS风格字符串
ui->label->setStyleSheet("font-family:微软雅黑; font-size:30px; ");
相关阅读
  1. 如何查看和设置我的Android N设备的权限？
  2. 如何在安卓手机上自定义应用图标？
  3. 如何在安卓微信中同时听语音和查看图片？
  4. 华为哪些设备将支持升级至安卓7.0？
  5. 微信安卓软件中Q10功能有哪些独特之处？
  6. 安卓用户如何挑选最佳视频播放器应用？
  7. 安卓系统中用户文件目录的确切位置是什么？
  8. 小米4用户如何安全升级到安卓8.0系统？
  9. 如何成功将魅蓝5升级至安卓原生7.0版本？
  10. 16GB存储的安卓手机是否能满足日常需求？

广告一刻

为您即时展示最新活动产品广告消息，让您随时掌握产品活动新动态！