【Qt常用控件】输入类控件

文章目录

  • [1. Line Edit](#1. Line Edit)
  • [2. Text Edit](#2. Text Edit)
  • [3. Combo Box](#3. Combo Box)
  • [4. Spin Box](#4. Spin Box)
  • [5. Date Edit & Time Edit](#5. Date Edit & Time Edit)
  • [6. Dial](#6. Dial)
  • [7. Slider](#7. Slider)

1. Line Edit

QLineEdit 用来表示单行输入框. 可以输入一段文本, 但是不能换行.

核心属性

属性 说明
text 输入框中的文本
inputMask 输入内容格式约束
maxLength 最大长度
frame 是否添加边框
echoMode 显示方式. + QLineEdit::Normal :这是默认值,文本框会显示输入的文本。 + QLineEdit::Password :在这种模式下,输入的字符会被隐藏, 通常用星号(*)或等号(=)代替。 + QLineEdit::NoEcho :在这种模式下,文本框不会显示任何输入的字符。
cursorPosition 光标所在位置
alignment 文字对齐方式, 设置水平和垂直方向的对齐.
dragEnabled 是否允许拖拽
readOnly 是否是只读的(不允许修改)
placeHolderText 当输入框内容为空的时候, 显示什么样的提示信息
clearButtonEnabled 是否会自动显示出 "清除按钮" .

核心信号

属性 说明
void cursorPositionChanged(int old, int new) 当鼠标移动时发出此信号,old为先前的位置,new为新位置。
void editingFinished() 当按返回或者回车键时,或者行编辑失去焦点时,发出此信号。
void returnPressed() 当返回或回车键按下时发出此信号. 如果设置了验证器, 必须要验证通过, 才能触发.
void selectionChanged() 当选中的文本改变时,发出此信号。
void textChanged(const QString &text) 当QLineEdit中的文本改变时,发出此信号,text是新的文本。 代码对文本的修改能够触发这个信号.
void textEdited(const QString &text)) 当QLineEdit中的文本改变时,发出此信号,text是新的文本。 代码对文本的修改不能触发这个信号.

代码示例:录入个人信息

在界面上创建三个输入框和两个单选按钮, 一个普通按钮.

三个输入框的 objectName 为 lineEdit_name , lineEdit_password , lineEdit_phone

两个单选按钮的 objectName 为 radioButton_male , radioButton_female

按钮的 objectName 为 pushButton

编写 widget.cpp, 在构造函数中编写初始化代码

cpp 复制代码
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    
    // 初始化第一个输入框
    ui->lineEdit_name->setPlaceholderText("请输入姓名");
    ui->lineEdit_name->setClearButtonEnabled(true);
    
    // 初始化第二个输入框
    ui->lineEdit_password->setPlaceholderText("请输入密码");
    ui->lineEdit_password->setClearButtonEnabled(true);
    ui->lineEdit_password->setEchoMode(QLineEdit::Password);
    
    // 初始化第三个输入框
    ui->lineEdit_phone->setPlaceholderText("请输入电话号码");
    ui->lineEdit_phone->setClearButtonEnabled(true);
    // 验证⼿机号码必须是 11 位数字. 并且按照 "344" 的格式来输入.
    ui->lineEdit_phone->setInputMask("000-0000-0000");
}

继续修改 widget.cpp, 给按钮添加 slot 函数

cpp 复制代码
void Widget::on_pushButton_clicked()
{
    QString gender = ui->radioButton_male->isChecked() ? "男" : "女";
    qDebug() << "姓名: " << ui->lineEdit_name->text()
             << "密码: " << ui->lineEdit_password->text()
             << "性别: " << gender
             << "电话号码: " << ui->lineEdit_phone->text();
}

此处咱们只是进行简单打印,实际开发中可以通过网络把数据发给服务器了.

运行结果:

inputMask 只能进行简单的输入格式校验.

实际开发中, 基于正则表达式的方式是更核心的方法

代码示例:使用正则表达式验证输入框的数据

此处要求在输入框中输入一个合法的电话号码(1 开头, 11 位, 全都是数字). 如果验证不通过, 则确定按钮无法点击.

关于正则表达式

正则表达式是一种在计算机中常用的, 使用特殊字符描述一个字符串的特征的机制. 在进行字符串匹配时非常有用.

正则表达式的语法还比较复杂, 一般都是随用随查, 不需要背下来.参考:

正则表达式文档 正则表达式语法

正则表达式在线工具: 正则表达式语法测试工具 - 在线工具

在界面上创建输入框和一个按钮,把按钮初始 enabled 设为 false

编写 widget.cpp, 给输入框添加验证器.

  • 使用 QRegExp 创建一个正则表达式对象. <font style="color:rgb(31,35,41);">"^1\\d{10}$"</font> 表示 "以 1 开头, 后面跟上任意的10个十进制数字".
  • 使用 QRegExpValidator 创建一个验证器对象. Qt 中内置了四个主要的验证器对象.
cpp 复制代码
#include "widget.h"
#include "ui_widget.h"
#include <QRegExpValidator>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QRegExp regexp("^1\\d{10}$");
    ui->lineEdit->setValidator(new QRegExpValidator(regexp));
}

编写 widget.cpp, 给 lineEdit 添加 textEdited 信号的 slot 函数.

  • on_lineEdit_textEdited 的参数是当前输入框的内容.
  • 通过 lineEdit->validator() 获取到内置的验证器.
  • 通过 validate 方法验证文本是否符合要求.
    • 第一个参数填写的是要验证的字符串. 由于参数要求是 QString& 而不是 const QString& , 需要把这个变量复制一下.
    • 第二个参数是一个 int&, 是输出型参数. 当验证的字符串不匹配时, 返回这个字符串的长度. (没有啥实质作用).
    • 返回值是一个枚举. QValidator::Acceptable 表示验证通过, QValidator::Invalid 表示验证不通过.
cpp 复制代码
void Widget::on_lineEdit_textEdited(const QString &arg1)
{
    QString content = arg1;
    int pos = 0;
    if (ui->lineEdit->validator()->validate(content, pos) == QValidator::Acceptable) 
    {
        // 验证通过
        ui->pushButton->setEnabled(true);
    } 
    else 
    {
        // 验证不通过
        ui->pushButton->setEnabled(false);
    }
}

执行程序, 观察效果. 可以看到此时尝试输入字母是无法输入的. 并且只有当输入的内容符合要求, 确定按钮才能被使用.

代码示例:切换显示密码

创建一个输入框和一个复选按钮.

修改 widget.cpp, 设置输入框的 echoMode 为 Password

cpp 复制代码
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    ui->lineEdit->setEchoMode(QLineEdit::Password);
}

修改 widget.cpp, 给 checkBox 添加 slot 函数

cpp 复制代码
void Widget::on_checkBox_toggled(bool checked)
{
    if(checked)
    {
        // true 则是 "显示密码" 状态, 就把输入框的显示模式, 设为 Normal
        ui->lineEdit->setEchoMode(QLineEdit::Normal);
    }
    else
    {
        // false 则是 "隐藏密码" 状态, 就把输入框的显示模式, 设为 Password
        ui->lineEdit->setEchoMode(QLineEdit::Password);
    }
}

运行结果:


2. Text Edit

QTextEdit 表示多行输入框. 也是一个富文本 & markdown 编辑器.

并且能在内容超出编辑框范围时自动提供滚动条.

核心属性

属性 说明
markdown 输容入框内持有的内容. 支持 markdown 格式. 能够自动的对markdown 文本进行渲染成 html
html 输入框内持有的内容. 可以支持大部分 html 标签. 包括 img 和 table 等.
placeHolderText 输入框为空时提示的内容.
readOnly 是否是只读的
undoRedoEnable 是否开启 undo / redo 功能. 按下 ctrl + z 触发 undo 按下 ctrl + y 触发 redo
autoFormating 开启自动格式化.
tabstopWidth 按下缩进占多少空间
overwriteMode 是否开启覆盖写模式
acceptRichText 是否接收富文本内容
verticalScrollBarPolicy 垂直方向滚动条的出现策略 + Qt::ScrollBarAsNeeded : 根据内容自动决定是否需要滚动条。这是默认值。 + Qt::ScrollBarAlwaysOff : 总是关闭滚动条。 + Qt::ScrollBarAlwaysOn : 总是显示滚动条。
horizontalScrollBarPolicy 水平方向滚动条的出现策略 + Qt::ScrollBarAsNeeded : 根据内容自动决定是否需要滚动条。这是默认值。 + Qt::ScrollBarAlwaysOff : 总是关闭滚动条。 + Qt::ScrollBarAlwaysOn : 总是显示滚动条。

核心信号

信号 说明
textChanged() 文本内容改变时触发
selectionChanged() 选中范围改变时触发
cursorPositionChanged() 光标移动时触发
undoAvailable(bool) 可以进行 undo 操作时触发
redoAvailable(bool) 可以进行 redo 操作时触发
copyAvaiable(bool) 文本被选中/取消选中时触发

代码示例:获取多行输入框的内容

创建一个多行输入框和一个label

给多行输入框添加 slot 函数,处理 textChanged 信号.

  • 通过 toPlainText 方法获取到内部的文本.
  • 类似的, QTextEdit 还提供了 toMarkdown 和 toHtml . 根据需要我们调整不同的获取方式.
cpp 复制代码
#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_textEdit_textChanged()
{
    QString text = ui->textEdit->toPlainText();
    ui->label->setText(text);
}

执行程序, 可以看到当输入框中的内容发生变化时, label 中的内容同步发生改变.

代码示例:验证输入框的各种信号

创建多行输入框

给输入框添加以下几个 slot 函数

  • QTextEdit 中包含了一个 QTextCursor 对象, 通过这个对象可以获取到当前光标位置和选中的内容.
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_textEdit_textChanged()
{
    qDebug() << "textChanged: " << ui->textEdit->toPlainText();
}


void Widget::on_textEdit_selectionChanged()
{
    QTextCursor cursor = ui->textEdit->textCursor();
    qDebug() << "selectionChanged: " << cursor.selectedText();
}

void Widget::on_textEdit_cursorPositionChanged()
{
    QTextCursor cursor = ui->textEdit->textCursor();
    qDebug() << "cursorPositionChanged: " << cursor.position();
}


void Widget::on_textEdit_undoAvailable(bool b)
{
    qDebug() << "undoAvailable: " << b;
}


void Widget::on_textEdit_redoAvailable(bool b)
{
    qDebug() << "redoAvailable: " << b;
}

void Widget::on_textEdit_copyAvailable(bool b)
{
    qDebug() << "copyAvailable: " << b;
}

执行程序, 观察结果.

可以看到:

  1. 编写内容时, textChanged 和 cursorPositionChanged 会触发
  1. 选中一段文本时, cursorPositionChanged , selectionChanged , copyAvailable 会触发.

取消选中时

  1. 按下 ctrl + z 时, textChanged , undoAvailable , redoAvailable , cursorPositionChanged 会触发
  1. 按下 ctrl + y, textChanged , undoAvailable , redoAvailable , cursorPositionChanged 会触发

3. Combo Box

QComboBox 表示下拉框.

核心属性

属性 说明
currentText 当前选中的文本
currentIndex 当前选中的条目下标.从 0 开始计算. 如果当前没有条目被选中, 值为 -1
editable 是否允许修改 设为 true 时, QComboBox 的行为就非常接近 QLineEdit , 也可以 设置 validator
iconSize 下拉框图标 (小三角) 的大小
maxCount 最多允许有多少个条目

核心方法

方法 说明
addItem(const QString&) 添加一个条目
currentIndex() 获取当前条目的下标 从 0 开始计算. 如果当前没有条目被选中, 值为 -1
currentText() 获取当前条目的文本内容.

核心信号

方法 说明
activated(int) activated(const QString & text) 当用户选择了一个选项时发出. 这个时候相当于用户点开下拉框, 并且鼠标划过某个选项. 此时还没有确认做出选择.
currentIndexChanged(int) currentIndexChanged(const QString & text) 当前选项改变时发出. 此时用户已经明确的选择了一个选项. 用户操作或者通过程序操作都会触发这个信号.
editTextChanged(const QString & text) 当编辑框中的文本改变时发出 (editable 为 true 时有效)

代码示例:使用下拉框模拟麦当劳点餐

在界面上创建三个下拉框, 和一个按钮.

编写 widget.cpp, 初始化三个下拉框的内容

cpp 复制代码
#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    
    ui->comboBox->addItem("麦辣鸡腿堡");
    ui->comboBox->addItem("巨无霸");
    
    ui->comboBox_2->addItem("薯条");
    ui->comboBox_2->addItem("麦乐鸡块");
    
    ui->comboBox_3->addItem("可乐");
    ui->comboBox_3->addItem("雪碧");
}

编写 widget.cpp, 给按钮添加 slot 函数

cpp 复制代码
void Widget::on_pushButton_clicked()
{
    qDebug() << ui->comboBox->currentText() << ", "
             << ui->comboBox_2->currentText() << ", "
             << ui->comboBox_3->currentText();
}

运行结果:

代码示例:从文件中加载下拉框的选项

很多时候下拉框的选项并非是固定的, 而是通过读取文件/读取网络获取到的.

在界面上创建一个下拉框

创建文件 d:/config.txt , 编写选项. 每个选项占一行

修改 widget.cpp, 从文件中读取选项.

  • 使用 ifstream 打开文件
  • 使用 getline 读取每一行
  • 使用 QString::fromStdString 把 std::string 转成 QString
cpp 复制代码
#include "widget.h"
#include "ui_widget.h"
#include <QDebug>
#include <fstream>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    std::fstream file("D:/config.txt");
    if(!file.is_open())
    {
        qDebug() << "文件打开失败";
        return;
    }
    std::string line;
    while(std::getline(file, line))
    {
        ui->comboBox->addItem(QString::fromStdString(line));
    }
    file.close();
}

Widget::~Widget()
{
    delete ui;
}

运行结果:


4. Spin Box

使用 QSpinBox 或者 QDoubleSpinBox 表示 "微调框", 它是带有按钮的输入框. 可以用来输入整

数/浮点数. 通过点击按钮来修改数值大小

由于 SpinBox 和 QDoubleSpinBox 用法基本相同, 就只介绍 SpinBox 的使用了.

Spin 英文原意为 "旋转". 此处引申成 "微调".

事实上很多术语在翻译的时候, 不一定非要按照原始的翻译来表示, 更追求的是 "信达雅".

举个例子, 地铁上的 "Priority Seat" 会翻译成 "爱心专座", 而不是 "优先座位".

QSpinBox 关键属性

属性 说明
value 存储的数值.
singleStep 每次调整的 "步长". 按下一次按钮数据变化多少.
displayInteger 数字的进制. 例如 displayInteger 设为 10, 则是按照 10 进制表示. 设为 2 则为 2 进制表示.
minimum 最小值
maximum 最大值
suffix 后缀
prefix 前缀
wrapping 是否允许换行
frame 是否带边框
alignment 文字对齐方式.
readOnly 是否允许修改
buttonSymbol 按钮上的图标. + UpDownArrows 上下箭头形式 + PlusMinus 加减号形式 + NoButtons 没有按钮
accelerated (加速的) 按下按钮时是否为快速调整模式
correctionMode 输入有误时如何修正. + QAbstractSpinBox::CorrectToPreviousValue : 如果用户输入了一个无效的值(例如,在只能显示正整数的SpinBox中输入了负数),那么 SpinBox 会恢复为上一个有效值。例如,如果SpinBox的初始值是1,用户输入了-1(无效),然后SpinBox会恢复为1。 + QAbstractSpinBox::CorrectToNearestValue : 如果用户输入了一个无效的值,SpinBox会恢复为最接近的有效值。例如,如果SpinBox的初始值是1,用户输入了-1(无效),那么SpinBox会恢复为0。
keyboardTrack 是否开启键盘跟踪. 设为 true, 每次在输入框输入一个数字, 都会触发一次 valueChanged() 和 textChanged() 信号. 设为 false, 只有在最终按下 enter 或者输入框失去焦点, 才会触发 valueChanged() 和 textChanged() 信号.

核心信号

信号 说明
textChanged(QString) 微调框的文本发生改变时会触发. 参数 QString 带有 前缀 和 后缀.
valueChanged(int) 微调框的文本发生改变时会触发. 参数 int, 表示当前的数值.

代码示例:调整麦当劳购物车中的份数.

在界面上创建下列内容

  • 三个下拉框: objectName 为 comboBox 到 comboBox_3
  • 三个微调框: objectName 为 spinBox 到 spinBox_3
  • 一个按钮: objectName 为 pushButton

编写代码, 修改 widget.cpp, 给下拉框设置初始值.

cpp 复制代码
#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    // 初始化下拉框
    ui->comboBox->addItem("麦辣鸡腿堡");
    ui->comboBox->addItem("巨无霸");
    
    ui->comboBox_2->addItem("薯条");
    ui->comboBox_2->addItem("麦乐鸡块");
    
    ui->comboBox_3->addItem("可乐");
    ui->comboBox_3->addItem("雪碧");
    
    // 初始化微调框
    ui->spinBox->setRange(1, 5);
    ui->spinBox_2->setRange(1, 5);
    ui->spinBox_3->setRange(1, 5);
    
    ui->spinBox->setValue(1);
    ui->spinBox_2->setValue(1);
    ui->spinBox_3->setValue(1);
}

