当前位置：首页 > article >正文

7.QT-常用控件-QWidget|font|toolTip|focusPolicy|styleSheet(C++)

article 2026/1/14 3:07:52

font

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

属性	说明
family	字体家族.⽐如"楷体",“宋体”,"微软雅⿊"等.
pointSize	字体⼤⼩
weight	字体粗细.以数值⽅式表⽰粗细程度取值范围为`[0,99]`,数值越⼤,越粗.
bold	是否加粗.设置为true,相当于weight为75.设置为false相当于weight为50.
italic	是否倾斜
underline	是否带有下划线
strikeOut	是否带有删除线

代码⽰例:在Qt Designer中设置字体属性

1)在界⾯上创建⼀个label
![[Pasted image 20250419105315.png]]

2)在右侧的属性编辑区,设置该label的font相关属性
在这⾥调整上述属性,可以实时的看到⽂字的变化.
![[Pasted image 20250419105403.png]]

3)执⾏程序,观察效果
![[Pasted image 20250419105811.png]]

通过属性编辑这样的方式，虽然能够快速方便的修改文字相关的属性，但是还不够灵活如果程序运行过程中，需要修改文字相关的属性～～就需要通过代码来操作了.

代码⽰例:在代码中设置字体属性

#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("这是一段文本");//创建字体对象QFont font;font.setFamily("仿宋");font.setPixelSize(30);font.setBold(true);font.setItalic(true);font.setUnderline(true);font.setStrikeOut(true);//把font对象设置到label中label->setFont(font);
}Widget::~Widget()
{delete ui;
}

![[Pasted image 20250419110416.png]]

toolTip

API	说明
setToolTip	设置toolTip. ⿏标悬停在该widget上时会有提⽰说明.
setToolTipDuring	设置toolTip提⽰的时间.单位ms. 时间到后toolTip⾃动消失.

toolTip只是给⽤⼾看的.在代码中⼀般不需要获取到toolTip.

代码⽰例:设置按钮的toolTip

1)在界⾯上拖放两个按钮. objectName 设置为 pushButton_yes 和 pushButton_no
![[Pasted image 20250419121219.png]]

2)编写widget.cpp

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//设置这两个按钮的toolTipsui->pushButton_yes->setToolTip("这是一个yes按钮");ui->pushButton_yes->setToolTipDuration(3000);ui->pushButton_no->setToolTip("这是一个no按钮");ui->pushButton_no->setToolTipDuration(7000);
}Widget::~Widget()
{delete ui;
}

msec=>毫秒 sec =>秒
usec =>微秒
1s = 1000 ms 1ms = 1000 us
国际单位制 (1000来换算的)
3)运⾏程序,观察效果
可以看到⿏标停到按钮上之后,就能弹出提⽰.时间到后⾃⾏消失.
![[Pasted image 20250419124814.png]]

focusPolicy

设置控件获取到焦点的策略.⽐如某个控件能否⽤⿏标选中或者能否通过tab键选中.

API	说明
focusPolicy()	获取该widget的focusPolicy,返回Qt::FocusPolicy
setFocusPolicy(Qt::FocusPolicy policy)	设置widget的focusPolicy.
Qt::FocusPolicy 是⼀个枚举类型.取值如下

Qt::NoFocus ：控件不会接收键盘焦点
Qt::TabFocus ：控件可以通过Tab键接收焦点
Qt::ClickFocus ：控件在⿏标点击时接收焦点
Qt::StrongFocus ：控件可以通过Tab键和⿏标点击接收焦点(默认值)
Qt::WheelFocus : 类似于 Qt::StrongFocus ,同时控件也通过⿏标滚轮获取到焦点(新增
的选项,⼀般很少使⽤).

代码⽰例:理解不同的focusPolicy

1)在界⾯上创建四个单⾏输⼊框(Line Edit)
![[Pasted image 20250419131551.png]]

2)修改四个输⼊框的 focusPolicy 属性为 Qt::StrongFocus (默认取值,⼀般不⽤额外修改)
可以通过tab和鼠标点击切换输入框
3)修改第⼆个输⼊框的 focusPolicy 为 Qt::NoFocus ,则第⼆个输⼊框不会被tab/⿏标左键选中.
![[Pasted image 20250419132148.png]]

此时这个输⼊框也就⽆法输⼊内容了.
4)修改第⼆个输⼊框 focusPolicy 为 Qt::TabFocus ,则只能通过tab选中,⽆法通过⿏标选中.
5)修改第⼆个输⼊框 focusPolicy 为 Qt::ClickFocus ,则只能通过鼠标选中,⽆法通过tab选中.
![[Pasted image 20250419132506.png]]

styleSheet

