Qt教程 — 3.2 深入了解Qt 控件：Input Widgets部件(1)

最新推荐文章于 2024-03-16 17:00:11 发布

几度春风里

最新推荐文章于 2024-03-16 17:00:11 发布

阅读量1.2k

点赞数 13

分类专栏： Qt-C++从入门到精通文章标签： qt InputWidgets

本文链接：https://blog.csdn.net/qq_41921826/article/details/136741779

版权

Qt-C++从入门到精通专栏收录该内容

12 篇文章 22 订阅

订阅专栏

1 Input Widgets简介

2 如何使用Input Widgets部件

2.1 QComboBox组件-通过下拉按钮选择省份

2.2 QFontComboBox组件-通过下拉选项打印出指定字体文本

2.3 QLineEdit组件-打印出当前单行输入框的内容

2.4 QTextEdit组件-演示文本的输入

2.5 QPlainTextEdit组件-文本浏览编辑器

Input Widgets部件部件较多，将分为三篇文章介绍

文章1（本文）：ComboBox (组合框)、FontComboBox (字体组合框)、LineEdit (单行编辑框)、TextEdit (文本编辑框)、PlainTextEdit (纯文本编辑框)

文章2（链接）：SpinBox (数字旋转框)、DoubleSpinBox (双精度数字旋转框)、TimeEdit (时间编辑框):、DateEdit (日期编辑框)、DateTimeEdit (日期时间编辑框):

文章3（链接）：Dial (数字拨盘框)、HorizontalScrollBar (水平滚动条)、VerticalScrollBar (垂直滚动条): 、HorizontalSlider (水平滑动条)、VerticalSlider (垂直滑动条)、KeySequenceEdit (按键序列编辑框)

1 Input Widgets简介

Qt的Input Widgets部件是一系列专门用于数据输入的界面元素。它们允许用户通过图形界面与应用程序进行交互，并提供不同的数据输入方式。以下是一些常见的Input Widgets部件：

ComboBox (组合框): QComboBox 继承 QWidget 类，被 QFontComboBox 类继承。允许用户从下拉列表中选择一个选项。它可以是可编辑的，允许用户输入一个值，也可以是只读的。
FontComboBox (字体组合框): QFontComboBox 继承 QComboBox。是一种特殊的ComboBox，列出了系统中可用的字体，允许用户选择文本的字体。
LineEdit (单行编辑框): QLineEdit 继承 QWidget。提供了一个单行文本输入框，用户可以输入和编辑一行字符串。
TextEdit (文本编辑框): QTextEdit 继承 QAbstractScrollArea，被 QTextBrowser 继承。一个多行文本编辑器，支持富文本和纯文本编辑，允许用户输入和编辑多行文本，包括格式化文本。
PlainTextEdit (纯文本编辑框): 类似于TextEdit，但专门用于编辑纯文本，不支持文本格式化。
SpinBox (数字旋转框): QSpinBox 继承 QAbstractSpinBox。允许用户通过点击箭头或输入选择一个整数值。
DoubleSpinBox (双精度数字旋转框): QDoubleSpinBox 继承 QAbstractSpinBox。与SpinBox类似，但用于选择一个浮点数值。
TimeEdit (时间编辑框): QTimeEdit 继承 QDateTimeEdit。允许用户输入和选择一个特定的时间。
DateEdit (日期编辑框): QDateEdit 继承 QDateTimeEdit。允许用户输入和选择一个特定的日期。
DateTimeEdit (日期时间编辑框): 结合了DateEdit和TimeEdit的功能，允许用户输入和选择一个特定的日期和时间。
Dial (数字拨盘框): 提供了一个旋转拨盘控件，用于选择数值，常用于模拟选择器或调节器。
HorizontalScrollBar (水平滚动条): QScrollBar 继承 QAbstractSlider，下同。一种水平滚动条，允许用户通过滑动来水平导航。
VerticalScrollBar (垂直滚动条): 一种垂直滚动条，允许用户通过滑动来垂直导航。
HorizontalSlider (水平滑动条): 水平方向的滑动条，允许用户通过拖动选择一个数值。
VerticalSlider (垂直滑动条): 垂直方向的滑动条，允许用户通过拖动选择一个数值。
KeySequenceEdit (按键序列编辑框): QKeySequenceEdit 继承 QWidget。允许用户输入和编辑键盘快捷键序列。

2 如何使用Input Widgets部件

2.1 QComboBox组件-通过下拉按钮选择省份

通过点击下拉按钮的项选择省份，选择其中一项，然后打印出当前选择项的内容。按照文章新建项目（Qt教程 — 1.3 如何创建Qt项目-CSDN博客）。