Widget::~Widget()
{
    delete ui;
}

编写代码, 给按钮添加 slot 函数

cpp 复制代码
void Widget::on_pushButton_clicked()
{
    qDebug() << ui->comboBox->currentText() << ": " << ui->spinBox->value()
             << ui->comboBox_2->currentText() << ": " << ui->spinBox_2->value()
             << ui->comboBox_3->currentText() << ": " << ui->spinBox_3->value();
}

执行程序, 可以看到当用户选择不同的内容时, 点击按钮就能获取到对应的结果. 同时我们也无法输入一些超出范围的非法值.


5. Date Edit & Time Edit

使用 QDateEdit 作为日期的微调框.

使用 QTimeEdit 作为时间的微调框

使用 QDateTimeEdit 作为时间日期的微调框.

这几个控件用法非常相似, 我们以 QDateTimeEdit 为例进行介绍.

QDateTimeEdit 核心属性

属性 说明
dateTime 时间日期的值. 形如 2000/1/1 0:00:00
date 单纯日期的值. 形如 2001/1/1
time 单纯时间的值. 形如 0:00:00
displayFormat 时间日期格式. 形如 yyyy/M/d H:mm + y 表示年份 + M 表示月份 + d 表示日期 + H 表示小时 + m 表示分钟 + s 表示秒 注意: 这里的格式化符号的含义, 不要记忆. 不同语言/库的设定规则是存在差异的. 一定是用的时候再去查.
minimumDateTime 最小时间日期
maximumDateTime 最大时间日期
timeSpec + Qt::LocalTime :显示本地时间。 + Qt::UTC :显示协调世界时(UTC)。 + Qt::OffsetFromUTC :显示相对于UTC的偏移量(时差).

