图形界面编程入门：Qt框架基础、信号与槽机制、常用控件、事件处理、简单计算器实现

说实话，很多学C++的朋友都问过我一个问题：「我学了这么久，怎么还是只能写黑乎乎的终端程序？」嗯，这个问题我太有感触了。当年我啃完《C++ Primer》后，看着满屏的cout输出，心里也挺不是滋味的。直到我接触了Qt——这个让我真正感受到「写程序也能这么爽」的框架。

这一章，我们就来聊聊Qt。我会带你从零开始，搭建一个简单的计算器。别怕，这东西没你想的那么复杂。

Qt框架是什么？

Qt是一个跨平台的C++图形用户界面框架。说白了，就是一套帮你画窗口、按钮、输入框的工具库。你写一份代码，可以在Windows、macOS、Linux上编译运行——我当年第一次在三个系统上跑通同一个程序时，差点感动哭了。

Qt的核心优势有这几个：

• 跨平台：一套代码，多平台运行
• 信号与槽：Qt独创的事件通信机制，后面我会重点讲
• 丰富的控件库：按钮、文本框、表格、树形控件……基本够用
• 完善的文档：官方文档写得相当良心，我至今还在翻

信号与槽机制——Qt的灵魂

这是Qt最让我惊艳的设计。传统的GUI编程里，你要监听按钮点击，得写一堆回调函数指针，维护起来特别痛苦。Qt的信号与槽，说白了就是：某个对象发出信号，另一个对象的槽函数自动响应。

举个例子：

// 按钮点击信号连接到窗口的关闭槽
connect(button, &QPushButton::clicked, this, &QWidget::close);

你看，这行代码的意思是：「当button被点击时，自动调用this的close函数」。简洁、直观、可读性强。

为什么会这样设计？我个人的理解是：Qt把事件通信做成了「发布-订阅」模式。信号发出者不需要知道谁会接收，接收者也不需要知道信号从哪来。这种解耦，在大型项目里特别有用。

常用控件一览

Qt的控件（Widget）种类很多，但常用的其实就那几个。我整理了一张表，方便你快速查阅：

嗯，这里要注意：控件的命名都是有规律的。Q开头的是Qt的类，后面跟的是功能描述。你看到QSlider就知道是滑块，看到QProgressBar就知道是进度条。Qt的命名规范，我个人觉得是C++框架里做得最好的之一。

事件处理机制

信号与槽是Qt的高级封装，底层其实还是事件（Event）。每个QObject都有一个event()函数，所有的事件都会经过这里分发。

事件处理的流程是这样的：

1. 用户操作（鼠标点击、键盘输入）产生系统事件
2. Qt将系统事件转换为QEvent对象
3. QEvent被发送到目标控件的event()函数
4. event()根据事件类型调用对应的事件处理函数（如mousePressEvent、keyPressEvent）
5. 事件处理函数内部可能发射信号（如clicked）

如果你想自定义事件处理，重写事件处理函数就行：

class MyButton : public QPushButton {
protected:
    void mousePressEvent(QMouseEvent *event) override {
        // 先处理自己的逻辑
        qDebug() << "按钮被按下了！";
        // 再调用父类处理（否则信号可能不触发）
        QPushButton::mousePressEvent(event);
    }
};

实战：简单计算器实现

理论说再多，不如动手写一个。我们来做一个支持加减乘除的简单计算器。

先看看整体结构：

好，现在我们来写代码。先创建一个Qt项目，我习惯用qmake，当然CMake也行：

// calculator.h
#ifndef CALCULATOR_H
#define CALCULATOR_H

#include <QWidget>
#include <QLineEdit>
#include <QPushButton>