（1）在头文件“mainwindow.h”修改代码，具体代码如下。1）导入QComboBox文件 —> 2）声明一个 QComboBox 对象和对应槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
// 引入 QComboBox
#include <QComboBox>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    // 声明一个 QComboBox 对象
    QComboBox *comboBox;

private slots:
    // 声明 QComboBox 对象的槽函数
    void comboBoxIndexChanged(int);

};
#endif // MAINWINDOW_H

（2）在文件“mainwindow.cpp”修改代码，具体代码如下。1）导入QDebug文件和QStringList文件 —> 2）设置主窗体的显示位置与大小。—> 3）实例化comboBox对象，设置 comboBox 的显示位置与大小。—> 4）创建字符串列表，列出所有省份，添加省份到comboBox。—>5）信号槽连接—>6）写出槽函数，打印出选择的省份。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

// 引入 QDebug
#include <QDebug>
#include <QStringList>

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

    // 设置主窗体的显示位置与大小
    this->setGeometry(0, 0, 800, 480);
    // 实例化对象
    comboBox = new QComboBox(this);
    // 设置 comboBox 的显示位置与大小
    comboBox->setGeometry(20, 5, 150, 30);

    // 所有省份
    QStringList provinces = {"广东(默认省份)", "湖南", "四川", "北京", "天津", "上海", "重庆",
                             "河北", "山西", "辽宁", "吉林", "黑龙江", "江苏",
                             "浙江", "安徽", "福建", "江西", "山东", "河南",
                             "湖北", "广西", "海南", "贵州", "云南", "西藏",
                             "陕西", "甘肃", "青海", "宁夏", "新疆", "内蒙古",
                             "香港", "澳门", "台湾"};
    // 添加省份到comboBox
    for (const QString &province : provinces) {
        comboBox->addItem(province);
    }

    // 信号槽连接
    connect(comboBox, SIGNAL(currentIndexChanged(int)), this, SLOT(comboBoxIndexChanged(int)));
}

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

void MainWindow::comboBoxIndexChanged(int index)
{
    // 打印出选择的省份
    qDebug() << "您选择的省份是" << comboBox->itemText(index) << endl;
}

（3）程序编译运行的结果如下，当点击下拉选择框选择省份时，槽函数将打印出您选择的省份。可以看到列表超出了窗口边界，后续会进一步优化。

2.2 QFontComboBox组件-通过下拉选项打印出指定字体文本

（1）在头文件“mainwindow.h”修改代码，具体代码如下。1）导入<QFontComboBox>文件和 <QLabel>文件—> 2）声明一个QFontComboBox和Label对象和对应槽函数。完整代码如下(注意：代码为本节可单独运行的代码，实验结果为和前节结合的代码，后同)。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
// 引入QFontComboBox
#include <QFontComboBox>
// 引入QLable
#include <QLabel>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    // 声明一个 QFontComboBox 对象
    QFontComboBox *fontComboBox;
    // 声明一个 Label 对象，用于显示当前字体变化
    QLabel *label;

private slots:
    // 声明 QFontComboBox 对象使用的槽函数
    void fontComboBoxFontChanged(QFont);
};
#endif // MAINWINDOW_H

（2）在文件“mainwindow.cpp”修改代码，具体代码如下。 1）设置主窗体的显示位置与大小。—> 3）实例化FontComboBox和label对象，设置fontComboBox 和label的显示位置与大小。—>5）信号槽连接—>6）写出槽函数，打印指定字体文本。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

// 引入 QDebug
#include <QDebug>
#include <QStringList>

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

    // 设置主窗体的显示位置与大小
    this->setGeometry(0, 0, 800, 480);
    
    // 设置 comboBox 的显示位置与大小
    comboBox->setGeometry(20, 5, 140, 30);
    comboBox->setMaxVisibleItems(10); // 设置最大可见项数为10

    // 实例化对象
    fontComboBox = new QFontComboBox(this);
    label = new QLabel(this);
    // 设置显示的位置与大小
    fontComboBox->setGeometry(200, 5, 200, 30);
    label->setGeometry(200, 55, 300, 50);
    // 信号与槽连接
    connect(fontComboBox, SIGNAL(currentFontChanged(QFont)), this, SLOT(fontComboBoxFontChanged(QFont)));
}

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


