目录
1、QWidget的核心属性
2、enabled
3、geometry
3.1 代码测试geometry
4、windowTitle
4.1 代码测试windowTitle
5、windowIcon
5.1 QIcon设置图标
5.2 qrc机制
5.3 代码测试windowIcon
6、windowOpacity
6.1 代码测试windowOpacity
7、cursor
7.1 代码测试cursor
8、font
8.1 代码测试font
9、toolTip
9.1 代码测试toolTip
10、focusPolicy
10.1 代码测试focusPolicy
11、styleSheet
11.1 代码测试styleSheet
结语
前言:
控件是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的基本属性是掌握使用控件的基本条件之一。
最后如果本文有遗漏或者有误的地方欢迎大家在评论区补充,谢谢大家!!