第38章 图形界面开发基础

当你熟练掌握了C++的语法、面向对象和STL后，自然会想用这门强大的语言来创造一些“看得见摸得着”的东西。图形用户界面（GUI）开发就是将你的程序逻辑与用户交互界面连接起来的桥梁。这不再是黑乎乎的控制台，而是有窗口、按钮、菜单的现代软件。

GUI框架全景图：如何选择你的“工具箱”

在C++的世界里，没有像Python的Tkinter那样的“标准”GUI库。你需要选择一个第三方框架。选择哪个，直接决定了你的开发效率、程序性能和最终的用户体验。

我在多个项目中都使用过Qt和wxWidgets。对于绝大多数新项目，尤其是需要跨平台的项目，我强烈推荐从Qt开始。它的信号槽机制极大地简化了界面与逻辑的交互，Qt Designer工具可以让你通过拖拽设计界面，其文档和社区生态也是最好的。本章后续内容将以Qt 6.5 LTS版本为例进行讲解。

Qt核心机制：信号与槽

理解信号与槽是掌握Qt的钥匙。你可以把它想象成房间里的无线门铃（类比）。按钮（发射器）被按下时，它发出一个“叮咚”信号，这个信号不需要知道谁会接收；房间里的灯（接收器）有一个“点亮”的槽函数，它被配置为监听“叮咚”信号。当信号发出，槽函数自动被调用。在技术上，信号与槽是Qt独创的一种用于对象间通信的类型安全、松散耦合的机制。

一个信号可以连接多个槽，一个槽也可以监听多个信号。连接建立后，当信号被发射（emit），所有与之相连的槽函数会依次被调用。这是Qt实现事件驱动的核心。

// 一个典型的信号槽连接示例
#include 
#include 

class MyWindow : public QWidget {
    public:
        MyWindow(QWidget *parent = nullptr) : QWidget(parent) {
            QPushButton *button = new QPushButton("点击我", this);
            // 连接：当按钮发出clicked()信号，这个窗口的close()槽函数将被调用
            connect(button, &QPushButton::clicked, this, &MyWindow::close);
        }
};

第一个Qt程序：从“Hello World”窗口开始

我们不用复杂的项目配置开始，而是从一个最简单的、纯代码的示例入手，让你看清Qt程序的骨架。请确保你已安装Qt 6.5和Qt Creator。

// main.cpp
#include 
#include 
#include 
#include 

int main(int argc, char *argv[])
{
    // 1. 每个Qt GUI程序必须有且只有一个QApplication对象，管理整个应用
    QApplication app(argc, argv);

    // 2. 创建主窗口部件（Widget）
    QWidget window;
    window.setWindowTitle("我的第一个Qt程序");
    window.resize(400, 300);

    // 3. 创建子控件
    QLabel *label = new QLabel("你好，Qt世界！");
    QPushButton *button = new QPushButton("点我改变文本");

    // 4. 创建布局管理器并添加控件（避免控件位置错乱）
    QVBoxLayout *layout = new QVBoxLayout(&window);
    layout->addWidget(label);
    layout->addWidget(button);

    // 5. 连接信号与槽：点击按钮，改变标签文字
    QObject::connect(button, &QPushButton::clicked, [label]() {
        label->setText("文本已被改变！");
    });

    // 6. 显示窗口
    window.show();

    // 7. 进入主事件循环，等待用户操作
    return app.exec();
}

在Qt Creator中创建一个新的“Qt Widgets Application”项目，用上述代码替换自动生成的`main.cpp`，然后编译运行（Ctrl+R）。你会看到一个带按钮的窗口，点击按钮，文字会改变。这里我们用了C++11的Lambda表达式（第27章内容）作为槽函数，这在处理简单逻辑时非常方便。

使用Qt Designer：可视化界面设计

手写代码创建复杂界面是痛苦的。Qt Designer是Qt提供的可视化界面设计工具，它生成`.ui`文件（本质是XML）。在项目中，`.ui`文件会被`uic`工具编译成对应的C++头文件，供你使用。

实际开发中，我通常用Designer完成90%的静态界面布局，只为需要动态交互或复杂逻辑的控件在代码中创建和操作。`.ui`文件编译后，会生成一个`ui_xxxx.h`文件，在你的窗口类中，通过`ui`成员指针来访问这些控件：

// 在MyWindow类的头文件中
namespace Ui { class MyWindow; } // 前向声明UI类

class MyWindow : public QWidget {
    private:
    public:
        MyWindow(QWidget *parent = nullptr);
        ~MyWindow();
    private:
        Ui::MyWindow *ui; // 指向UI对象的指针
};

// 在MyWindow类的cpp文件中
MyWindow::MyWindow(QWidget *parent) : QWidget(parent), ui(new Ui::MyWindow) {
    ui->setupUi(this); // 此调用创建了.ui文件中设计的所有控件
    // 现在可以通过ui->pushButton、ui->label等访问控件
    connect(ui->pushButton, &QPushButton::clicked, this, &MyWindow::onButtonClicked);
}