class Calculator : public QWidget {
    Q_OBJECT  // 这个宏必须有，信号与槽才能工作

public:
    Calculator(QWidget *parent = nullptr);

private slots:
    void onDigitClicked();      // 数字按钮点击
    void onOperatorClicked();   // 运算符按钮点击
    void onEqualClicked();      // 等号按钮点击
    void onClearClicked();      // 清除按钮点击

private:
    QLineEdit *display;         // 显示框
    double currentValue;        // 当前值
    QString pendingOperator;    // 待执行的运算符
    bool waitingForOperand;     // 是否等待输入操作数
};

#endif

// calculator.cpp
#include "calculator.h"
#include <QVBoxLayout>
#include <QGridLayout>

Calculator::Calculator(QWidget *parent)
    : QWidget(parent), currentValue(0), waitingForOperand(true) {
    
    // 创建显示框
    display = new QLineEdit("0");
    display->setReadOnly(true);
    display->setAlignment(Qt::AlignRight);
    display->setFixedHeight(50);
    
    // 创建按钮
    QPushButton *btn7 = new QPushButton("7");
    QPushButton *btn8 = new QPushButton("8");
    // ... 其他按钮类似，这里省略
    
    // 布局
    QVBoxLayout *mainLayout = new QVBoxLayout(this);
    mainLayout->addWidget(display);
    
    QGridLayout *grid = new QGridLayout;
    // 添加按钮到网格布局
    grid->addWidget(btn7, 0, 0);
    grid->addWidget(btn8, 0, 1);
    // ... 省略其他
    
    mainLayout->addLayout(grid);
    
    // 连接信号与槽
    connect(btn7, &QPushButton::clicked, this, &Calculator::onDigitClicked);
    connect(btn8, &QPushButton::clicked, this, &Calculator::onDigitClicked);
    // ... 其他按钮连接
}

void Calculator::onDigitClicked() {
    QPushButton *btn = qobject_cast<QPushButton*>(sender());
    if (!btn) return;
    
    int digit = btn->text().toInt();
    
    if (waitingForOperand) {
        display->setText(QString::number(digit));
        waitingForOperand = false;
    } else {
        display->setText(display->text() + QString::number(digit));
    }
}

void Calculator::onOperatorClicked() {
    QPushButton *btn = qobject_cast<QPushButton*>(sender());
    if (!btn) return;
    
    double value = display->text().toDouble();
    
    if (!pendingOperator.isEmpty()) {
        // 如果有待执行的运算符，先计算
        if (pendingOperator == "+") currentValue += value;
        else if (pendingOperator == "-") currentValue -= value;
        else if (pendingOperator == "*") currentValue *= value;
        else if (pendingOperator == "/") {
            if (value == 0.0) {
                display->setText("错误：除数不能为0");
                return;
            }
            currentValue /= value;
        }
    } else {
        currentValue = value;
    }
    
    pendingOperator = btn->text();
    waitingForOperand = true;
    display->setText(QString::number(currentValue));
}

void Calculator::onEqualClicked() {
    double value = display->text().toDouble();
    
    if (!pendingOperator.isEmpty()) {
        if (pendingOperator == "+") currentValue += value;
        else if (pendingOperator == "-") currentValue -= value;
        else if (pendingOperator == "*") currentValue *= value;
        else if (pendingOperator == "/") {
            if (value == 0.0) {
                display->setText("错误：除数不能为0");
                return;
            }
            currentValue /= value;
        }
        pendingOperator.clear();
    }
    
    display->setText(QString::number(currentValue));
    waitingForOperand = true;
}

void Calculator::onClearClicked() {
    display->setText("0");
    currentValue = 0;
    pendingOperator.clear();
    waitingForOperand = true;
}

好了，到这里你已经掌握了Qt图形编程的核心概念。信号与槽、常用控件、事件处理、布局管理——这些东西组合起来，能做的事情远超你的想象。我当年用Qt写第一个图形程序时，那种「终于能做出看得见摸得着的东西」的感觉，至今记忆犹新。

动手试试吧。把上面的代码敲一遍，然后试着加个「平方根」功能，或者改个皮肤颜色。你会发现，图形编程其实没那么神秘——它就是把你的逻辑，用视觉的方式呈现出来而已。