关于 本地时间(LocalTime) 和 协调世界时(UTC)

UTC 时间是一个基于原子钟的标准时间. 不受地球的自转周期影响. 和格林威治时间 (GMT) 是非常接近的. 科学家会通过精密的设备来测量并维护.

咱们的计算机内部使用的时间就是基于 UTC 时间.本地时间则是基于不同的时区, 对 UTC 时间做出了一些调整. 比如咱们使用的北京时间, 位于 "东⼋区", 就需要在 UTC 时间基础上 +8 个小时的时差.

核心信号

信号 说明
dateChanged(QDate) 日期改变时触发.
timeChanged(QTime) 时间改变时触发.
dateTimeChanged(QDateTime) 时间日期任意一个改变时触发

代码示例:实现日期计算器

在界面上创建两个 QDateTimeEdit 和一个按钮, 一个 label

QDateTimeEdit 的 objectName 为 dateTimeEdit_old 和 dateTimeEdit_new

编写计算按钮的 slot 函数

  • 使用 daysTo 函数可以计算两个日期的天数.
  • 使用 secsTo 函数可以计算两个时间的秒数.
  • 通过 (秒数 / 3600) 换算成小时数, 再余上 24 得到零几个小时.
  • 使用 QString::number 把整数转成 QString 进行拼接.

