Qt GUI 库总结

Qt GUI 库总结

Qt GUI 库（QtGui）是 Qt 框架中负责图形用户界面（GUI）开发的核心模块。本文将一步步详解 QtGui，从基础入门到高级应用，帮助你全面掌握其功能。以下内容包括环境配置、基本功能、核心特性及进阶技巧，配以代码示例。

---

1. 准备工作

• 创建项目：在 Qt Creator 中选择 Qt Widgets Application，生成项目文件（.pro）：

  QT += core gui widgets
  SOURCES += main.cpp
  

---

2. 入门：创建第一个窗口

使用 QWidget 创建一个简单窗口。

代码示例：

#include <QApplication>
#include <QWidget>int main(int argc, char *argv[]) {QApplication app(argc, argv);QWidget window;window.setWindowTitle("我的第一个 Qt 窗口");window.resize(400, 300);window.show();return app.exec();
}

步骤解析：

1. QApplication 初始化应用程序。
2. QWidget 创建窗口，设置标题和大小。
3. show() 显示窗口，exec() 启动事件循环。

结果：运行后出现一个 400x300 的空白窗口。

---

3. 基础功能：绘图与事件

3.1 绘图（QPainter）

使用 QPainter 在窗口上绘制图形。

代码示例：

#include <QApplication>
#include <QWidget>
#include <QPainter>class MyWidget : public QWidget {
protected:void paintEvent(QPaintEvent *) override {QPainter painter(this);painter.setPen(Qt::red);painter.drawRect(50, 50, 100, 100);painter.drawText(70, 100, "Hello Qt");}
};int main(int argc, char *argv[]) {QApplication app(argc, argv);MyWidget window;window.resize(200, 200);window.show();return app.exec();
}

步骤解析：

1. 继承 QWidget，重写 paintEvent。
2. 使用 QPainter 绘制红色矩形和文本。

结果：窗口显示红色矩形和 “Hello Qt” 文本。

3.2 事件处理

处理用户输入，如鼠标点击。

代码示例：

#include <QApplication>
#include <QWidget>
#include <QMouseEvent>
#include <QDebug>class MyWidget : public QWidget {
protected:void mousePressEvent(QMouseEvent *event) override {qDebug() << "点击坐标:" << event->pos();}
};int main(int argc, char *argv[]) {QApplication app(argc, argv);MyWidget window;window.resize(200, 200);window.show();return app.exec();
}

步骤解析：

1. 重写 mousePressEvent。
2. 使用 event->pos() 获取点击位置。

结果：点击窗口时，控制台输出坐标。

---

4. 核心功能：窗口与对话框

4.1 创建对话框

使用 QDialog 创建模态对话框。

代码示例：

#include <QApplication>
#include <QDialog>
#include <QPushButton>int main(int argc, char *argv[]) {QApplication app(argc, argv);QDialog dialog;dialog.setWindowTitle("对话框示例");QPushButton button("关闭", &dialog);button.setGeometry(50, 50, 80, 30);QObject::connect(&button, &QPushButton::clicked, &dialog, &QDialog::accept);dialog.exec();return app.exec();
}

步骤解析：

1. QDialog 创建对话框。
2. 添加按钮并连接信号，点击后关闭。

结果：显示模态对话框，点击按钮关闭。

---

5. 进阶：自定义与动画

5.1 自定义控件

创建自定义按钮。

代码示例：

#include <QApplication>
#include <QWidget>
#include <QPainter>
#include <QMouseEvent>class MyButton : public QWidget {Q_OBJECT
public:MyButton(QWidget *parent = nullptr) : QWidget(parent) {setFixedSize(100, 50);}protected:void paintEvent(QPaintEvent *) override {QPainter painter(this);painter.setBrush(Qt::blue);painter.drawRect(0, 0, width(), height());painter.drawText(rect(), Qt::AlignCenter, "点击");}void mousePressEvent(QMouseEvent *) override {emit clicked();}signals:void clicked();
};int main(int argc, char *argv[]) {QApplication app(argc, argv);MyButton button;QObject::connect(&button, &MyButton::clicked, []() {qDebug() << "按钮被点击!";});button.show();return app.exec();
}
#include "main.moc"

步骤解析：

1. 继承 QWidget，绘制蓝色按钮。
2. 定义 clicked 信号，点击时触发。

结果：显示蓝色按钮，点击输出消息。

5.2 添加动画

使用 QPropertyAnimation 为控件添加动画。

代码示例：

#include <QApplication>
#include <QPushButton>
#include <QPropertyAnimation>int main(int argc, char *argv[]) {QApplication app(argc, argv);QPushButton button("移动我");button.show();QPropertyAnimation animation(&button, "geometry");animation.setDuration(2000);animation.setStartValue(QRect(0, 0, 100, 30));animation.setEndValue(QRect(200, 200, 100, 30));animation.start();return app.exec();
}

步骤解析：

1. 创建按钮并设置动画。
2. 定义动画起止位置，持续 2 秒。

结果：按钮从左上角移动到右下角。

---

6. 精通：优化与调试

6.1 性能优化

减少重绘以提升性能。

代码示例：

#include <QApplication>
#include <QWidget>
#include <QPainter>
#include <QTimer>class OptWidget : public QWidget {
public:OptWidget() {timer = new QTimer(this);timer->setSingleShot(true);connect(timer, &QTimer::timeout, this, &OptWidget::update);}protected:void paintEvent(QPaintEvent *) override {QPainter painter(this);painter.drawLine(0, 0, width(), height());}void resizeEvent(QResizeEvent *) override {timer->start(50); // 延迟重绘}private:QTimer *timer;
};int main(int argc, char *argv[]) {QApplication app(argc, argv);OptWidget window;window.resize(300, 200);window.show();return app.exec();
}

步骤解析：

1. 使用 QTimer 延迟重绘。
2. 避免频繁调整窗口大小时的重复绘制。

结果：窗口调整大小时性能更优。

6.2 调试

监视事件以调试程序。

代码示例：

#include <QApplication>
#include <QWidget>
#include <QEvent>
#include <QDebug>class DebugWidget : public QWidget {
protected:bool event(QEvent *event) override {qDebug() << "事件:" << event->type();return QWidget::event(event);}
};int main(int argc, char *argv[]) {QApplication app(argc, argv);DebugWidget window;window.show();return app.exec();
}

步骤解析：

1. 重写 event() 输出事件类型。
2. 用于跟踪程序行为。

结果：控制台显示所有事件类型。

---