
02_Qt教案 控件篇
本文最后更新于 2025-02-20,学习久了要注意休息哟
第一章 Qt控件-按钮组件
1.1 按钮基类 QAbstractButton
后面两个基本上不用
1.1.1 常用API介绍
// 获取和设置按钮的文本
QString text() const
void setText(const QString &text)
// 获取和设置按钮的图标
QIcon icon() const
void setIcon(const QIcon &icon)
// 获取和设置样式表
// 这是继承自QWidget类的属性和方法
// 只要继承自QWidget类的控件,都有该属性
QString styleSheet() const
void setStyleSheet(const QString &styleSheet)
1.1.2 设定 Check 属性
常见状态
按钮通常有三种常见的状态:
- Normal: 普通状态,按钮没有与鼠标做任何接触。
- Hover: 悬停状态,鼠标位于按钮之上,但并未按下。
- Pressed: 按压状态,鼠标键在按钮上处于按下状态。
默认情况下,按钮的状态转换如下:
- 鼠标按下时,按钮从
Normal
切换到Pressed
状态。 - 鼠标释放时,按钮从
Pressed
恢复到Normal
状态。
Check 属性状态
当按钮具有 checkable
属性时,行为会发生变化:
- 鼠标按下后,按钮进入
Pressed
状态,但释放鼠标时,按钮依然保持在Pressed
状态。 - 需要再次点击按钮才能恢复到
Normal
状态。 - 具有
checkable
属性的按钮类似一个开关,每次点击才能切换状态。
// 判断按钮是否设置了 checkable 属性
// 默认情况下此属性是关闭的 (not checkable)
bool QAbstractButton::isCheckable() const;
// 设置按钮的 checkable 属性
// 参数为 true: 点击按钮时,按钮被选中,松开鼠标时按钮不弹起
// 参数为 false: 点击按钮时,按钮被选中,松开鼠标时按钮会恢复原状态
void QAbstractButton::setCheckable(bool);
// 判断按钮是否被选中
bool QAbstractButton::isChecked() const;
// 设置按钮的选中状态:true - 选中,false - 未选中
// 必须先设置 checkable 属性才能使用该方法
void QAbstractButton::setChecked(bool);
1.1.3 槽函数API介绍
// 模拟按钮点击效果,并在指定的毫秒数 msec 后触发 clicked 信号。默认值为 100 毫秒。
[slot] void QAbstractButton::animateClick(int msec = 100)
// 模拟按钮点击,直接触发 clicked 信号。
[slot] void QAbstractButton::click()
// 切换按钮的选中状态,并触发 toggled 信号。
[slot] void QAbstractButton::toggle()
// 设置按钮的选中状态。 true 表示选中,false 表示未选中。
[slot] void QAbstractButton::setChecked(bool checked)
// 设置按钮图标的大小。
[slot] void QAbstractButton::setIconSize(const QSize &size)
1.1.4 信号API 介绍
// 当按钮被点击时发出信号,参数 `checked` 表示按钮的选中状态,默认值为 false。
[signal] void QAbstractButton::clicked(bool checked = false)
// 当按钮被按下时发出信号。
[signal] void QAbstractButton::pressed()
// 当按钮被释放时发出信号。
[signal] void QAbstractButton::released()
// 当按钮的选中状态发生变化时发出信号,参数 `checked` 表示按钮的当前选中状态。
[signal] void QAbstractButton::toggled(bool checked)
1.2 QPushButton 普通按钮
扁平化就是没有边框
1.2.1 常用API 介绍
1、构造函数
// 构造函数
/*
参数:
- icon: 按钮上显示的图标
- text: 按钮上显示的标题
- parent: 按钮的父对象, 可以不指定
*/
QPushButton::QPushButton(const QIcon &icon, const QString &text, QWidget *parent = nullptr);
QPushButton::QPushButton(const QString &text, QWidget *parent = nullptr);
QPushButton::QPushButton(QWidget *parent = nullptr);
2、特殊功能
// 一般在对话框窗口中使用, 将按钮设置为默认按钮, 自动关联 Enter 键
void setDefault(bool);
// 判断按钮是不是默认按钮
bool isDefault() const;
/*
将弹出菜单菜单与此按钮关联起来。这将把按钮变成一个菜单按钮,
在某些样式中会在按钮文本的右边产生一个小三角形。
*/
void QPushButton::setMenu(QMenu *menu);
/*
显示(弹出)相关的弹出菜单。如果没有这样的菜单,这个函数什么也不做。
这个函数直到弹出菜单被用户关闭后才返回。
*/
[slot] void QPushButton::showMenu();
1.2.2 示例程序
- 普通按钮,显示文本和图标
- 设置 Check 属性
- 设置 菜单 属性
- 设置按钮按下图标变化
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QIcon>
#include <QSize>
#include <QDebug>
#include <QMenu>
#include <QAction>
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
, ui(new Ui::MainWindow)
{
ui->setupUi(this);
// ============================== 设置按钮的特性 ==============================
// 1、设置按钮的图标
ui->Button_1->setIcon(QIcon("D:\\img\\img_16.png")); // 设置图标
ui->Button_1->setText("小猫咪"); // 设置标题
ui->Button_1->setIconSize(QSize(100 , 100)); // 设置图标大小
ui->Button_1->resize(QSize(100,100)); // 设置按钮大小
// 一般不用
ui->Button_1->setStyleSheet("text-align: left; padding: 5px;"); // 设置方向 通过样式表
// 2、设置 Check 属性
ui->Button_2->setCheckable(true); // 设置为 check 属性
ui->Button_2->setChecked(true); // 设置为 常闭 属性
connect(ui->Button_2 , &QPushButton::toggled , this , [=](bool checked){
qDebug() << "Check 按钮 当前状态为 :" << checked;
});
// 3、设置 菜单 属性
ui->Button_3->setText("菜单"); // 设置标题
QMenu * menu = new QMenu; // 创建菜单
menu->addAction("打开"); // 创建菜单项
menu->addAction("关闭"); // 创建菜单项
ui->Button_3->setMenu(menu); // 设定菜单
// 4、设置按钮图标
// 设置不同状态的图标
Icon_1.addFile(":/img/img_12.png");
Icon_2.addFile(":/img/img_13.png");
ui->Button_4->setIcon(Icon_2);
connect(ui->Button_4 , &QPushButton::released , this , [&](){
qDebug() << "松开了";
ui->Button_4->setIcon(Icon_1);
});
connect(ui->Button_4 , &QPushButton::pressed , this , [&](){
qDebug() << "按下了";
ui->Button_4->setIcon(Icon_2);
});
}
MainWindow::~MainWindow()
{
delete ui;
}
1.3 QToolButton 工具按钮
整体上和 QPushButton
没有太多的区别,只是在原本的基础上做了一些增强
1.3.1 常用 API 介绍
// 构造函数
QToolButton::QToolButton(QWidget *parent = nullptr);
// 公共成员函数
/*
1. 将给定的菜单与此工具按钮相关联。
2. 菜单将根据按钮的弹出模式显示。
3. 菜单的所有权没有转移到“工具”按钮(不能建立父子关系)
*/
void QToolButton::setMenu(QMenu *menu);
// 返回关联的菜单,如果没有定义菜单,则返回nullptr。
QMenu *QToolButton::menu() const;
/*
弹出菜单的弹出模式是一个枚举类型: QToolButton::ToolButtonPopupMode, 取值如下:
- QToolButton::DelayedPopup:
- 延时弹出, 按压工具按钮一段时间后才能弹出, 比如:浏览器的返回按钮
- 长按按钮菜单弹出, 但是按钮的 clicked 信号不会被发射
- QToolButton::MenuButtonPopup:
- 在这种模式下,工具按钮会显示一个特殊的箭头,表示有菜单。
- 当按下按钮的箭头部分时,将显示菜单。按下按钮部分发射 clicked 信号
- QToolButton::InstantPopup:
- 当按下工具按钮时,菜单立即显示出来。
- 在这种模式下,按钮本身的动作不会被触发(不会发射clicked信号
*/
// 设置弹出菜单的弹出方式
void setPopupMode(QToolButton::ToolButtonPopupMode mode);
// 获取弹出菜单的弹出方式
QToolButton::ToolButtonPopupMode popupMode() const;
/*
QToolButton可以帮助我们在按钮上绘制箭头图标, 是一个枚举类型, 取值如下:
- Qt::NoArrow: 没有箭头
- Qt::UpArrow: 箭头向上
- Qt::DownArrow: 箭头向下
- Qt::LeftArrow: 箭头向左
- Qt::RightArrow: 箭头向右
*/
// 显示一个箭头作为QToolButton的图标。默认情况下,这个属性被设置为Qt::NoArrow。
void setArrowType(Qt::ArrowType type);
// 获取工具按钮上显示的箭头图标样式
Qt::ArrowType arrowType() const;
///////////////////////////// 槽函数 /////////////////////////////
// 给按钮关联一个QAction对象, 主要目的是美化按钮
[slot] void QToolButton::setDefaultAction(QAction *action);
// 返回给按钮设置的QAction对象
QAction *QToolButton::defaultAction() const;
/*
图标的显示样式是一个枚举类型->Qt::ToolButtonStyle, 取值如下:
- Qt::ToolButtonIconOnly: 只有图标, 不显示文本信息
- Qt::ToolButtonTextOnly: 不显示图标, 只显示文本信息
- Qt::ToolButtonTextBesideIcon: 文本信息在图标的后边显示
- Qt::ToolButtonTextUnderIcon: 文本信息在图标的下边显示
- Qt::ToolButtonFollowStyle: 跟随默认样式(只显示图标)
*/
// 设置的这个属性决定工具按钮是只显示一个图标、只显示文本,还是在图标旁边/下面显示文本。
[slot] void QToolButton::setToolButtonStyle(Qt::ToolButtonStyle style);
// 返回工具按钮设置的图标显示模式
Qt::ToolButtonStyle toolButtonStyle() const;
// 显示相关的弹出菜单。如果没有这样的菜单,这个函数将什么也不做。这个函数直到弹出菜单被用户关闭才会返回。
[slot] void QToolButton::showMenu();
1.4 QRadioButton 单选按钮
全部继承了父类的特性,没有自己的参数,文档中也只提供了他们构造函数。。。。
纯啃老选手
1.5 QCheckBox 复选按钮
1.5.1 常用 API 介绍
1、公共函数
// 构造函数
/*
参数:
- text: 按钮上显示的文本信息
- parent: 按钮的父对象
描述:
创建一个 QCheckBox 对象,可以带文本或不带文本,设置父对象以加入父组件布局中。
*/
QCheckBox::QCheckBox(const QString &text, QWidget *parent = nullptr);
QCheckBox::QCheckBox(QWidget *parent = nullptr);
// 判断当前复选框是否为三态复选框
/*
返回值:
- true: 当前复选框是三态复选框 (未选中、半选中、选中)
- false: 当前复选框是普通的两态复选框 (未选中、选中)
默认情况下,复选框为两态复选框。
*/
bool QCheckBox::isTristate() const;
// 设置当前复选框为三态复选框
/*
参数:
- y: 是否设置为三态复选框
- true: 设置为三态复选框
- false: 设置为普通两态复选框
描述:
三态复选框有三种状态:未选中、半选中、选中。通常用于层级复选框的部分选中场景。
*/
void QCheckBox::setTristate(bool y = true);
// 设置复选框按钮的状态
/*
参数:
- state: 按钮的状态,枚举类型 Qt::CheckState
- Qt::Unchecked: 当前复选框未选中
- Qt::PartiallyChecked: 当前复选框部分选中(仅三态复选框支持)
- Qt::Checked: 当前复选框选中
描述:
设置复选框的状态为上述三种之一。通常与 `isTristate()` 配合使用。
*/
void QCheckBox::setCheckState(Qt::CheckState state);
// 获取当前复选框的状态
/*
返回值:
- Qt::Unchecked: 当前复选框未选中
- Qt::PartiallyChecked: 当前复选框部分选中
- Qt::Checked: 当前复选框选中
描述:
获取复选框的当前状态。返回值为枚举类型 Qt::CheckState。
*/
Qt::CheckState QCheckBox::checkState() const;
2、信号
// 当复选框的状态改变时发出信号
/*
参数:
- state: 整数值,表示复选框的三种状态之一,参考 Qt::CheckState 枚举:
- Qt::Unchecked: 当前复选框未选中
- Qt::PartiallyChecked: 当前复选框部分选中
- Qt::Checked: 当前复选框选中
描述:
当用户操作复选框,改变其状态时(如选中、取消选中、设置为部分选中),会触发此信号。
*/
[signal] void QCheckBox::stateChanged(int state);
1.5.2 示例程序
三态按钮
注意 : 读者对着代码的逻辑抄 可以去做简化 能跑最好就别动代码 😎
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QIcon>
#include <QSize>
#include <QDebug>
#include <QMenu>
#include <QAction>
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
, ui(new Ui::MainWindow)
{
ui->setupUi(this);
// ============================== 设置按钮的特性 ==============================
// 设置一个为三态模式 checkBox_1
ui->checkBox_1->setTristate(true);
}
MainWindow::~MainWindow()
{
delete ui;
}
// 更新主选项函数
void MainWindow::updateMainCheckBox()
{
// 检查子复选框的状态
bool allChecked = Box_arr[0] && Box_arr[1] && Box_arr[2]; // 全部选中
bool allUnchecked = !Box_arr[0] && !Box_arr[1] && !Box_arr[2]; // 全部未选中
if (allChecked) {
ui->checkBox_1->setCheckState(Qt::Checked); // 全选
} else if (allUnchecked) {
ui->checkBox_1->setCheckState(Qt::Unchecked); // 全不选
} else {
ui->checkBox_1->setCheckState(Qt::PartiallyChecked); // 部分选中
}
}
void MainWindow::on_checkBox_1_clicked()
{
// 当前状态
Qt::CheckState state = ui->checkBox_1->checkState();
// 判断状态并执行逻辑
if (state == Qt::Checked || state == Qt::PartiallyChecked) {
qDebug() << "切换到选中状态";
ui->checkBox_1->setCheckState(Qt::Checked); // 强制设置为选中
// 将其他选项设置为选中状态
ui->checkBox_2->setCheckState(Qt::Checked);
ui->checkBox_3->setCheckState(Qt::Checked);
ui->checkBox_4->setCheckState(Qt::Checked);
} else if (state == Qt::Unchecked) {
qDebug() << "切换到未选中状态";
ui->checkBox_1->setCheckState(Qt::Unchecked); // 强制设置为未选中
ui->checkBox_2->setCheckState(Qt::Unchecked);
ui->checkBox_3->setCheckState(Qt::Unchecked);
ui->checkBox_4->setCheckState(Qt::Unchecked);
}
}
void MainWindow::on_checkBox_2_stateChanged(int arg1)
{
// 未选中状态
if(arg1 == Qt::Unchecked)
{
Box_arr[0] = 0;
// 更新状态
this->updateMainCheckBox();
}
// 选中状态
if(arg1 == Qt::Checked)
{
Box_arr[0] = 1;
// 更新状态
this->updateMainCheckBox();
}
}
void MainWindow::on_checkBox_3_stateChanged(int arg1)
{
// 未选中状态
if(arg1 == Qt::Unchecked)
{
Box_arr[1] = 0;
// 更新状态
this->updateMainCheckBox();
}
// 选中状态
if(arg1 == Qt::Checked)
{
Box_arr[1] = 1;
// 更新状态
this->updateMainCheckBox();
}
}
void MainWindow::on_checkBox_4_stateChanged(int arg1)
{
// 未选中状态
if(arg1 == Qt::Unchecked)
{
Box_arr[2] = 0;
// 更新状态
this->updateMainCheckBox();
}
// 选中状态
if(arg1 == Qt::Checked)
{
Box_arr[2] = 1;
// 更新状态
this->updateMainCheckBox();
}
}
第二章 Qt控件-容器组件
2.1 QWidget 窗口
2.2 QFrame 窗口
QFrame
类 是继承了 QWidget
类,并且 QFrame
是 QWidget
的加强版本 , 这种类型的容器窗口可以提供边框, 并且可以设置边框的样式、宽度以及边框的阴影。
2.2.1 API 介绍
/*
边框形状为布尔类型, 可选项为:
- QFrame::NoFrame: 没有边框
- QFrame::Box: 绘制一个框
- QFrame::Panel: 绘制一个面板,使内容显示为凸起或凹陷
- QFrame::StyledPanel: 绘制一个外观取决于当前GUI样式的矩形面板。它可以上升也可以下沉。
- QFrame::HLine: 画一条没有边框的水平线(用作分隔符)
- QFrame::VLine: 画一条没有边框的垂直线(用作分隔符)
- QFrame::WinPanel: 绘制一个矩形面板,可以像Windows 2000那样向上或向下移动。
指定此形状将线宽设置为2像素。WinPanel是为了兼容而提供的。
对于GUI风格的独立性,我们建议使用 StyledPanel 代替。
*/
// 获取边框形状
Shape frameShape() const;
// 设置边框形状
void setFrameShape(Shape);
/*
Qt中关于边框的阴影(QFrame::Shadow)提供了3种样式, 分别为:
- QFrame::Plain: 简单的,朴素的, 框架和内容与周围环境显得水平;
使用调色板绘制QPalette::WindowText颜色(没有任何3D效果)
- QFrame::Raised: 框架和内容出现凸起;使用当前颜色组的明暗颜色绘制3D凸起线
- QFrame::Sunken: 框架及内容物凹陷;使用当前颜色组的明暗颜色绘制3D凹线
*/
// 获取边框阴影样式
Shadow frameShadow() const;
// 设置边框阴影样式
void setFrameShadow(Shadow);
// 得到边框线宽度
int lineWidth() const;
// 设置边框线宽度, 默认值为1
void setLineWidth(int);
// 得到中线的宽度
int midLineWidth() const;
// 设置中线宽度, 默认值为0, 这条线会影响边框阴影的显示
void setMidLineWidth(int);
2.3 QGroupBox 窗口
如下
2.3.1 API 介绍
// 构造函数
QGroupBox::QGroupBox(QWidget *parent = Q_NULLPTR);
QGroupBox::QGroupBox(const QString &title, QWidget *parent = Q_NULLPTR);
// 公共成员函数
bool QGroupBox::isCheckable() const;
// 设置是否在组框中显示一个复选框
void QGroupBox::setCheckable(bool checkable);
/*
关于对齐方式需要使用枚举类型 Qt::Alignment, 其可选项为:
- Qt::AlignLeft: 左对齐(水平方向)
- Qt::AlignRight: 右对齐(水平方向)
- Qt::AlignHCenter: 水平居中
- Qt::AlignJustify: 在可用的空间内调整文本(水平方向)
- Qt::AlignTop: 上对齐(垂直方向)
- Qt::AlignBottom: 下对齐(垂直方向)
- Qt::AlignVCenter: 垂直居中
*/
Qt::Alignment QGroupBox::alignment() const;
// 设置组框标题的对其方式
void QGroupBox::setAlignment(int alignment);
QString QGroupBox::title() const;
// 设置组框的标题
void QGroupBox::setTitle(const QString &title);
bool QGroupBox::isChecked() const;
// 设置组框中复选框的选中状态
[slot] void QGroupBox::setChecked(bool checked);
2.4 QScrollarea 窗口
带滚动条的窗口对象
2.4.1 相关API
// 构造函数
QScrollArea::QScrollArea(QWidget *parent = Q_NULLPTR);
// 公共成员函数
// 给滚动区域设置要显示的子窗口widget
void QScrollArea::setWidget(QWidget *widget);
// 删除滚动区域中的子窗口, 并返回被删除的子窗口对象
QWidget *QScrollArea::takeWidget();
/*
关于显示位置的设定, 是一个枚举类型, 可选项为:
- Qt::AlignLeft: 左对齐
- Qt::AlignHCenter: 水平居中
- Qt::AlignRight: 右对齐
- Qt::AlignTop: 顶部对齐
- Qt::AlignVCenter: 垂直对其
- Qt::AlignBottom: 底部对其
*/
// 获取子窗口在滚动区域中的显示位置
Qt::Alignment alignment() const;
// 设置滚动区域中子窗口的对其方式, 默认显示的位置是右上
void setAlignment(Qt::Alignment);
// 判断滚动区域是否有自动调节小部件大小的属性
bool widgetResizable() const;
/*
1. 设置滚动区域是否应该调整视图小部件的大小, 该属性默认为false, 滚动区域按照小部件的默认大小进行显示。
2. 如果该属性设置为true,滚动区域将自动调整小部件的大小,避免滚动条出现在本可以避免的地方,
或者利用额外的空间。
3. 不管这个属性是什么,我们都可以使用widget()->resize()以编程方式调整小部件的大小,
滚动区域将自动调整自己以适应新的大小。
*/
void setWidgetResizable(bool resizable);
2.5 QToolBox 窗口
2.5.1 API设置
// 构造函数
QToolBox::QToolBox(QWidget *parent = Q_NULLPTR, Qt::WindowFlags f = Qt::WindowFlags());
// 公共成员
/*
addItem(), insertItem()函数相关参数:
- widget: 添加到工具箱中的选项卡对应的子窗口对象
- icon: 工具箱新的选项卡上显示的图标
- text: 工具箱新的选项卡上显示的标题
- index: 指定在工具箱中插入的新的选项卡的位置
*/
// 给工具箱尾部添加一个选项卡, 每个选项卡在工具箱中就是一个子窗口, 即参数widget
int QToolBox::addItem(QWidget *widget, const QString &text);
int QToolBox::addItem(QWidget *widget, const QIcon &icon, const QString &text);
// 在工具箱的指定位置添加一个选项卡, 即添加一个子窗口
int QToolBox::insertItem(int index, QWidget *widget, const QString &text);
int QToolBox::insertItem(int index, QWidget *widget, const QIcon &icon,
const QString &text);
// 移除工具箱中索引index位置对应的选项卡, 注意: 只是移除对应的窗口对象并没有被销毁
void QToolBox::removeItem(int index);
// 设置索引index位置的选项卡是否可用, 参数 enabled=true 为可用, enabled=false为禁用
void QToolBox::setItemEnabled(int index, bool enabled);
// 设置工具箱中index位置选项卡的图标
void QToolBox::setItemIcon(int index, const QIcon &icon);
// 设置工具箱中index位置选项卡的标题
void QToolBox::setItemText(int index, const QString &text);
// 设置工具箱中index位置选项卡的提示信息(需要鼠标在选项卡上悬停一定时长才能显示)
void QToolBox::setItemToolTip(int index, const QString &toolTip);
// 如果位置索引的项已启用,则返回true;否则返回false。
bool QToolBox::isItemEnabled(int index) const;
// 返回位置索引处项目的图标,如果索引超出范围,则返回空图标。
QIcon QToolBox::itemIcon(int index) const;
// 返回位于位置索引处的项的文本,如果索引超出范围,则返回空字符串。
QString QToolBox::itemText(int index) const;
// 返回位于位置索引处的项的工具提示,如果索引超出范围,则返回空字符串。
QString QToolBox::itemToolTip(int index) const;
// 得到当前工具箱中显示的选项卡对应的索引
int QToolBox::currentIndex() const;
// 返回指向当前选项卡对应的子窗口的指针,如果没有这样的项,则返回0。
QWidget *QToolBox::currentWidget() const;
// 返回工具箱中子窗口的索引,如果widget对象不存在,则返回-1
int QToolBox::indexOf(QWidget *widget) const;
// 返回工具箱中包含的项的数量。
int QToolBox::count() const;
// 信号
// 工具箱中当前显示的选项卡发生变化, 该信号被发射, index为当前显示的新的选项卡的对应的索引
[signal] void QToolBox::currentChanged(int index);
// 槽函数
// 通过工具箱中选项卡对应的索引设置当前要显示哪一个选项卡中的子窗口
[slot] void QToolBox::setCurrentIndex(int index);
// 通过工具箱中选项卡对应的子窗口对象设置当前要显示哪一个选项卡中的子窗口
[slot] void QToolBox::setCurrentWidget(QWidget *widget);
2.6 QTabWidget 窗口
2.6.1 API 说明
// 构造函数
QTabWidget::QTabWidget(QWidget *parent = Q_NULLPTR);
// 公共成员函数
/*
添加选项卡addTab()或者插入选项卡insertTab()函数相关的参数如下:
- page: 添加或者插入的选项卡对应的窗口实例对象
- label: 添加或者插入的选项卡的标题
- icon: 添加或者插入的选项卡的图标
- index: 将新的选项卡插入到索引index的位置上
*/
int QTabWidget::addTab(QWidget *page, const QString &label);
int QTabWidget::addTab(QWidget *page, const QIcon &icon, const QString &label);
int QTabWidget::insertTab(int index, QWidget *page, const QString &label);
int QTabWidget::insertTab(int index, QWidget *page,
const QIcon &icon, const QString &label);
// 删除index位置的选项卡
void QTabWidget::removeTab(int index);
// 得到选项卡栏中的选项卡的数量
int count() const;
// 从窗口中移除所有页面,但不删除它们。调用这个函数相当于调用removeTab(),直到选项卡小部件为空为止。
void QTabWidget::clear();
// 获取当前选项卡对应的索引
int QTabWidget::currentIndex() const;
// 获取当前选项卡对应的窗口对象地址
QWidget *QTabWidget::currentWidget() const;
// 返回索引位置为index的选项卡页,如果索引超出范围则返回0。
QWidget *QTabWidget::widget(int index) const;
/*
标签上显示的文本样式为枚举类型 Qt::TextElideMode, 可选项为:
- Qt::ElideLeft: 省略号应出现在课文的开头,例如:.....是的,我很帅。
- Qt::ElideRight: 省略号应出现在文本的末尾,例如:我帅吗.....。
- Qt::ElideMiddle: 省略号应出现在文本的中间,例如:我帅.....很帅。
- Qt::ElideNone: 省略号不应出现在文本中
*/
// 获取标签上显示的文本模式
Qt::TextElideMode QTabWidget::elideMode() const;
// 如何省略标签栏中的文本, 此属性控制在给定的选项卡栏大小没有足够的空间显示项时如何省略项。
void QTabWidget::setElideMode(Qt::TextElideMode);
// 得到选项卡上图标的尺寸信息
QSize QTabWidget::iconSize() const
// 设置选项卡上显示的图标大小
void QTabWidget::setIconSize(const QSize &size)
// 判断用户是否可以在选项卡区域内移动选项卡, 可以返回true, 否则返回false
bool QTabWidget::isMovable() const;
// 此属性用于设置用户是否可以在选项卡区域内移动选项卡。默认情况下,此属性为false;
void QTabWidget::setMovable(bool movable);
// 判断选项卡是否可以自动隐藏, 如果可以自动隐藏返回true, 否则返回false
bool QTabWidget::tabBarAutoHide() const;
// 如果为true,则当选项卡栏包含少于2个选项卡时,它将自动隐藏。默认情况下,此属性为false。
void QTabWidget::setTabBarAutoHide(bool enabled);
// 判断index对应的选项卡是否是被启用的, 如果是被启用的返回true, 否则返回false
bool QTabWidget::isTabEnabled(int index) const;
// 如果enable为true,则在索引位置的页面是启用的;否则,在位置索引处的页面将被禁用。
void QTabWidget::setTabEnabled(int index, bool enable);
// 得到index位置的标签对应的图标
QIcon QTabWidget::tabIcon(int index) const;
// 在位置索引处设置标签的图标。
void QTabWidget::setTabIcon(int index, const QIcon &icon);
/*
选项卡标签的位置通过枚举值进行指定, 可使用的选项如下:
- QTabWidget::North: 北(上), 默认
- QTabWidget::South: 南(下)
- QTabWidget::West: 西(左)
- QTabWidget::East: 东(右)
*/
// 得到选项卡中显示的标签的位置, 即: 东, 西, 南, 北
TabPosition QTabWidget::tabPosition() const;
// 设置选项卡中标签显示的位置, 默认情况下,此属性设置为North。
void QTabWidget::setTabPosition(TabPosition);
/*
选项卡标签的形状通过枚举值进行指定, 可使用的选项如下:
- QTabWidget::Rounded: 标签以圆形的外观绘制。这是默认形状
- QTabWidget::Triangular: 选项卡以三角形外观绘制。
*/
// 获得选项卡标签的形状
TabShape QTabWidget::tabShape() const;
// 设置选项卡标签的形状
void QTabWidget::setTabShape(TabShape s);
// 得到index位置的标签的标题
QString QTabWidget::tabText(int index) const;
// 设置选项卡index位置的标签的标题
void QTabWidget::setTabText(int index, const QString &label);
// 获取index对应的标签页上设置的提示信息
QString QTabWidget::tabToolTip(int index) const;
// 设置选项卡index位置的标签的提示信息(鼠标需要悬停在标签上一定时长才能显示)
void QTabWidget::setTabToolTip(int index, const QString &tip);
// 判断选项卡标签也上是否有关闭按钮, 如果有返回true, 否则返回false
bool QTabWidget::tabsClosable() const;
// 设置选项卡的标签页上是否显示关闭按钮, 该属性默认情况下为false
void QTabWidget::setTabsClosable(bool closeable);
// 判断选项卡栏中是否有滚动按钮, 如果有返回true, 否则返回false
bool QTabWidget::usesScrollButtons() const;
// 设置选项卡栏有许多标签时,它是否应该使用按钮来滚动标签。
// 当一个选项卡栏有太多的标签时,选项卡栏可以选择扩大它的大小,或者添加按钮,让标签在选项卡栏中滚动。
void QTabWidget::setUsesScrollButtons(bool useButtons);
// 判断窗口是否设置了文档模式, 如果设置了返回true, 否则返回false
bool QTabWidget::documentMode() const;
// 此属性保存选项卡小部件是否以适合文档页面的模式呈现。这与macOS上的文档模式相同。
// 不设置该属性, QTabWidget窗口是带边框的, 如果设置了该属性边框就没有了。
void QTabWidget::setDocumentMode(bool set);
信号
// 每当当前页索引改变时,就会发出这个信号。参数是新的当前页索引位置,如果没有新的索引位置,则为-1
[signal] void QTabWidget::currentChanged(int index);
// 当用户单击索引处的选项卡时,就会发出这个信号。index指所单击的选项卡,如果光标下没有选项卡,则为-1。
[signal] void QTabWidget::tabBarClicked(int index)
// 当用户双击索引上的一个选项卡时,就会发出这个信号。
// index是单击的选项卡的索引,如果光标下没有选项卡,则为-1。
[signal] void QTabWidget::tabBarDoubleClicked(int index);
// 此信号在单击选项卡上的close按钮时发出。索引是应该被删除的索引。
[signal] void QTabWidget::tabCloseRequested(int index);
槽函数
// 设置当前窗口中显示选项卡index位置对应的标签页内容
[slot] void QTabWidget::setCurrentIndex(int index);
// 设置当前窗口中显示选项卡中子窗口widget中的内容
[slot] void QTabWidget::setCurrentWidget(QWidget *widget);
第三章 Qt控件-输入组件
3.1 Combo Box
Qt 中的组合框是集按钮和下拉列表于一体的控件,它占用的屏幕空间很小,对应的类是 QComboBox
下拉列表框控件,用于从选项中选择一个值。
editable
// 设置是否允许用户编辑下拉框的文本内容。勾选为 true,否则为 false。
currentText
// 当前选中的文本内容。初始值为 "",表示没有选中任何内容。
currentIndex
// 当前选中的项的索引(从 0 开始)。-1 表示当前没有选中任何项。
maxVisibleItems
// 下拉菜单中可见的最大项目数。默认值为 10。
maxCount
// 下拉框允许的最大项目数。默认值为 2147483647,即基本没有限制。
insertPolicy
// 项目插入策略,定义新项目插入时的位置。
sizeAdjustPolicy
// 调整大小的策略,用于控制 QComboBox 的显示内容宽度。例如:
minimumContentsLength
// 下拉框显示的最小内容长度。默认为 0,表示无特定限制。
iconSize
// 图标的大小(宽 x 高)。默认值为 16 x 16。
duplicatesEnabled
// 是否允许列表中存在重复项目。勾选为 true,否则为 false。
frame
// 控制是否显示边框。勾选为 true 表示显示边框。
modelColumn
// 指定与模型相关的列,用于显示数据。默认为 0。
3.1.1 常用API
1、插入和删除
向组合框 QComboBox
中插入和删除项目,既可以在 QT 设计师界面中操作,也可以通过代码来实现
通过设计师界面
在组合框上右键->【编辑项目…】,在打开的编辑窗口中可以增加删除条目
或者直接双击这个按钮也可以
程序添加
新增条目
// 一次新增一个条目
void addItem(const QString &text, const QVariant &userData = QVariant())
void addItem(const QIcon &icon, const QString &text, const QVariant &userData = QVariant())
// 一次新增多个条目
void addItems(const QStringList &texts)
插入条目
// 一次插入一个条目
void insertItem(int index, const QString &text, const QVariant &userData = QVariant())
void insertItem(int index, const QIcon &icon, const QString &text, const QVariant &userData = QVariant())
// 一次插入一个条目
void insertItems(int index, const QStringList &list)
插入策略
// 获取和设置插入策略
QComboBox::InsertPolicy insertPolicy() const
void setInsertPolicy(QComboBox::InsertPolicy policy)
| 插入策略 | 含义 |
| ——————————- | ————————————– |
| QComboBox::NoInsert | 不插入 |
| QComboBox::InsertAtTop | 作为第一条条目插入(替换原第一条条目) |
| QComboBox::InsertAtCurrent | 替换当前条目 |
| QComboBox::InsertAtBottom | 在最后一个条目之后插入 |
| QComboBox::InsertAfterCurrent | 在当前条目之后插入 |
| QComboBox::InsertBeforeCurrent | 在当前条目之前插入 |
| QComboBox::InsertAlphabetically | 按英文字母顺序插入 |
插入分割符
// 在指定索引位置处插入分隔符
void insertSeparator(int index)
删除条目
// 删除指定索引的条目
void removeItem(int index)
2、文本
当前组合框中当前项的索引和文本
// 获取当前条目的索引和文本
int currentIndex() const
QString currentText() const
// 获取和设置指定索引条目的文本QString itemText(int index) const
void setItemText(int index, const QString &text)
3、图标
还可以给条目添加图标
// 获取和设置对应索引条目的图标
QIcon itemIcon(int index) const
void setItemIcon(int index, const QIcon &icon)
4、信号槽
// 当前选中的条目变化时,会发射这两个信号
void currentIndexChanged(int index)
void currentTextChanged(const QString &text)
3.2 Line Edit
单行文本输入控件,用于输入简单文本。
inputMask
// 设置输入掩码,用于限制用户输入的格式,例如 "0000-0000;_" 表示 4 位数字-4 位数字。
text
// 获取或设置当前输入框的文本内容。初始值为空字符串 ""。
maxLength
// 设置允许输入的最大字符数。默认值为 32767。
frame
// 设置是否显示边框。勾选为 true 表示显示,false 表示隐藏。
echoMode
// 设置输入框的显示模式,例如 Normal、Password 等。
cursorPosition
// 当前光标的位置(从 0 开始)。
alignment
// 设置文本的对齐方式,例如 AlignLeft、AlignCenter 等。
dragEnabled
// 设置是否允许拖拽内容。勾选为 true 表示允许拖拽。
readOnly
// 设置输入框是否为只读模式。勾选为 true 表示只读,false 表示可编辑。
placeholderText
// 设置占位符文本,用于提示用户输入内容。
cursorMoveStyle
// 设置光标的移动样式,例如 LogicalMoveStyle 或 VisualMoveStyle。
clearButtonEnabled
// 设置是否显示清除按钮。勾选为 true 表示显示。
3.2.1 常用API
1、文本输入与显示
这些 API 主要用于管理文本框中的文本内容,以及控制文本的展示方式。
// setText(const QString &text)
// 设置文本框中的文本内容。
lineEdit->setText("输入内容");
// text()
// 获取文本框中的文本内容。
QString content = lineEdit->text();
// clear()
// 清空文本框中的内容。
lineEdit->clear();
// setMaxLength(int length)
// 设置文本框的最大输入长度。超过该长度的输入将被忽略。
lineEdit->setMaxLength(20);
// maxLength()
// 获取文本框的最大输入长度。
int maxLen = lineEdit->maxLength();
2、占位字符串
占位字符,就是当文本框中输入内容为空时,显示的字符,用于提示用户文本框中应该输入什么内容
// 获取和设置占位字符串
QString placeholderText() const
void setPlaceholderText(const QString &)
3、对齐方式
用于设置文本框中的内容在水平和垂直两个方向上的对齐方式,比如左对齐、右对齐、上对齐、下对齐、水平居中、垂直居中等。
// 获取和设置文本的对齐方式
Qt::Alignment alignment() const
void setAlignment(Qt::Alignment flag)
其中,Qt::Alignment
是一个枚举,常用取值如下:
| 枚举 | 值 | 含义 |
| ———————————————– | —— | ————————— |
| Qt::AlignLeft | 0x0001 | 水平方向-左对齐 |
| Qt::AlignRight | 0x0002 | 水平方向-右对齐 |
| Qt::AlignHCenter | 0x0004 | 水平方向-居中对齐 |
| Qt::AlignTop | 0x0020 | 垂直方向-上对齐 |
| Qt::AlignBottom | 0x0040 | 垂直方向-下对齐 |
| Qt::AlignVCenter | 0x0080 | 垂直方向-居中对齐 |
| Qt::AlignCenter(AlignVCenter \| AlignHCenter) | 0x0084 | 垂直方向和水平方向-居中对齐 |
上面的每一个宏,都代表 16
进制中的一位,可以进行或(|
)操作,来同时设置多个对齐方式。
该属性,既可以在 Qt 设计师右侧的属性窗口中修改,也可以在代码中动态地获取和修改
4、回显模式
所谓回显模式(EchoMode
),就是输入的内容如何显示
该属性既可以在 Qt 设计师右侧的属性窗口中修改,也可以在代码中动态地获取和修改
// 获取和设置回显模式
QLineEdit::EchoMode echoMode() const
void setEchoMode(QLineEdit::EchoMode)
其中,QLineEdit::EchoMode
是一个宏,有如下 4 个取值:
| 枚举 | 含义 |
| —————————– | ———————————————————— |
| QLineEdit::Normal | 正常模式。 输入什么就显示什么,默认就是这种方式 |
| QLineEdit::Password | 密码模式。 不显示实际输入的字符,而是以小圆圈代替,这样别人就无法看到输入的字符。 |
| QLineEdit::NoEcho | 无回显模式。 无论输入什么内容,在文本框中都不会显示,这样别人既无法看到输入的内容,也无法知道输入字符的长度这对于输入密码非常有用,在linux下输入密码时,就是这种模式 |
| QLineEdit::PasswordEchoOnEdit | 正在输入时显示正常模式显示,当失去焦点时以密码模式显示,也就是显示小圆圈 |
5、读写控制
用于设置文本框是否可编辑、是否使能
// 获取和设置文本框的只读属性
bool isReadOnly() const
void setReadOnly(bool)
// 获取和设置文本框的是否使能
bool isEnabled() const
void setEnabled(bool)
注意:设置为只读和设置为禁能,都无法对文本框进行编辑
区别在于,只读时文本框不会置灰,而禁能时文本框会置灰
6、格式控制
用于指定文本框输入特定格式的内容。比如输入电话号码格式的文本,或者输入 IP
地址格式的文本等。
// 设置和获取格式控制
QString inputMask() const
void setInputMask(const QString &inputMask)
接收一个 QString
类型的掩码,常用格式如下:
接收一个 QString
类型的掩码,常用格式如下:
- 无格式
// 接受任何字符的输入
setInputMask("");
- 电话号码
// 9 - 表示要求输入0-9的数字
// ;# - 表示格式字符串结束,并且未输入时显示#
ui->leMask->setInputMask("99999999999;#");
- 密钥
// 9 - 表示要求输入0-9的数字
// ;# - 表示格式字符串结束,并且未输入时显示*
ui->leMask->setInputMask(">AAAAA-AAAAA-AAAAA-AAAAA-AAAAA;*");
其他更多格式使用方法,直接查看 QLineEdit
帮助文档即可,以上仅作为抛砖引玉
7、信号槽
QLineEdit
有多个信号和槽函数,详情可参考官方帮助文档,这里仅演示两个常用的,作为抛砖引玉
// textChanged(const QString &text)
// 当文本框中的文本发生变化时,触发此信号。
connect(lineEdit, &QLineEdit::textChanged, this, [](const QString &text){
qDebug() << "Text changed to: " << text;
});
// editingFinished()
// 当用户编辑完成并按下回车键时,触发此信号。
connect(lineEdit, &QLineEdit::editingFinished, this, [](){
qDebug() << "Editing finished!";
});
3.3 Spin Box
微调框,允许用户按照一定的步长,来增加或减少其中显示的数值
修改微调框数值的方式包括:
- 单击右侧的向上/向下按钮
- 按键盘的向上/向下键
- 在微调框获取焦点时,通过鼠标滚轮的上下滚动
- 当然了,也允许用户手动输入
其中,QSpinBox
用于整数的显示和输入,QDoubleSpinBox
用于浮点数的显示和输入
它们都是 QAbstractSpinBox
的子类,具有大多数相同的属性,只是参数类型不同(一个 int
,一个 double
)
wrapping
// 是否允许值循环。例如,最大值后可以跳转到最小值,勾选为 true 表示启用。
frame
// 控制是否显示边框。勾选为 true 表示显示,false 表示隐藏。
alignment
// 设置文本对齐方式。例如 AlignLeft 或 AlignCenter。
readOnly
// 控制是否只读。勾选为 true 表示只读,false 表示可编辑。
buttonSymbols
// 设置按钮样式,例如 UpDownArrows 表示上下箭头。
accelerated
// 是否支持加速模式,勾选为 true 表示启用快速增加/减少值。
correctionMode
// 设置输入校正模式,例如 CorrectToPreviousValue 表示回退到上一个有效值。
keyboardTracking
// 设置是否允许实时跟踪键盘输入的值变化。勾选为 true 表示启用。
showGroupSeparator
// 是否显示组分隔符(例如 1,000)。勾选为 true 表示显示。
suffix
// 设置后缀文本,例如 "kg"。
prefix
// 设置前缀文本,例如 "$"。
minimum
// 设置允许的最小值。默认值为 0。
maximum
// 设置允许的最大值。默认值为 99。
singleStep
// 设置每次增加或减少的步长。默认值为 1。
stepType
// 设置步长类型,例如 DefaultStepType 表示普通步长。
value
// 当前值。默认值为 0。
displayIntegerBase
// 设置显示整数的基数。例如,10 表示十进制,16 表示十六进制。
3.3.1 常用API
QSpinBox
有很多属性,完整的可查看帮助文档。这里以 QSpinBox
为例,列出常用的属性和方法:
1、值
微调框和值相关的属性包括:当前值、最大值、最小值
// 获取和设置当前值
int value() const
void setValue(int val)
// 获取和设置最大值
int maximum() const
void setMaximum(int max)
// 获取和设置最小值
int minimum() const
void setMinimum(int min)
// 一次设置最大值和最小值
void setRange(int minimum, int maximum)
2、步长
步长是指按右侧上下调整按钮时的单步改变值,也就是按一次,增加或减少的值
// 获取和设置步长
int singleStep() const
void setSingleStep(int val)
3、循环
wrapping` 属性用于设置是否允许循环,比如范围设置为 `0-99
当数值达到 99
时,再点击向上的按钮,此时数值会变为 0
当数值达到 0
时,再点击向下的按钮,此时数值会变为 99
// 获取和设置是否允许循环
bool wrapping() const
void setWrapping(bool w)
4、加速
用于设置数值增加和减少的速度
如果设置为 true
,随着长按向上/向下箭头时间的增加,数值会加速增加/减少。
// 获取和设置是否允许加速
bool isAccelerated() const
void setAccelerated(bool on)
5、前缀、后缀
用于设置微调框的前缀和后缀显示
比如,如果微调框中显示的是重量,可以添加一个 KG
的后缀,如果微调框中显示的是单价,可以添加一个 ¥
的前缀
// 获取和设置前缀
QString prefix() const
void setPrefix(const QString &prefix)
// 获取和设置后缀
QString suffix() const
void setSuffix(const QString &suffix)
6、信号槽
当微调框中的数值发生变化时,会发射 valueChanged
信号
void valueChanged(int i)
3.4 Date Edit
日期选择控件,用于选择和显示日期。
dateTime
// 设置或获取日期和时间的值。默认值为 2000-01-01 00:00:00。
time
// 设置或获取时间部分的值。默认值为 00:00:00。
maximumDateTime
// 设置允许的最大日期时间值。默认值为 9999-12-31 23:59:59。
minimumDateTime
// 设置允许的最小日期时间值。默认值为 1752-09-14 00:00:00。
maximumDate
// 设置允许的最大日期值。默认值为 9999-12-31。
minimumDate
// 设置允许的最小日期值。默认值为 1752-09-14。
maximumTime
// 设置允许的最大时间值。默认值为 23:59:59。
minimumTime
// 设置允许的最小时间值。默认值为 00:00:00。
currentSection
// 获取或设置当前编辑的部分,例如 YearSection、MonthSection 等。
displayFormat
// 设置显示的日期时间格式,例如 yyyy-MM-dd。
calendarPopup
// 设置是否显示日历弹出框。勾选为 true 表示启用。
currentSectionIndex
// 获取当前编辑部分的索引(从 0 开始)。
timeSpec
// 设置时间的规范,例如 LocalTime 或 UTC。
date
// 设置或获取日期部分的值。默认值为 2000-01-01。
3.4.1 常用API
// QDateTimeEdit 常用 API 介绍
// setDateTime(const QDateTime &dateTime)
// 设置日期和时间的值。
dateTimeEdit->setDateTime(QDateTime::currentDateTime());
// dateTime() const
// 获取当前日期和时间的值。
QDateTime currentDateTime = dateTimeEdit->dateTime();
// setDate(const QDate &date)
// 设置日期的值。
dateTimeEdit->setDate(QDate(2024, 11, 18));
// date() const
// 获取当前的日期值。
QDate currentDate = dateTimeEdit->date();
// setTime(const QTime &time)
// 设置时间的值。
dateTimeEdit->setTime(QTime(10, 30, 0));
// time() const
// 获取当前的时间值。
QTime currentTime = dateTimeEdit->time();
// setMinimumDateTime(const QDateTime &dateTime)
// 设置允许的最小日期时间值。
dateTimeEdit->setMinimumDateTime(QDateTime(QDate(2000, 1, 1), QTime(0, 0, 0)));
// setMaximumDateTime(const QDateTime &dateTime)
// 设置允许的最大日期时间值。
dateTimeEdit->setMaximumDateTime(QDateTime(QDate(2099, 12, 31), QTime(23, 59, 59)));
// setDisplayFormat(const QString &format)
// 设置日期时间的显示格式。
dateTimeEdit->setDisplayFormat("yyyy-MM-dd HH:mm:ss");
// setCalendarPopup(bool enable)
// 设置是否显示日历弹出框。
dateTimeEdit->setCalendarPopup(true);
信号值
// 当滑块被按下时发射该信号
void sliderPressed();
// 当滑块移动时发射该信号
void sliderMoved(int value);
// 当滑块释放时发射该信号
void sliderReleased();
// 当滑动条的值改变时,发射该信号
void valueChanged(int value);
3.5 Horizontal Slider
水平滑块控件,用于调整值的范围。
minimum
// 滑块允许的最小值。默认值为 0。
maximum
// 滑块允许的最大值。默认值为 99。
singleStep
// 设置滑块每次微调的步长值。例如,值为 1 表示滑块每次移动 1 个单位。
pageStep
// 设置滑块每次页面滚动的步长值。例如,值为 10 表示每次页面滚动移动 10 个单位。
value
// 当前滑块的数值。默认值为 0。
sliderPosition
// 当前滑块的位置(从 0 开始)。
tracking
// 设置是否在拖动滑块时实时更新值。勾选为 true 表示启用。
orientation
// 设置滑块的方向,例如 Horizontal 表示水平滑块,Vertical 表示垂直滑块。
invertedAppearance
// 设置滑块是否反转外观,勾选为 true 表示启用。
invertedControls
// 设置滑块是否反转控制方向,勾选为 true 表示启用。
tickPosition
// 设置刻度的位置。例如:
// NoTicks 表示没有刻度。
// TicksAbove 表示刻度在滑块上方。
// TicksBelow 表示刻度在滑块下方。
// TicksBothSides 表示刻度在滑块两侧。
tickInterval
// 设置刻度之间的间隔值。默认值为 0,表示没有刻度。
3.5.1 常用API
// QSlider 常用 API 介绍
// setTickPosition(QSlider::TickPosition position)
// 设置刻度的位置。
slider->setTickPosition(QSlider::TicksBelow); // 刻度在滑块下方
// setTickInterval(int interval)
// 设置刻度之间的间隔值。
slider->setTickInterval(10); // 每 10 个单位显示一个刻度
// setMinimum(int min)
// 设置滑块的最小值。
slider->setMinimum(0);
// setMaximum(int max)
// 设置滑块的最大值。
slider->setMaximum(100);
// setValue(int value)
// 设置滑块的当前值。
slider->setValue(50);
// value() const
// 获取滑块的当前值。
int currentValue = slider->value();
// setOrientation(Qt::Orientation orientation)
// 设置滑块的方向,例如水平或垂直。
slider->setOrientation(Qt::Horizontal); // 水平滑块
// setSingleStep(int step)
// 设置滑块每次移动的步长。
slider->setSingleStep(5);
// setPageStep(int step)
// 设置滑块每次页面滚动的步长。
slider->setPageStep(10);
3.6 QDial
表盘控件,用于在一定范围内选择一个值,适合旋转或环形调整的场景。
minimum
// 表盘允许的最小值。默认值为 0。
maximum
// 表盘允许的最大值。默认值为 99。
singleStep
// 设置表盘每次微调的步长值。例如,值为 1 表示每次移动 1 个单位。
pageStep
// 设置表盘每次页面滚动的步长值。例如,值为 10 表示每次滚动移动 10 个单位。
value
// 当前表盘的数值。默认值为 0。
sliderPosition
// 当前表盘的位置(从 0 开始)。
tracking
// 设置是否在拖动表盘时实时更新值。勾选为 true 表示启用。
orientation
// 设置表盘的方向,例如 Horizontal 表示水平表盘。
invertedAppearance
// 设置表盘是否反转外观,勾选为 true 表示启用。
invertedControls
// 设置表盘是否反转控制方向,勾选为 true 表示启用。
wrapping
// 设置是否启用环绕模式。勾选为 true 表示启用,表盘可循环。
notchTarget
// 表盘刻度的目标间距(以像素为单位)。默认值为 3.7。
notchesVisible
// 设置是否显示刻度标记。勾选为 true 表示显示。
3.6.1 常用API
// QDial 常用 API 介绍
// setMinimum(int min)
// 设置表盘的最小值。
dial->setMinimum(0);
// setMaximum(int max)
// 设置表盘的最大值。
dial->setMaximum(100);
// setValue(int value)
// 设置表盘的当前值。
dial->setValue(50);
// value() const
// 获取表盘的当前值。
int currentValue = dial->value();
// setSingleStep(int step)
// 设置表盘每次微调的步长。
dial->setSingleStep(5);
// setPageStep(int step)
// 设置表盘每次页面滚动的步长。
dial->setPageStep(10);
// setWrapping(bool enable)
// 设置是否启用环绕模式。
dial->setWrapping(true);
// setNotchTarget(double target)
// 设置刻度目标间距(以像素为单位)。
dial->setNotchTarget(4.0);
// setNotchesVisible(bool visible)
// 设置是否显示刻度标记。
dial->setNotchesVisible(true);
// setTracking(bool enable)
// 设置是否在拖动表盘时实时更新值。
dial->setTracking(true);
// setInvertedAppearance(bool inverted)
// 设置表盘是否反转外观。
dial->setInvertedAppearance(true);
// setInvertedControls(bool inverted)
// 设置表盘是否反转控制方向。
dial->setInvertedControls(true);
第四章 Qt控件-显示组件
4.1 Label
显示文本或图像的控件,用于提供说明性内容。
text
// 设置或获取显示的文本内容。默认值为 "TextLabel"。
textFormat
// 设置文本的格式,例如 AutoText、PlainText、RichText 等。
pixmap
// 设置显示的图片内容。
scaledContents
// 设置图片是否自动缩放以适应控件大小。勾选为 true 表示启用。
alignment
// 设置文本或图片的对齐方式,例如 AlignLeft、AlignRight、AlignCenter。
wordWrap
// 设置是否启用文本自动换行。勾选为 true 表示启用。
margin
// 设置内容与边框之间的间距,单位为像素。默认值为 0。
indent
// 设置文本的缩进。默认值为 -1,表示无缩进。
openExternalLinks
// 设置是否允许打开外部链接。勾选为 true 表示启用。
textInteractionFlags
// 设置文本的交互模式,例如:
// NoTextInteraction:无交互。
// LinksAccessibleByMouse:通过鼠标访问链接。
// TextSelectableByMouse:鼠标可选择文本。
// TextEditable:文本可编辑。
4.1.1 常用API
1、文本设置
// 获取和设置显示的文本
QString text() const;
void setText(const QString &text);
2、对其方式
用于设置标签中的内容在水平和垂直两个方向上的对齐方式,比如左对齐、右对齐、上对齐、下对齐、水平居中、垂直居中等。
// 获取和设置文本的对齐方式
Qt::Alignment alignment() const;
void setAlignment(Qt::Alignment);
| 枚举 | 值 | 含义 |
| ———————————————– | —— | ————————— |
| Qt::AlignLeft | 0x0001 | 水平方向-左对齐 |
| Qt::AlignRight | 0x0002 | 水平方向-右对齐 |
| Qt::AlignHCenter | 0x0004 | 水平方向-居中对齐 |
| Qt::AlignTop | 0x0020 | 垂直方向-上对齐 |
| Qt::AlignBottom | 0x0040 | 垂直方向-下对齐 |
| Qt::AlignVCenter | 0x0080 | 垂直方向-居中对齐 |
| Qt::AlignCenter(AlignVCenter \| AlignHCenter) | 0x0084 | 垂直方向和水平方向-居中对齐 |
上面的每一个宏,都代表 16
进制中的一位,可以进行或(|
)操作,来同时设置多个对齐方式。
该属性,既可以在 Qt 设计师右侧的属性窗口中修改,也可以在代码中动态地获取和修改
3、换行操作
使能换行时,那么标签在缩放时,如果文字可以显示在下一行,就会自动换行
// 获取和设置文本是否允许换行
// 换行时:在 word-breaks处,不会将一个完整的单词显示在两行
bool wordWrap() const; // 判断是否允许换行
void setWordWrap(bool on); // 设置是否允许换行
该属性,既可以在 Qt 设计师右侧的属性窗口中修改,也可以在代码中动态地获取和修改
4、图像
可以获取和设置标签上显示的图像
// 获取和设置显示的图像
const QPixmap *pixmap() const;
void setPixmap(const QPixmap &pixmap);
该属性,既可以在 Qt 设计师右侧的属性窗口中修改,也可以在代码中动态地获取和修改
4.3 Progress Bar
显示任务完成进度的控件,用于指示操作的完成百分比。
4.3.1 常用API
4.4 Calendar Widget
显示和选择日期的控件,常用于日期相关的操作。
4.4.1 常用API
4.5 LCD Number
模拟 LCD 样式的数字显示控件,用于显示数值或计数信息。
#include <QLCDNumber>
4.5.1 常用API
设置 LCD 显示的最大数字个数。
lcd->setDigitCount(5); // 设置显示 5 位数字
显示一个整数值。
lcd->display(123); // 显示整数 123
显示一个浮点值
lcd->display(123.45); // 显示浮动值 123.45
设置 LCD 显示的模式,如常规数字或分隔符。
lcd->setMode(QLCDNumber::Dec); // 设置为十进制模式
第五章 QT控件-项目控件
5.1 QListWidget
Qt 中的列表框控件,对应的类是 QListWidget
它用于显示多个列表项,列表项对应的类是 QListWidgetItem
5.1.1 常用API
1、显示模式
列表框控件,支持两种显示模式:列表模式和图标模式
该属性既可以在属性窗口中设置,也可以在代码中动态设置
// 获取和设置显示模式
QListView::ViewMode viewMode() const
void setViewMode(QListView::ViewMode mode)
QListView::ViewMode
列表模式 QListView::ListMode
图标模式 QListView::IconMode
2、交替背景色
设置相邻行交替显示不同的背景色,便于显示和浏览时的定位
该属性既可以在属性窗口中设置,也可以在代码中动态设置
// 获取和设置交替显示
bool alternatingRowColors() const
void setAlternatingRowColors(bool enable)
3、添加条目
UI设计师界面添加
右键列表框控件,选择【编辑项目】,在打开的对话框中添加和删除条目
代码添加
既可以在 UI 设计师界面添加,也可以通过代码动态添加
// 在尾部添加
void addItem(const QString &label)
void addItem(QListWidgetItem *item)
void addItems(const QStringList &labels)
// 在指定行之前添加
void insertItem(int row, QListWidgetItem *item)
void insertItem(int row, const QString &label)
void insertItems(int row, const QStringList &labels)
// QListWidgetItem 参数的函数,可以为条目指定图标
QListWidgetItem::QListWidgetItem(const QIcon &icon, const QString &text, QListWidget *parent = nullptr, int type = Type)
4、删除条目
列表框中的条目可以删除,以下以删除当前行为例:
// 方法一
QListWidgetItem* item = ui->lwProvince->currentItem();
ui->lwProvince->removeItemWidget(item);
delete item;
// 方法二
int row = ui->lwProvince->currentRow();
QListWidgetItem* item = ui->lwProvince->takeItem(row);
delete item; // 注意:需要手动 delete 掉条目
5、信号槽
当然了,列表控件的信号和槽有很多,大家需要用到其他信号槽时,直接去查看官方文档即可。
// 当条目被单击时,发射该信号
void itemClicked(QListWidgetItem *item);
// 当条目被双击时,发射该信号
void itemDoubleClicked(QListWidgetItem *item);
4、设置对其
当设置为图标模式后,由于文字长度不同,会导致每一项对不齐。
如下,当字段大小不一时,这样显示出来的效果就无法对齐图标,如下:
可以通过设置来调整
5.1.2 示例程序
本案例展示列表框的插入和删除操作、修改操作、显示模式
5.2 QTableWidget
QTableWidget
是 Qt 中的表格控件。
表格控件的第一行称为行表头,用于设置每一列的标题
表格控件的第一列称为列表头,用于设置每一行的标题,通常缺省则默认显示行号
5.2.1 QTableWidget 常用api
1、表格设置
这些 API 用于设置表格的行数、列数以及标题。
// setRowCount(int count)
// 设置表格的行数。
tableWidget->setRowCount(5); // 设置表格行数为 5 行。
// setColumnCount(int count)
// 设置表格的列数。
tableWidget->setColumnCount(3); // 设置表格列数为 3 列。
// setHorizontalHeaderLabels(const QStringList &labels)
// 设置水平标题(列名)。
tableWidget->setHorizontalHeaderLabels(QStringList() << "Name" << "Age" << "Gender");
// setVerticalHeaderLabels(const QStringList &labels)
// 设置垂直标题(行名)。
tableWidget->setVerticalHeaderLabels(QStringList() << "Row 1" << "Row 2" << "Row 3");
自适应列宽
// 获取行表头
QHeaderView *horizontalHeader() const
// 设置列的宽度
void QHeaderView::setSectionResizeMode(QHeaderView::ResizeMode mode)
其中 ResizeMode
是一个枚举,取值如下:
| 枚举 | 值 | 含义 |
| —————————– | —— | —————— |
| HeaderView::Interactive | 0 | 用户可拖动改变列宽 |
| QHeaderView::Fixed | 2 | 固定列宽 |
| QHeaderView::Stretch | 1 | 拉伸自适应列宽大小 |
| QHeaderView::ResizeToContents | 3 | 根据内容设置列宽 |
通常,先整体设置为 QHeaderView::Stretch
, 然后根据需要对单独的列进行设置,如下:
// 1、设置所有列的宽度为自适应,列宽会根据表格窗口大小自动调整
ui->twStudent->horizontalHeader()->setSectionResizeMode(QHeaderView::Stretch);
// 2、将第 0 列设置为固定宽度,不根据内容调整
ui->twStudent->horizontalHeader()->setSectionResizeMode(0, QHeaderView::Fixed);
// 3、为第 0 列设置固定宽度为 80 像素
ui->twStudent->setColumnWidth(0, 80);
选择行为
所谓选择行为,是指当点击一个单元格时,是选中该单元格,还是选中一整行
// 获取和设置选择行为
QAbstractItemView::SelectionBehavior selectionBehavior() const
void setSelectionBehavior(QAbstractItemView::SelectionBehavior behavior)
这是继承自其父类 QAbstractItemView
中的方法
其中 QAbstractItemView::SelectionBehavior
是一个枚举,取值为:
| 枚举 | 值 | 含义 |
| ———————————- | —— | —————- |
| QAbstractItemView::SelectItems
| 0 | 选中单元格 |
| QAbstractItemView::SelectRows
| 1 | 选中单元格所在行 |
| QAbstractItemView::SelectColumns
| 2 | 选中单元格所在列 |
选择模式
所谓选择模式,是指设置表格控件只可选择单行、可选择多行等。
// 获取和设置选择模式
QAbstractItemView::SelectionMode selectionMode() const
void setSelectionMode(QAbstractItemView::SelectionMode mode)
这是继承自其父类 QAbstractItemView
中的方法
其中 QAbstractItemView::SelectionMode
是一个枚举,取值为:
| 枚举 | 值 | 含义 |
| —————————————- | —- | ———————————————————— |
| QAbstractItemView::NoSelection
| 0 | 不可选择 |
| QAbstractItemView::SingleSelection
| 1 | 单行选择,一次只允许选择一行 |
| QAbstractItemView::MultiSelection
| 2 | 多行选择,鼠标单击就可以选择多行 |
| QAbstractItemView::ExtendedSelection
| 3 | 扩展选择,按shift键选中一个范围内的行,ctrl键可以选中不相邻的行 |
| QAbstractItemView::ContiguousSelection
| 4 | 相邻选择,按shift键或ctrl键都可以选中一个范围内的行 |
2、表格操作
这些 API 用于操作表格中的单元格内容、行列的插入和移除。
// setItem(int row, int column, QTableWidgetItem *item)
// 设置指定行列的单元格项。
QTableWidgetItem *item = new QTableWidgetItem("Hello");
tableWidget->setItem(0, 0, item); // 设置第一行第一列的单元格内容为 "Hello"
// item(int row, int column)
// 获取指定行列的单元格项。
QTableWidgetItem *item = tableWidget->item(0, 0); // 获取第一行第一列的单元格项
// removeRow(int row)
// 移除指定的行。
tableWidget->removeRow(1); // 移除第二行
// removeColumn(int column)
// 移除指定的列。
tableWidget->removeColumn(2); // 移除第三列
// clear()
// 清除表格内容(不移除行列)。
tableWidget->clear(); // 清空所有数据
3、表格选择
这些 API 用于控制表格中的选择行为,如选择单元格、行、列等。
// setCurrentCell(int row, int column)
// 设置当前选中的单元格。
tableWidget->setCurrentCell(1, 1); // 设置当前选中的单元格为第二行第二列
// selectRow(int row)
// 选择指定的整行。
tableWidget->selectRow(0); // 选择第一行
// selectColumn(int column)
// 选择指定的整列。
tableWidget->selectColumn(2); // 选择第三列
4、表格获取
这些 API 用于获取和设置表格的项,允许直接操作单元格中的内容。
// currentItem()
// 获取当前选中的单元格项。
QTableWidgetItem *item = tableWidget->currentItem(); // 获取当前选中的单元格项
// item(int row, int column)
// 获取指定行列的单元格项。
QTableWidgetItem *item = tableWidget->item(0, 0); // 获取第一行第一列的单元格项
5、表格样式
这些 API 用于设置表格的样式、显示效果等。
// setStyleSheet(const QString &styleSheet)
// 设置表格的样式表,允许自定义表格的外观。
tableWidget->setStyleSheet("QTableWidget { background-color: lightblue; }");
// setAlternatingRowColors(bool enable)
// 设置是否启用交替行颜色。
tableWidget->setAlternatingRowColors(true); // 启用交替行颜色
```c++
// 获取行表头
QHeaderView *horizontalHeader() const
// 设置列的宽度
void QHeaderView::setSectionResizeMode(QHeaderView::ResizeMode mode)
其中 ResizeMode
是一个枚举,取值如下:
| 枚举 | 值 | 含义 |
| —————————– | —— | —————— |
| HeaderView::Interactive | 0 | 用户可拖动改变列宽 |
| QHeaderView::Fixed | 2 | 固定列宽 |
| QHeaderView::Stretch | 1 | 拉伸自适应列宽大小 |
| QHeaderView::ResizeToContents | 3 | 根据内容设置列宽 |
通常,先整体设置为 QHeaderView::Stretch
, 然后根据需要对单独的列进行设置,如下:
// 1、设置所有列的宽度为自适应,列宽会根据表格窗口大小自动调整
ui->twStudent->horizontalHeader()->setSectionResizeMode(QHeaderView::Stretch);
// 2、将第 0 列设置为固定宽度,不根据内容调整
ui->twStudent->horizontalHeader()->setSectionResizeMode(0, QHeaderView::Fixed);
// 3、为第 0 列设置固定宽度为 80 像素
ui->twStudent->setColumnWidth(0, 80);
2、单元格
每个网格单元称为一个单元格。每个单元格有一个行号、列号。
在 QTableWidget
表格控件中,每一个单元格是一个 QTableWidgetItem
对象,可以设置其文字内容等。
获取和设置单元格
// 获取和设置指定行列位置的单元格
QTableWidgetItem * item(int row, int column) const;
void setItem(int row, int column, QTableWidgetItem *item)
// 构造 QTableWidgetItem
QTableWidgetItem(const QIcon &icon, const QString &text, int type = Type)
QTableWidgetItem(const QString &text, int type = Type)
单元格文本对齐方式
// 获取和设置单元格文本的对齐方式
int textAlignment() const
void setTextAlignment(int alignment)
其中,Qt::Alignment
是一个枚举,常用取值如下:
| 枚举 | 值 | 含义 |
| ———————————————– | —— | ————————— |
| Qt::AlignLeft | 0x0001 | 水平方向-左对齐 |
| Qt::AlignRight | 0x0002 | 水平方向-右对齐 |
| Qt::AlignHCenter | 0x0004 | 水平方向-居中对齐 |
| Qt::AlignTop | 0x0020 | 垂直方向-上对齐 |
| Qt::AlignBottom | 0x0040 | 垂直方向-下对齐 |
| Qt::AlignVCenter | 0x0080 | 垂直方向-居中对齐 |
| Qt::AlignCenter(AlignVCenter \| AlignHCenter) | 0x0084 | 垂直方向和水平方向-居中对齐 |
上面的每一个宏,都代表 16
进制中的一位,可以进行或(|
)操作,来同时设置多个对齐方式。
单元格是否可编辑
// 获取和设置单元格是否可编辑
QAbstractItemView::EditTriggers editTriggers() const
void setEditTriggers(QAbstractItemView::EditTriggers triggers)
这是继承自其父类 QAbstractItemView
中的方法
其中,QAbstractItemView::EditTriggers
是一个枚举,常用取值如下:
| 枚举 | 值 | 含义 |
| ———————————— | —— | ——————————————- |
| AbstractItemView::NoEditTriggers
| 0 | 不可编辑 |
| QAbstractItemView::CurrentChanged
| 1 | 当切换单元格时 |
| QAbstractItemView::DoubleClicked
| 2 | 当双击单元格时 |
| QAbstractItemView::SelectedClicked
| 4 | 当单击一个已选中的单元格时 |
| QAbstractItemView::EditKeyPressed
| 8 | 当一个单元格获取焦点,按编辑按键时(F2) |
| QAbstractItemView::AnyKeyPressed
| 16 | 当一个单元格获取焦点,按任意键时 |
| QAbstractItemView::AllEditTriggers
| 31 | 以上所有条件的组合。(31 = 1\|2\|4\|8\|16) |
5.2.2 QTableWidgetItem常用API
相关属性
text
// 获取或设置单元格项的文本内容。
background
// 获取或设置单元格项的背景颜色。
foreground
// 获取或设置单元格项的前景颜色(文本颜色)。
flags
// 获取或设置单元格项的标志,控制单元格项的行为(例如是否可编辑)。
常用和API
// setText(const QString &text)
// 设置单元格项的文本内容。
QTableWidgetItem *item = new QTableWidgetItem();
item->setText("Hello World"); // 设置文本内容为 "Hello World"
// text()
// 获取单元格项的文本内容。
QString text = item->text(); // 获取单元格项的文本
// setBackground(const QBrush &brush)
// 设置单元格项的背景颜色。
item->setBackground(QBrush(Qt::yellow)); // 设置背景颜色为黄色
// background()
// 获取单元格项的背景颜色。
QBrush bg = item->background(); // 获取单元格项的背景颜色
// setForeground(const QBrush &brush)
// 设置单元格项的文本颜色。
item->setForeground(QBrush(Qt::red)); // 设置文本颜色为红色
// foreground()
// 获取单元格项的文本颜色。
QBrush fg = item->foreground(); // 获取单元格项的文本颜色
// setFlags(Qt::ItemFlags flags)
// 设置单元格项的标志,控制其行为(例如是否可编辑)。
item->setFlags(item->flags() & ~Qt::ItemIsEditable); // 设置为不可编辑
// flags()
// 获取单元格项的标志。
Qt::ItemFlags flags = item->flags(); // 获取单元格项的标志
// setIcon(const QIcon &icon)
// 设置单元格项的图标。
item->setIcon(QIcon(":/images/icon.png")); // 设置图标
// icon()
// 获取单元格项的图标。
QIcon icon = item->icon(); // 获取单元格项的图标
5.2.3 示例程序
✅ 行表头的设置
✅ 列表头的设置
✅ 交替显示背景色
✅ 单元格可编辑
✅ 设置样式表
✅ 选择行为:单元格选择或行选择
✅ 数据的增删改查
- 感谢你赐予我前进的力量