Qt学习（开发环境Visual Studio）3.常用的ui控件

千纸鹤14

428人浏览 · 2026-05-22 14:03:57

千纸鹤14 · 2026-05-22 14:03:57 发布

当我们根据需求在Ui界面布局的时候，会经常用到一些控件。下面介绍一些我在工作中常用的控件，当然最有效的方法是查阅QT自带的帮助文档或者问AI。如有错误欢迎指正~

QLabel

最常用的是label，用于显示文本、图片、动画等内容。

可以右键点击改变格式文本来设置字体、颜色之类的。

还可以变成图片，具体操作可以看上一篇文章。

label 还可以动态显示当前的时间，这里来实践一下~ 。格式是yyyy/MM/dd hh:mm:ss。拖入一个label输入当前的时间，注意这里只是文本。我们把这个label重命名为m_labTime

运行一下，这个是静止的，并不会随着系统时间变换。然后问一下AI：

注意要引用头文件

#include "test.h"
#include <QTimer>
#include <QDateTime>

test::test(QWidget *parent)
    : QWidget(parent)
{
    ui.setupUi(this);
    auto timer = new QTimer(this);
    connect(timer, &QTimer::timeout, [this]() {
        auto dt = QDateTime::currentDateTime();//获取当前日期时间，auto：自动类型推导为 QDateTime
        ui.m_labTime->setText(dt.toString(u8"yyyy/MM/dd hh:mm:ss"));
        });
    timer->start(1000);//即每隔1000毫秒（1秒）触发一次timeout信号
}

test::~test()
{}

ok,现在是跟随着系统的时间在变。不知道怎么在文章插入动画，大家可以自己试一下。

QspinBox

这两个的区别就是输入类型一个是int，另一个是double。允许用户通过点击上下箭头、键盘方向键或直接输入，来增加/减少一个数值，文本框显示并允许直接键入当前值。可设定最大值和最小值，超出时会阻止或自动限制。

一般我们不用上下的小箭头，而是用键盘输入。下面来实现一个加法的功能。给界面布局了一下并对控件进行了重命名。

我一般会去掉上下的小箭头：

如果有单位的话可以添加后缀。看这里的”minimum“是最小值，maximum是最大值，step是步长，也就是我们将实现0~99以内的加法（最后的sum最大也是99），在这里我们可以手动改大范围，可以添加负数。我改成了-99~99，第三个spinbox是-200~200，这里是整数，如果要实现小数的加法可以用double spinbox .

设置最后的结果不允许编辑：

在.h文件里面写一个加法函数的声明：

注意要写上注释，不然下次看就不知道这是什么了。有一条绿色的波浪线是因为我们还没有实现这个函数，来到.cpp

为什么要加上“test::”，因为这个函数是我们的类 “test”里面的。

这时返回看函数的声明，就没有绿色波浪线了。接下来实现这个函数：

int test::add(int a,int b)
{
    return a + b;
}

这样当我们获取了需要相加的两个数，再作为参数传入，就可以得到两数之和了。那程序怎么知道我们要计算呢？这时候需要给程序一个信号，就是single，用到了另外一个常用的控件----button

Button

最常用的是Push Button,这是最标准的按钮，你点击它时它会触发一个动作。

核心信号：clicked() （最常用，用户点击并释放后触发）， pressed() （按下瞬间触发）， released() （释放瞬间触发）。
核心方法：setText() （设置文字）， setIcon() （设置图标）， setEnabled() （启用/禁用）， setCheckable() （设为开关模式）

把上面的等号换成button，重命名为m_btCalcu。当点击这个按钮的时候，会发出一个信号，当程序获取到这个信号的时候就会执行对应的动作。这里可以去查一下“QT的信号槽机制”，这里不再赘述。

在Qt框架中，信号（Signal）和槽（Slot）构成了一种独特的通信机制，它们在软件开发中的角色可以类比于日常生活中的呼叫与应答。

在.h里面写一个槽函数的声明：

public slots:
    /*/
    @brief 进行计算
    */
    void slotCalculate();

.cpp里面槽函数的实现：获取了界面上需要相加的两个数，然后把他们传入加法函数，获得结果，再把结果赋给界面展示。

void test::slotCalculate()
{
    int num1 = ui.m_spNum1->value();
    int num2 = ui.m_spNum2->value();
    int answer = add(num1, num2);
    ui.m_spAnswer->setValue(answer);

}

最后写一个信号槽连接信号和槽函数：

  connect(ui.m_btCalcu, &QPushButton::clicked, this, &test::slotCalculate);

当按钮被“clicked”，就会调用槽函数slotCalculate

如图，点击按钮即可计算。

当然除了加法，我们可能还想要乘法、减法、除法（注意除数不为0）就需要用到一个有下拉框的控件combo box.

Combo box

添加了四个功能，加减乘和取余。命名为m_cbCalcuType

combo box的每个选项对它来说就是字符串而已，真正起作用的是每个选项的序号，这里就是0、1、2、3.

先把缺少的运算补上：

    /*
    *@brief 实现两个数相减
    *@param a,b in  需要相减的两个数
    *@param int out 两个数相减的结果
    */
    int subtrac(int a, int b);

    /*
    *@brief 实现两个数相乘
    *@param a,b in  需要相乘的两个数
    *@param int out 两个数相乘的结果
    */
    int multipli(int a, int b);
    /*
    *@brief 实现两个数取余
    *@param a,b in  需要取余计算的两个数
    *@param int out 取余的结果
    */
    int remain(int a, int b);

.cpp里面，在获取了当前用户选中的索引后，用了一个switch语句，对应需要进行的运算。

int test::add(int a,int b)
{
    return a + b;
}
int test::subtrac(int a, int b)
{
    return a - b;
}
int test::multipli(int a, int b)
{
    return a * b;
}
int test::remain(int a, int b)
{
    return a % b;
}


void test::slotCalculate()
{
    int num1 = ui.m_spNum1->value();
    int num2 = ui.m_spNum2->value();
    int index = ui.m_cbCalcuType->currentIndex();
    int answer = 0;
    switch (index)
    {
    case 0:
        answer = add(num1, num2);
        break;
    case 1:
        answer = subtrac(num1, num2);
        break;
    case 2:
        answer = multipli(num1, num2);
        break;
    case 3:
        answer = remain(num1, num2);
        break;
    default:
        break;
    }
   
    ui.m_spAnswer->setValue(answer);

}