注意,在使用daysTo时其实是有一点问题的,我们可以查看一下文档

这段话的意思是返回从该日期时间到另一个日期时间的天数。天数计算为从该日期时间到另一个日期时间达到午夜的次数。这意味着从23:55到第二天0:05的10分钟差算作一天。

如果另一个日期时间比这个日期时间早,返回的值为负。

我们这里实现日期计算器的话,在不足一天时不应该算作一天

所以我们这里可以通过使用 secsTo 函数可以计算两个时间的秒数,然后通过 (秒数 / 3600) 换算成小时数, 再除以 24 得到天数

cpp 复制代码
void Widget::on_pushButton_clicked()
{
    QDateTime timeOld = ui->dateTimeEdit_old->dateTime();
    QDateTime timeNew = ui->dateTimeEdit_new->dateTime();
    int sec = timeOld.secsTo(timeNew);
    int days = (sec / 3600) / 24;
    int hours = (sec / 3600) % 24;
    ui->label->setText(QString("计算结果为: ") + QString::number(days) 
                       + QString("天零") + QString::number(hours) + QString("个小时"));
}

运行结果:


6. Dial

使用 QDial 表示一个 旋钮.

有些程序, 通过鼠标拖动旋钮旋转, 即可完成一些相关的设置.

核心属性