//fontComboBoxFontChanged槽函数实现
void MainWindow::fontComboBoxFontChanged(QFont font)
{
    // 将 label 里的文本内容设置为所选择的字体
    label->setFont(font);
    // 定义一个字符串接收当前项的字体
    QString str = "我爱中国！\n 设置的字体为： " +fontComboBox->itemText(fontComboBox->currentIndex());
    // 将字符串的内容作为 label 的显示内容
    label->setText(str);
}

（3）程序编译运行的结果如下，当点击 AR PL UKai CNa 字体组合框选择字体后， Label 标签显示的字体将改变为当前所选择的字体。

2.3 QLineEdit组件-打印出当前单行输入框的内容

通过点击下拉按钮的项，单行输入框，选择其中一项，然后打印出当前选择项的内容。

（1）在头文件“mainwindow.h”修改代码，具体代码如下。1）导入<QDebug>文件和<QStringList>文件—> 2）声明QLineEdit、QPushButton和QLabell对象和对应槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
// 引入QLable
#include <QLabel>
// 引入QLineEdit和QPushButton
#include <QLineEdit>
#include <QPushButton>


QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    
    // 声明一个 QLineEdit 对象
    QLineEdit *lineEdit;
    // 声明一个 QPushButton 对象
    QPushButton *pushButton;
    // 声明一个 QLabel 对象
    QLabel *label_1;

private slots:
    // 声明一个槽函数，响应 pushButton 的 clicked 事件
    void pushButtonClicked();

};
#endif // MAINWINDOW_H

（2）在文件“mainwindow.cpp”修改代码，具体代码如下。 1）设置主窗体的显示位置与大小。—> 2）实例化QLineEdit和QPushButtonl对象，设置lineEdit和pushButton的显示位置与大小。—>3）设置确认按钮和打印文字—>4）信号槽连接—>5）写出槽函数，打印输入文本。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

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

    // 设置主窗体的显示位置与大小
    this->setGeometry(0, 0, 800, 480);

    /***** 3 *****/
    // 实例化对象
    lineEdit = new QLineEdit(this);
    pushButton = new QPushButton(this);
    // 设置显示的位置与大小
    lineEdit->setGeometry(450, 10, 200, 30);
    pushButton->setGeometry(650, 10, 50, 30);


    //设置确认按钮和打印文字
    pushButton->setText("确认");
    label = new QLabel(this);
    label->setGeometry(450, 40, 400, 30);
    label->setText("您输入的内容是： ");
    // 信号槽连接
    connect(pushButton,SIGNAL(clicked()), this, SLOT(pushButtonClicked()));
}

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

void MainWindow::pushButtonClicked()
{
    // 字符串变量
    QString str;
    str = "您输入的内容是： ";
    str += lineEdit->text();
    // 设置 label 里的文本显示内容
    label->setText(str);
    // 在点击了确认键之后清空 lineEdit 单行输入框
    lineEdit->clear();
}

（3）程序编译运行的结果如下，当在QLineEdit单行输入框内输入文本内容后，单击QPushButton
确认按钮后， QLabel 的文本内容将显示您所输入的内容。然后 QLineEdit 将清空，可再次输入。

2.4 QTextEdit组件-演示文本的输入

用一个 QTextEdit 来演示文本的输入，用两个QPushButton 来模拟文本编辑的全选与清除。在 QTextEdit 里也可用键盘的快捷键（如 Ctrl+A）来完成全选，复制，粘贴等操作。 Qt 提供了全选，复制粘贴等这一类的函数方便用户操作，下面用简单的实例来演示。

（1）在头文件“mainwindow.h”修改代码，具体代码如下。1）导入<QTextEdit>、<QMainWindow>文件和<QPushButton>文件—> 2）声明QTextEdit和两个QPushButton对象和对应槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QTextEdit>
#include <QPushButton>
#include <QMainWindow>


QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;

    /* 声明一个 QTextEdit 对象 */
    QTextEdit *textEdit;
    /* 声明两个 QPushButton 对象 */
    QPushButton *pushButtonSelectAll;
    QPushButton *pushButtonClearAll;

private slots:
    // 声明两个槽函数，响应按钮点击响应的事件
    void pushButtonSelectAllClicked();
    void pushButtonClearAllClicked();

};
#endif // MAINWINDOW_H