通过CSS设置widget的样式.
CSS(Cascading Style Sheets层叠样式表)本⾝属于⽹⻚前端技术.主要就是⽤来描述界⾯的样式.
所谓"样式",包括不限于⼤⼩,位置,颜⾊,间距,字体,背景,边框等.
我们平时看到的丰富多彩的⽹⻚,就都会⽤到⼤量的CSS.
Qt虽然是做GUI开发,但实际上和⽹⻚前端有很多异曲同⼯之处.因此Qt也引⼊了对于CSS的⽀持.
CSS中可以设置的样式属性⾮常多.基于这些属性Qt只能⽀持其中⼀部分,称为QSS(Qt Style Sheet).具体的⽀持情况可以参考Qt⽂档中"Qt Style Sheets Reference"章节.此处只是进⾏⼀个简单的演⽰.

代码⽰例:设置⽂本样式

1)在界⾯上创建label
![[Pasted image 20250419135254.png]]

2)编辑右侧的styleSheet属性,设置样式
![[Pasted image 20250419135234.png]]

有三个点的按钮，或者右键点击label打开样式表
![[Pasted image 20250419135413.png]]

![[Pasted image 20250419135556.png]]

font-family: '微软雅黑';
font-size: 30px;
font-style: italic;
color: green;

此处的语法格式同CSS,使⽤键值对的⽅式设置样式.其中键和值之间使⽤ : 分割.键值对之间使⽤; 分割.
另外,Qt Designer只能对样式的基本格式进⾏校验,不能检测出哪些样式不被Qt⽀持.⽐如 textalign: center 这样的⽂本居中操作,就⽆法⽀持.
编辑完成样式之后,可以看到在Qt Designer中能够实时预览出效果.
![[Pasted image 20250419135818.png]]

3)运⾏程序,可以看到实际效果和预览效果基本⼀致.
![[Pasted image 20250419140039.png]]

代码⽰例:实现切换夜间模式.

1)在界⾯上创建⼀个多⾏输⼊框(Text Edit)和两个按钮.
objectName 分别为 pushButton_light 和 pushButton_dark
![[Pasted image 20250419141718.png]]

2)编写按钮的slot函数.

void Widget::on_pushButton_light_clicked()
{//设置窗口的样式this->setStyleSheet("background-color: white;");//设置输入框的样式ui->textEdit->setStyleSheet("background-color: white; color: black;");//设置按钮的样式ui->pushButton_light->setStyleSheet("color: black;");ui->pushButton_dark->setStyleSheet("color: black;");
}void Widget::on_pushButton_dark_clicked()
{//设置窗口的样式this->setStyleSheet("background-color: black;");//设置输入框的样式ui->textEdit->setStyleSheet("background-color: black; color: white;");//设置按钮的样式ui->pushButton_light->setStyleSheet("color: white;");ui->pushButton_dark->setStyleSheet("color: white;");
}

![[Pasted image 20250419142658.png]]

![[Pasted image 20250419142703.png]]

#333 是深⾊,但是没那么⿊.
#fff 是纯⽩⾊.
#000 是纯⿊⾊.
在线调色板，调色板工具—在线工具
关于计算机中的颜⾊表⽰
计算机中使⽤"像素"表⽰屏幕上的⼀个基本单位(也就是⼀个发亮的光点).
每个光点都使⽤三个字节表⽰颜⾊,分别是R(red),G(green),B(blue)⼀个字节表⽰(取值范围是0-255,或者0x00-0xFF).
混合三种不同颜⾊的数值⽐例,就能搭配出千千万万的颜⾊出来.
rgb(255, 0, 0) 或者 #FF0000 或者 #F00 表⽰纯红⾊.
rgb(0, 255, 0) 或者 #00FF00 或者 #0F0 表⽰纯绿⾊.
rgb(0, 0, 255) 或者 #0000FF 或者 #00F 表⽰纯蓝⾊.
rgb(255, 255, 255) 或者 #FFFFFF 或者 #FFF 表⽰纯⽩⾊.
rgb(0, 0, 0) 或者 #000000 或者 #000 表⽰纯⿊⾊.
当然,上述规则只是针对⼀般的程序⽽⾔是这么设定的.实际的显⽰器,可能有8bit⾊深或者10bit⾊深等,实际情况会更加复杂

void Widget::on_pushButton_light_clicked()
{//设置窗口的样式this->setStyleSheet("background-color: #f3f3f3;");//设置输入框的样式ui->textEdit->setStyleSheet("background-color: #fff; color: black;");//设置按钮的样式ui->pushButton_light->setStyleSheet("color: black;");ui->pushButton_dark->setStyleSheet("color: black;");
}void Widget::on_pushButton_dark_clicked()
{//设置窗口的样式this->setStyleSheet("background-color: #333;");//设置输入框的样式ui->textEdit->setStyleSheet("background-color: #333; color: #fff;");//设置按钮的样式ui->pushButton_light->setStyleSheet("color: white;");ui->pushButton_dark->setStyleSheet("color: white;");
}

![[Pasted image 20250419145223.png]]

![[Pasted image 20250419145229.png]]