属性 说明
value 持有的数值.
minimum 最小值
maximum 最大值
singleStep 按下方向键的时候改变的步长.
pageStep 按下 pageUp / pageDown 的时候改变的步长.
sliderPosition 界面上旋钮显示的 初始位置
tracking 外观是否会跟踪数值变化. 默认值为 true. 一般不需要修改.
wrapping 是否允许循环调整. 即数值如果超过最大值, 是否允许回到最小值. (调整过程能否 "套圈")
notchesVisible 是否显示 刻度线
notchTarget 刻度线之间的相对位置. 数字越大, 刻度线越稀疏.

核心信号

属性 说明
valueChanged(int) 数值改变时触发
rangeChanged(int, int) 范围变化时触发

代码示例:调整窗口透明度

在界面上创建一个旋钮

编写 widget.cpp, 设置旋钮的 valueChanged slot 函数

cpp 复制代码
void Widget::on_dial_valueChanged(int value)
{
    qDebug() << value;
    setWindowOpacity((double)value / 100);
}

运行结果:


7. Slider

使用 QSlider 表示一个滑动条.

QSlider 和 QDial 都是继承自 QAbstractSlider , 因此用法上基本相同.

核心属性

属性 说明
value 持有的数值.
minimum 最小值
maximum 最大值
singleStep 按下方向键的时候改变的步长.
pageStep 按下 pageUp / pageDown 的时候改变的步长.
sliderPosition 滑动条显示的 初始位置
tracking 外观是否会跟踪数值变化. 默认值为 true. 一般不需要修改.
orientation 滑动条的方向是水平还是垂直
invertedAppearance 是否要翻转滑动条的方向
tickPosition 刻度的位置.
tickInterval 刻度的密集程度.