#include "mainwindow.h"
#include "ui_mainwindow.h"

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

    // 设置主窗体的显示位置与大小
    this->setGeometry(0, 0, 800, 480);

    /***** 4 *****/
    // 实例和对象，设置位置和显示大小
    textEdit = new QTextEdit(this);
    textEdit->setGeometry(0, 100, 200, 100);
    // 实例和对象，设置位置和显示大小，设置文本
    pushButtonSelectAll = new QPushButton(this);
    pushButtonSelectAll->setGeometry(50, 200, 50, 20);
    pushButtonSelectAll->setText("全选");
    // 实例和对象，设置位置和显示大小，设置文本
    pushButtonClearAll = new QPushButton(this);
    pushButtonClearAll->setGeometry(100, 200, 50, 20);
    pushButtonClearAll->setText("清除");
    // 信号槽连接
    connect(pushButtonSelectAll, SIGNAL(clicked()), this,SLOT(pushButtonSelectAllClicked()));
    connect(pushButtonClearAll, SIGNAL(clicked()), this,SLOT(pushButtonClearAllClicked()));
}

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

void MainWindow::pushButtonClearAllClicked()
{
    // 清空 textEdit 里的文本内容
    textEdit->clear();
}

（3）程序编译运行的结果如下，在编辑框里输入文字后，点击按钮全选，点击清除则清除编辑
框内的全部内容。如下图为点击全选的效果

2.5 QPlainTextEdit组件-文本浏览编辑器

用一个 QPlainTextEdit 来读取本当前工程里的一个文件，并用一个 RadioButton 里将 QPlainTextEdit 设为只读。

（1）在头文件“mainwindow.h”修改代码，具体代码如下。1）导入<QPlainTextEdit>、<QRadioButton>文件和<QMainWindow>文件—> 2）声明QPlainTextEdit和QPlainTextEdit对象和对应槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

//引入QPlainTextEdit和QRadioButton
#include <QPlainTextEdit>
#include <QRadioButton>


QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;

    // 声明对象
    QPlainTextEdit *plainTextEdit;
    QRadioButton *radioButton;

private slots:
    // 声明槽函数
    void radioButtonClicked();

};
#endif // MAINWINDOW_H

（2）在文件“mainwindow.cpp”修改代码，具体代码如下。1）引入<QDir>、<QTextStream>和<QCoreApplication>文件—>2）设置主窗体的显示位置与大小。—> 3）实例化QPlainTextEdit
和QRadioButton对象，设置plainTextEdit和plainTextEdit的显示位置与大小。—>3）读取指定文件—>4）信号槽连接—>5）写出槽函数，打印输入文本。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

// 引入QDir、QTextStream和QCoreApplication
#include <QDir>
#include <QTextStream>
#include <QCoreApplication>

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

    // 设置主窗体的显示位置与大小
    this->setGeometry(0, 0, 800, 480);

    /***** 5 *****/
    plainTextEdit = new QPlainTextEdit(this);
    plainTextEdit->setGeometry(200, 100, 200, 100);
    radioButton = new QRadioButton(this);
    radioButton->setGeometry(250, 200, 100, 20);
    radioButton->setText("只读模式");

    // 打开可执行程序目录里的 moc_mainwindow.cpp
    QFile file("moc_mainwindow.cpp");
    // 以只读模式打开，但是可以在 plainTextEdit 里编辑
    file.open((QFile::ReadOnly | QFile::Text));
    // 加载到文件流
    QTextStream in(&file);
    // 从文本流中读取全部
    plainTextEdit->insertPlainText(in.readAll());
    // 信号槽连接
    connect(radioButton, SIGNAL(clicked()), this, SLOT(radioButtonClicked()));
}

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


void MainWindow::radioButtonClicked()
{
    // 检查 radioButton 是否选中
    if(radioButton->isChecked()) {
    // 设置为只读模式/
    plainTextEdit->setReadOnly(true);
    } else {
        // 设置为非只读模式
        plainTextEdit->setReadOnly(false);
    }
}

（3）程序编译运行的结果如下，当程序正常运行后会打开程序当前路径下的 ”
moc_mainwindow.cpp” 文件，且在 QPlainTextEdit 编辑框下是可编辑的，当选中程序界面上的只读模式时， QPlainTextEdit 编辑框就不可以再编辑。相反可以取消只读模式则可以再编辑。

几度春风里

关注

13
点赞
踩
9

收藏

觉得还不错? 一键收藏
打赏
0
评论
Qt教程 — 3.2 深入了解Qt 控件：Input Widgets部件(1)

Qt的Input Widgets部件是一系列专门用于数据输入的界面元素。它们允许用户通过图形界面与应用程序进行交互，并提供不同的数据输入方式。ComboBox (组合框): QComboBox 继承 QWidget 类，被 QFontComboBox 类继承。允许用户从下拉列表中选择一个选项。它可以是可编辑的，允许用户输入一个值，也可以是只读的。FontComboBox (字体组合框): QFontComboBox 继承 QComboBox。
复制链接

扫一扫