QT Tutorial

一个简单 GUI 项目

这里手写代码完成一个简易版win+R的界面框：

#include <QApplication>
#include <QLabel>
#include <QLineEdit>
#include <QPushButton>
#include <QHBoxLayout> // 水平布局
#include <QVBoxLayout> // 垂直布局
#include <QWidget>

int main(int argc,char *argv[]){

    QApplication app(argc,argv);

    QLabel *infoLabel=new QLabel;
    QLabel *openLabel=new QLabel;
    QLineEdit *cmdLineEdit=new QLineEdit;
    QPushButton *commitButton=new QPushButton;
    QPushButton *cancelButton=new QPushButton;
    QPushButton *browseButton=new QPushButton;

    infoLabel->setText("input cmd");
    openLabel->setText("open");
    commitButton->setText("commit");
    cancelButton->setText("cancel");
    browseButton->setText("browse");

    QHBoxLayout *cmdLayout=new QHBoxLayout;
    cmdLayout->addWidget(openLabel);
    cmdLayout->addWidget(cmdLineEdit);

    QHBoxLayout *buttonLayout=new QHBoxLayout;
    buttonLayout->addWidget(commitButton);
    buttonLayout->addWidget(cancelButton);
    buttonLayout->addWidget(browseButton);

    QVBoxLayout *mainLayout=new QVBoxLayout;
    mainLayout->addWidget(infoLabel);
    mainLayout->addLayout(cmdLayout);
    mainLayout->addLayout(buttonLayout);

    QWidget window;
    window.setLayout(mainLayout);
    window.show();

    return app.exec();
}

编译流程

打开 Qt 安装后自带的「Qt 6.9.2 (MinGW 64-bit)」命令提示符，如果使用系统默认CMD编译需要配置环境变量较为麻烦。

1. 生成基础的.pro项目文件

qmake -project

2. 根据.pro文件生成 Makefile

• 如果修改了.pro（比如加 QT 模块QT += core gui widget），必须重新执行这一步。

qmake

3. 执行编译，生成可执行文件

mingw32-make -j4

• mingw32-make是 MinGW 的编译工具，会读取 Makefile 的规则调用 g++ 编译；

• -j4是多核编译（4 核），加快编译速度，可根据自己 CPU 核心数调整（比如-j8）；

• 若仅修改源码（未改.pro），无需重新执行qmake -project和qmake，直接执行这一步即可（make 会自动检测文件修改）。

4. 切换到编译产物目录

cd release

5. 运行编译好的可执行文件

qmake.exe

QtCreator

信号与槽

可以将UI控件与事件（函数）相关联起来，在“设计”界面右击，选项中选择“转到槽”：

void Widget::on_commitButton_clicked()
{
    // 获取lineEdit数据
    QString program=ui->cmdLineEdit->text();
    // 创建process对象
    QProcess *myProcess=new QProcess(this);
    myProcess->start(program);
}

以上on_控件名_事件名 是 Qt 的 “自动关联（Auto-Connection）” 机制，但是在实际开发中，为了代码可读性更高、命名更自由，我们通常会手动绑定信号和槽：

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    
    // 手动绑定：按钮的clicked信号 关联到 自定义的槽函数executeCommand
    connect(ui->commitButton, &QPushButton::clicked, this, &Widget::executeCommand);
}

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

// 自定义命名的槽函数，不再受on_控件名_事件名的限制
void Widget::executeCommand()
{
    QString program = ui->cmdLineEdit->text();
    QProcess *myProcess = new QProcess(this);
    myProcess->start(program);
}

通过手动绑定的方式添加回车确认的功能：

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

    // 连接信号与槽 发出信号、发出什么信号、谁处理信号、如何处理
    connect(ui->cmdLineEdit,SIGNAL(returnPressed()),this,SLOT(on_commitButton_clicked()));
}

当我们的事件不是很多的时候，连接信号与槽的时候可以是用lambda表达式：

connect(ui->browseButton,&QPushButton::clicked,[this](){
            QMessageBox::information(this,"信息","点击浏览");
});

• ui->用于设置控件
• this->用于设置窗口