核心信号

属性 说明
valueChanged(int) 数值改变时触发
rangeChanged(int, int) 范围变化时触发

代码示例:调整窗口大小

在界面上创建两个滑动条, 分别是水平和垂直滑动条.objectName 分别为 horizontalSlider 和 verticalSlider

编写代码初始化滑动条

cpp 复制代码
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    
    ui->horizontalSlider->setMinimum(100);
    ui->horizontalSlider->setMaximum(2000);
    ui->horizontalSlider->setValue(800);
    ui->horizontalSlider->setSingleStep(50);
    
    ui->verticalSlider->setMinimum(100);
    ui->verticalSlider->setMaximum(1500);
    ui->verticalSlider->setValue(600);
    ui->verticalSlider->setSingleStep(50);
}

编写滑动条的 valueChanged slot 函数

cpp 复制代码
void Widget::on_horizontalSlider_valueChanged(int value)
{
    const QRect& rect = this->geometry();
    this->setGeometry(rect.x(), rect.y(), value, rect.height());
}

void Widget::on_verticalSlider_valueChanged(int value)
{
    const QRect& rect = this->geometry();
    this->setGeometry(rect.x(), rect.y(), rect.width(), value);
}

运行结果:

代码示例:通过自定义快捷键调整滑动条位置.

