目录
前言:
控件是Qt中非常重要的概念,在Qt中所有的控件都是直接或间接继承自QWidget类。一个完整的界面是由多个控件组成的,因此开发图形化界面就离不开控件。控件英文名为Widget,在Qt中,内置控件包含但不限于按钮,文本、单行输入框,多行输入框,滚动条,下拉框等。并且Qt支持自定义控件,这让开发者得以实现各式各样的DIY控件设计。
1、QWidget的核心属性
由于Qt中所有的控件都是继承自QWidget类,因此每个控件中都会有QWidget类的属性,在ui文件中,从右边栏中随便拖拽一个控件至界面中,选中该控件,即可在右下角看到该控件里的QWidget属性。示意图如下:
可以看到QWidget属性内容是非常多的,我们只需要记住一些常用的即可,具体属性介绍如下:
enabled | 设置控件是否可使⽤,true 表示可⽤,false 表示禁⽤ |
geometry | 以父元素坐标为原点,设置控件位置和尺⼨,包含x,y,width,height四个部分 |
windowTitle | 设置 widget 标题 |
windowIcon | 设置 widget 图标 |
windowOpacity | 设置 widget 透明度 |
cursor | 设置⿏标悬停时显⽰的图标形状,比如是普通箭头,还是沙漏,还是⼗字等形状 |
font | 设置字体相关属性,比如字体家族,字体大小,粗体,斜体,下划线等等 |
toolTip | ⿏标悬停在控件上会在状态栏中显示的提示信息 |
toolTipDuring | toolTip 显示的持续时间 |
minimumSize | 控件的最⼩尺⼨,包含最⼩宽度和最⼩⾼度 |
maximumSize | 控件的最⼤尺⼨,包含最⼤宽度和最⼤⾼度 |
sizePolicy | 尺⼨策略,设置控件在布局管理器中的缩放⽅式 |
2、enabled
enabled表示设置控件是否可使⽤(默认控件都是可以使用的),在ui文件中可以直接对enabled属性进行勾选。当禁用了一个控件的enabled意味该控件不能接收任何用户的输⼊事件,在外观上往往是灰⾊的且无法选中该控件,如果⼀个控件被禁⽤,则该控件的⼦控件也会被禁⽤。
示例如下:
上述是用界面的方式进行禁用,还可以使用代码的方式对控件的enabled属性设置禁用,Qt提供了两个接口如下:
isEnabled() 获取到控件的enabled状态
setEnabled() 参数传true或者false,表示设置控件是否可使⽤
测试代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QPushButton>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QPushButton* p = new QPushButton("按钮",this);
p->setEnabled(false);//该按钮被设置为禁用状态
}
Widget::~Widget()
{
delete ui;
}
测试结果进行对比(右图为上述代码的运行结果):
3、geometry
geometry表示控件所处的位置(横、纵坐标)和控件本身的尺寸(长*宽),用四个属性来表示他们:x(横坐标)、y(纵坐标)、width(宽度)、height(高度)。并且是以父控件的左上角为原点的。
有了上述四个属性,就可以在界面中描绘处一个控件,不过在此之前,先了解Qt中的坐标系的规定,Qt的坐标系和数学中的笛卡尔坐标系不同,Qt坐标系为左手坐标系,该坐标系的结构如下:
Qt中提供了两个关于geometry的接口,该接口介绍如下:
geometry()
//获取到控件的位置和尺⼨. 返回结果是⼀个QRect类型的对象,
//该对象包含了 x, y, width, height四个成员
setGeometry(QRect)
setGeometry(int x, int y,int width, int height)
//设置一个控件的geometry,可以传QRect对象,也可以直接传四个属性
有了上述的基础概念,就可以对一个控件进行位置和尺寸的设置了。
3.1 代码测试geometry
实现四个方向按钮来控制另一个按钮的位置,即按下左移按钮,则被控制的按钮向左移动。具体示意图如下:
实现上下左右四个按钮的槽函数。当按下这四个按钮时会发送对应的信号,这些信号就会触发对应的槽函数,每个槽函数都会使上面的移动按钮向对应方向移动若干距离,槽函数代码如下:
#include "widget.h"
#include "ui_widget.h"
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
}
Widget::~Widget()
{
delete ui;
}
void Widget::on_pushButton_clicked()//向上移动
{
QRect q = ui->pushButton_move->geometry();
ui->pushButton_move->setGeometry(q.x(),q.y()-50,q.width(),q.height());
}
void Widget::on_pushButton_2_clicked()//向左移动
{
QRect q = ui->pushButton_move->geometry();
ui->pushButton_move->setGeometry(q.x()-50,q.y(),q.width(),q.height());
}
void Widget::on_pushButton_3_clicked()//向下移动
{
QRect q = ui->pushButton_move->geometry();
ui->pushButton_move->setGeometry(q.x(),q.y()+50,q.width(),q.height());
}
void Widget::on_pushButton_4_clicked()//向右移动
{
QRect q = ui->pushButton_move->geometry();
ui->pushButton_move->setGeometry(q.x()+50,q.y(),q.width(),q.height());
}
测试结果:
可以从结果看到,点击左移按钮使,上面的按钮向左移动了,同理其他按钮也是一样的效果。
4、windowTitle
该属性顾名思义表示窗口的标题,当我们生成一个界面使,可以看到该界面顶层是有一个标题的,如下图:
Qt提供了两个对窗口标题操作的接口,如下:
windowTitle() //获取当前窗口的标题
setWindowTitle(constQString& title) //设置当前窗口标题
//值得注意的是,调用这两个接口的控件的顶层必须有窗口标题,否则调用不会产生效果
4.1 代码测试windowTitle
通过让widget去调用setWindowTitle函数,达到设置窗口标题的作用,代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QPushButton>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
this->setWindowTitle("设置窗口标题");
}
Widget::~Widget()
{
delete ui;
}
测试结果:
这里必须要用this指针去调用,因为this指针代表widget,而widget的顶层含窗口标题。不能用一个创建出来的控件去调用setWindowTitle,因为那样做不会产生任何效果。
5、windowIcon
windowIcon表示窗口的图标,从上面的图片中可以看到窗口标题旁边有一个图标,windowIcon就是描述窗口图标的属性。Qt提供了两个对窗口图标进行操作的接口,接口介绍如下:
windowIcon() //获取窗⼝图标,返回QIcon对象,QIcon就是图标的代码表现形式
setWindowIcon(const QIcon& icon) //设置窗⼝图标
这两个接口的用法逻辑和windowTitle是一样的,只不过把图标封装成QIcon类。并且大部分场景是使用setWindowIcon接口对窗口图标进行设置。
5.1 QIcon设置图标
将图标所在的路径以字符串的形式传给QIcon,然后把QIcon传给setWindowIcon,此时编译器会依据QIcon里的路径找到这个图标。由于开发的界面程序是要发给用户的,因此也会把对应的图标文件发给用户,一般会使用相对路径的方式,将图标文件扎入至用户的磁盘中。但是这么做会将图标暴露在外,即用户可以删除这个图标文件,这样一来程序就会会问题,所以针对图标存放问题,一般采用qrc机制。
5.2 qrc机制
qrc机制解决的两个问题:1、确保图标文件在用户主机上。2、确保图标不会被轻易的删除。 qrc是一种创建虚拟目录,并把图标文件导入到该目录下的方式来解决以上两个问题的,可以理解为图标文件模拟了一个目录环境。生成qrc文件的如下。
1、点击新建项目,然后选择Qt里的Qt Resource File:
2、给qrc文件定义一个文件名:
3、然后一直点击下一步,就生成完毕了:
4、现在只是创建了qrc文件,还需要在该文件中生成虚拟目录:
点击add Files会打开一个目录,该目录就是当前代码所在的目录,并且要导入的图标必须该目录下。
5、点击Add Files后,选择要添加的图标:
6、最终可以看到虚拟目录下的图标文件,表示添加完成:
以上就是qlc虚拟目录的创建,后续只需要在代码中将该虚拟目录的路径给到QIcon对象就可以设置窗口图标了。
5.3 代码测试windowIcon
在代码中用刚刚导入的图标文件的路径创建QIcon对象,然后用该对象进行设置图标:
#include "widget.h"
#include "ui_widget.h"
#include <QIcon>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QIcon q(":/rose.png");//找到刚刚图标文件的路径
this->setWindowIcon(q);
}
Widget::~Widget()
{
delete ui;
}
运行结果:
从结果可以看到,窗口图标已经被更改。
6、windowOpacity
windowOpacity表示控件的透明度属性,Qt提供了两个关于此属性的接口:
windowOpacity()
//获取到控件的不透明数值,返回值的类型为float,
//范围为0.0 -> 1.0 其中 0.0 表⽰全透明, 1.0 表⽰完全不透明
setWindowOpacity(float n)
//设置控件的不透明数值
即数值越接近0.0则控件的背景是越透明,数值越接近1.0则相反。
6.1 代码测试windowOpacity
创建两个按钮,一个按钮被点击会增加当前窗口的不透明度,另一个按钮被点击会增加当前窗口的透明度,代码如下:
定义这两个按钮的槽函数:
#include "widget.h"
#include "ui_widget.h"
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
}
Widget::~Widget()
{
delete ui;
}
void Widget::on_pushButton_add_clicked()
{
float f = this->windowOpacity();
f+=0.1;//增加不透明度
this->setWindowOpacity(f);
}
void Widget::on_pushButton_sub_clicked()
{
float f = this->windowOpacity();
f-=0.1;//增加透明度
this->setWindowOpacity(f);
}
运行结果:
7、cursor
cursor属性表示鼠标的样式,即当鼠标移至控件内时,鼠标的样式会变成该控件cursor属性的样式,可以在ui文件中看到cursor内置的样式:
此外,Qt还提供了关于cursor属性的三个函数,介绍如下:
cursor()
//获取到当前控件的cursor属性, 返回QCursor对象
//当⿏标悬停在该控件上时, 就会显⽰出对应的形状.
setCursor(const QCursor& cursor)
//设置⿏标停留在该控件上的光标形状
QGuiApplication::setOverrideCursor(const QCursor& cursor)
//设置全局光标的形状,对整个程序中的所有控件都会⽣效
//并且覆盖上⾯的 setCursor 设置的内容.
7.1 代码测试cursor
可以对上述设置窗口图标的代码进行添加鼠标图标替换功能,代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QIcon>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QIcon q(":/rose.png");//找到刚刚图标文件的路径
this->setWindowIcon(q);
QPixmap qp(":/rose.png");//用QPixmap的对象来初始化QCursor
qp = qp.scaled(100,100);//缩小光标大小
QCursor qc(qp);
this->setCursor(qc);//设置widget窗口内的鼠标图标
}
Widget::~Widget()
{
delete ui;
}
运行结果(由于电脑截图不方便看出效果,因此用手机拍摄):
8、font
font表示控件内的字体属性,可以在ui界面中查看font都有哪些属性:
而在代码中Qt提供两个关于font的函数,介绍如下:
font()
//获取当前控件的字体信息,这些信息都被保存在QFont里
setFont(const QFont& font)
//传入QFont类型的对象,以设置当前控件的字体信息
8.1 代码测试font
因此需要对控件中的字体做样式修改,则需要先定义一个QFont对象,在该对象中把各属性的样式都设置好,然后用控件调用setFont函数,并把该对象传给setFont,代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QLabel>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QLabel* label = new QLabel(this);
label->setText("hello Qt");
QFont qf;
qf.setFamily("微软雅黑");
qf.setPixelSize(40);
qf.setUnderline(true);
label->setFont(qf);
}
Widget::~Widget()
{
delete ui;
}
测试结果:
9、toolTip
toolTip顾名思义指的是提示,即当鼠标悬停在控件上时,会出现一个小框框,框里的内容就是自定义的提示说明。并且Qt提供了两个操作toolTip的函数,介绍如下:
setToolTip() 设置悬停时的提⽰说明
setToolTipDuring() 设置提示说明的显示时间,单位毫秒
9.1 代码测试toolTip
代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QPushButton>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QPushButton* p = new QPushButton("按钮",this);
p->move(300,300);
p->setToolTip("这是一个普通的按钮");
p->setToolTipDuration(5000);//该提示在5秒后消散
}
Widget::~Widget()
{
delete ui;
}
测试结果:
10、focusPolicy
focusPolicy表示焦点政策,该属性表示某个控件能否被⿏标选中或者能否通过tab键选中,比如输入数据至输入框时,首先得用鼠标点击输入框,这个过程就是焦点的选中。当然,输入框默认可以被tab键和鼠标选中,但是label这样的控件默认就是无法选中焦点的。
Qt提供关于focusPolicy函数的介绍如下:
focusPolicy()//获取控件的焦点,返回值是FocusPolicy,是一个枚举类型
setFocusPolicy(Qt::FocusPolicy policy) 设置控件的焦点政策
首先,FocusPolicy类型有如下常量:
• Qt::NoFocus :控件不会接收焦点• Qt::TabFocus :控件可以通过Tab键接收焦点• Qt::ClickFocus :控件可以通过⿏标点击接收焦点• Qt::StrongFocus :控件可以通过Tab键和⿏标点击接收焦点 (默认值)• Qt::WheelFocus : 类似于 Qt::StrongFocus , 同时控件也通过⿏标滚轮获取到焦点 (新增的选项, ⼀般很少使⽤).
10.1 代码测试focusPolicy
创建一个单行输入框,默认该输入框是可以获得鼠标焦点以及键盘tap焦点的,如下图:
通过代码可以对该输入框的焦点政策做修改,代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QLineEdit>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QLineEdit* q = new QLineEdit(this);
q->move(300,300);
q->setFocusPolicy(Qt::NoFocus);//设置该控件不能获取到焦点
}
Widget::~Widget()
{
delete ui;
}
运行结果:
11、styleSheet
该属性支持QSS对控件的样式进行设置,QSS是CSS的一部分。CSS (Cascading Style Sheets 层叠样式表) 本⾝属于网页前端技术,主要就是用来描述界面的样式,只不过CSS的样式更为丰富,因此Qt同样支持了CSS,不过只支持了其一部分,因此称为QSS。
其中Qt也提供了一个函数,可以通过该函数完成QSS的样式修改,该函数介绍如下:
QString styleSheet() const//返回当前控件的样式,以字符串的形式返回
void setStyleSheet(const QString &styleSheet)//设置当前控件的样式
11.1 代码测试styleSheet
这里对QString的格式有要求,即:使用键值对的方式设置样式,其中键和值之间使用 : 分割,:左边是属性,右边是样式。多个键值对之间使⽤ ; 分割。测试代码如下:
#include "widget.h"
#include "ui_widget.h"
#include <QPushButton>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QPushButton* p = new QPushButton("QSS",this);
p->setStyleSheet("color:blue;background-color:green;font-style:italic");
}
Widget::~Widget()
{
delete ui;
}
测试结果:
结语
以上就是关于QWidget的属性介绍,QWidget是Qt控件中核心的一个类,他提供了控件所需的基本功能,比如尺寸、位置、字体、等基本属性,以及焦点获取(如鼠标点击、键盘输入等)的能力,控件必须有这些属性才能真正意义上的成为一个控件。理解QWidget的基本属性是掌握使用控件的基本条件之一。
最后如果本文有遗漏或者有误的地方欢迎大家在评论区补充,谢谢大家!!