设置 - 减小 value, 设置 = 增加 value.

默认情况下滑动条可以通过 方向键 或者 pageUp / pageDown 调整大小.

在界面上创建滑动条和 label

创建 valueChanged 的 slot 函数

cpp 复制代码
void Widget::on_horizontalSlider_valueChanged(int value)
{
    ui->label->setText("当前的值为: " + QString::number(value));
}

修改 widget.cpp 构造函数, 增加快捷键

  • 使用 QShortCut 类设置快捷键.
  • 快捷键触发时, 会发出 QShortcut::activated 信号, 我们连接到自己写的 slot 函数
cpp 复制代码
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    
    QShortcut* shortcut1 = new QShortcut(this);
    shortcut1->setKey(QKeySequence("-"));
    QShortcut* shortcut2 = new QShortcut(this);
    shortcut2->setKey(QKeySequence("="));
    
    connect(shortcut1, &QShortcut::activated, this, &Widget::subValue);
    connect(shortcut2, &QShortcut::activated, this, &Widget::addValue);
}

编写⾃定义 slot 函数

cpp 复制代码
void Widget::subValue()
{
    // 获取到当前的值
    int value = ui->horizontalSlider->value();
    if (value <= ui->horizontalSlider->minimum()) 
    {
        return;
    }
    ui->horizontalSlider->setValue(value - 5);
}

void Widget::addValue()
{
    // 获取到当前的值
    int value = ui->horizontalSlider->value();
    if (value >= ui->horizontalSlider->maximum()) {
        return;
    }
    ui->horizontalSlider->setValue(value + 5);
}

运行结果:

相关推荐
健康平安的活着1 小时前
java中事务@Transaction的正确使用和触发回滚机制【经典】
java·开发语言
全栈软件开发2 小时前
中小汽修门店汽修单管理系统PHP源码,数字化管理维修订单与客户信息
开发语言·php
Barkamin2 小时前
使用PriorityQueue创建大小堆,解决TOPK问题
java·开发语言
寻寻觅觅☆2 小时前
东华OJ-进阶题-12-时间转换(C++)
开发语言·c++·算法
还是大剑师兰特2 小时前
50个 filter相关的公共函数
开发语言·javascript·ecmascript
!停2 小时前
C++入门基础
java·开发语言·c++
赵文宇(温玉)2 小时前
OpenClaw3.13已经发布,该如何快速升级
java·开发语言
ん贤2 小时前
一文读懂 Go-Eino 的 Embedding
开发语言·golang·embedding