Qt入门培训教材

1、目录Qt入门31开发环境配置31.1下载31.2配置环境变量31.3设置编译器31.4设置调试器31.5QtCreator快捷键42第一个Qt项目52.1使用QtCreator5创建Qt项目5编辑项目代码5构建运行项目72.2使用帮助文档72.3使用设计器7通过设计器来实现一个简单界面。72.4使用Qt语言家93Qt控件124窗口164.1对话框164.2消息框164.3菜单栏174.4工具栏174.5状态栏175布局管理185.1垂直线性布局185.2水平线性布局185.3网格布局196信号与槽216.1使用Qt定义的信号与槽216.2自定义信号与槽21信号的声明21信号的发送22槽函数的声

2、明22槽函数的实现22连接信号和槽227事件248Model-View架构258.1自定义模型25自定义模型26模型的实现28模型的使用318.2自定义委托31委托的定义31委托的实现32委托的使用349内存管理36Qt入门1 开发环境配置1.1 下载从Qt官网（/downloads）下载。，下载后使用了默认的安装路径C:Qt。1.2 配置环境变量Win7系统下，“计算机”-右键属性-高级系统设置，在系统属性对话框里选择“高级”tab，点击最下方的“环境变量”。或者 控制面板-系统和安全-系统-高级系统设置，打开系统属性对话框。² 配置PATH环境变量，在环境变量PAT

3、H的值的最后添加Qt安装路径下bin目录的位置（根据实际情况进行设置，我这里是C:QtQtmsvc2012_openglbin）。² 配置QTDIR环境变量，检查是否有QTDIR环境变量，没有则新建，设置其值为bin目录的上层目录（根据实际情况进行设置，我这里是C:QtQtmsvc2012_opengl）。1.3 设置编译器打开QtCreator，菜单栏上选择“工具”-“选项”，弹出选项对话框，选项对话框左侧列表中选择“构建和运行”，切换到编译器tab，能查看到已有的编译器。Linux下，QtCreator自动检测已安装的gcc作为其编译器。Windo

4、ws下，QtCreator能自动检测到已安装的VS编译器。1.4 设置调试器打开QtCreator，菜单栏上选择“工具”-“选项”，弹出选项对话框，左侧列表中选择“构建和运行”，切换到Debuggers Tab，查看已有的调试器。Linux下，QtCreator检测已安装的gdb作为其调试器。Windows下，需要手动下载安装CDB，之后QtCreator能将其作为调试器。下载地址：1.5 QtCreator快捷键Ctrl + B构建Ctrl + R运行F5调试启动F9新建/删除断点F10单步调试（不进入函数）F11单步调试（进入函数内部）F2转到定义2 第一个Qt项目通过helloqt 项目

5、，掌握QtCreator、Designer、Linguist的使用。2.1 使用QtCreator2.1.1 创建Qt项目在QtCreator编辑视图左侧区域点右键，选择“新建项目”，弹出新建项目对话框，在项目下选择“应用程序”，右侧选择“Qt Widget Application”，点击“choose按钮”。弹出Qt Widget Application对话框。项目介绍和位置页，设置名称和创建路径，下一步；Kit Selection页，可配置Debug版和Release版程序的生成路径，下一步；类信息页，设置类名、基类、头文件、源文件、去掉“创建界面”的勾选，下一步；项目管理页，完成。2.1

6、.2 编辑项目代码编辑头文件mainwindow.h#ifndef MAINWINDOW_H#define MAINWINDOW_H#include <QMainWindow>#include <QPushButton>/ 手动添加class MainWindow : public QMainWindow Q_OBJECTpublic: MainWindow(QWidget *parent = 0); MainWindow();private: QPushButton * m_pPBHello;/ 手动添加;#endif / MAINWINDOW_H编辑源码文件main

7、window.cpp#include "mainwindow.h"MainWindow:MainWindow(QWidget *parent) : QMainWindow(parent)/ 添加下列三行 m_pPBHello = new QPushButton(this); m_pPBHello->setText(tr("Hello, Qt!"); m_pPBHello->move(10, 10);MainWindow:MainWindow()查看一下main.cpp#include "mainwindow.h"#incl

8、ude <QApplication>int main(int argc, char *argv) QApplication a(argc, argv); MainWindow w; w.show(); return a.exec();2.1.3 构建运行项目编辑视图左侧区域，在项目“helloqt”上右键，选择“将项目设置为活动项目”，按下Ctrl + B 构建项目，按下Ctrl + R 运行项目。程序启动后即可看到界面，第一个Qt项目运行成功。练习1：熟悉QtCreator的界面，重点查看菜单栏中，“构建”和“调试”中的菜单项；并查看菜单栏“工具”-“选项”，选项对话框中的各种设

9、置。练习2：使用QtCreator创建一个Qt Widgets Application，查看自动生成的代码文件和pro后缀的项目文件，并运行项目。2.2 使用帮助文档QtCreator左侧选择“帮助”，点击帮助界面左上角的下拉列表，选择“索引”，在查找框中输入QPushButton，点击下方匹配的结果即可查看QPushButton相关帮助。练习3：使用Assistant查看QPushButton的用法。2.3 使用设计器除了手写代码实现界面，还可以通过在设计器中拖拽控件进行界面设计，拖拽出的界面信息记录在相应的ui文件中。构建项目时，Qt会通过ui文件里的信息生成以ui_开头的.h文件，存放在

10、项目的生成路径下。要在项目中使用拖拽出来的界面就必须包含该生成的头文件。一般而言，程序界面最好通过手写代码来实现，这样操控性更好。本人通过使用设计器拖拽过几次界面，感觉不太习惯，还是手写代码好，不过仍然可以通过使用设计器来学习Qt控件的用法。2.3.1 通过设计器来实现一个简单界面。点击QtCreator左侧的“编辑”，切换到编辑视图，在项目helloqt上右键，选择“添加新文件”，弹出新建文件对话框。在文件和类下选择“Qt”，右侧选择“Qt设计师界面类”，choose。弹出Qt设计师界面类对话框。选择界面模板页，在“templateforms”下选择“Dialog without butto

11、ns”，下一步；选择类名页，设置类名CDlgTest，下一步；项目管理页，完成。自动跳转到设计视图。在设计视图中，从左侧工具箱里，“buttons”下拖动Push Button到窗体中。QtCreator左侧栏中点击“编辑”，切换回编辑视图。编辑mainwindow.h/ #include <QMainWindow>#include <QPushButton>#include "cdlgtest.h"/ 包含拖拽产生的对话框类的头文件class MainWindow : public QMainWindow/ / 添加以下三行private: QPu

12、shButton * m_pPBHello; CDlgTest * m_pDlg;/ 编辑mainwindow.cpp#include "mainwindow.h"MainWindow:MainWindow(QWidget *parent) : QMainWindow(parent)/ / 添加以下三行 m_pDlg = new CDlgTest(this); connect(m_pPBHello, SIGNAL(clicked(), m_pDlg, SLOT(show();MainWindow:MainWindow()Helloqt项目上右键，选择“执行qmake”。执行

13、qmake会更新项目生成路径下的makefile文件，保证新添加进项目的代码文件也会被编译，否则可能会在构建项目时出现找不到符号之类的错误。按下Ctrl + B 构建项目，由ui文件转换得到的头文件会存放在项目生成路径下。按下Ctrl + R运行项目。程序运行后，点击按钮即可弹出使用设计器拖拽出的对话框。练习4：向项目里添加一个使用设计器拖拽出的对话框界面，查看设计器拖拽出的界面是如何通过代码进行引用，构建项目后到生成路径下查看生成的头文件，运行项目。2.4 使用Qt语言家源代码中经常会出现一些字符串，比如定义要显示在控件上的文本，在不同的语言环境下，可能会需要显示不同语言对应的文本。针对多语

14、言切换的需求，Qt提供的解决方案是，在所有需要翻译的字符串处都使用QObject:tr()函数，Qt提取出所有QObject:tr()函数的参数，使用Qt语言家对其进行翻译后发布，Qt程序可以在运行时加载发布的翻译文件以更新文本字符串。此外，还能通过这种方案解决不同主机间字符集差异引起的字符乱码问题。在项目面板下，双击对其进行编辑，在最后加上一行TRANSLATIONS += helloqt_zh_CN.ts在菜单栏上选择“工具”-“外部”-“Qt语言家”-“更新翻译”在helloqt项目路径下生成文件helloqt_zh_CN.ts在任务栏上“开始”-“所有程序”-“”

15、- “5.3”-“MSVC 2012 opengl”-“Linguist” 打开Qt语言家，“文件”-“打开” 选择helloqt项目路径下的helloqt_zh_CN.ts。左侧上下文面板中，选择MainWindow，在源文下选择”Hello, Qt!”，在下方面板中，汉语 译文输入框中输入“你好 Qt!”，再点击源文列表下”Hello, Qt!”前面的问号图标，变为勾号。确认这一行已翻译。Qt语言家的菜单栏中，“文件”-“保存”， 再“文件”-“发布”，在helloqt 项目路径下生成文件helloqt_zh_CN.qm。回到QtCreator，编辑main.cpp#include &qu

16、ot;mainwindow.h"#include <QApplication>#include <QTranslator>int main(int argc, char *argv) QApplication a(argc, argv); QTranslator translator; translator.load("helloqt_zh_CN"); a.installTranslator(&translator); MainWindow w; w.show(); return a.exec();构建项目，将helloqt_zh_

17、CN.qm与生成的exe放在同一目录下，双击运行exe，即可看到程序界面上的文字显示为中文了。练习5：在项目代码中使用tr()函数来生成QString对象，练习使用Linguist来翻译字符串，并在程序中使用发布后的文件。3 Qt控件类名控件常用函数QLabel标签setText()setPixmap()setBuddy()setAlignment() setIndent()QCheckBox复选框setText()setChecked()QRadioButton单选框setText()setChecked()QLineEdit单行文本编辑框QComboBox组合框insertItem()se

18、tItemText()addItem()clear()currentIndex()QPushButton按钮setText()setIcon()QListWidget 列表（基于Item）insertItem()takeItem()currentItem()setCurrentItem()count()QTableWidget表格（基于item）setColumnCount()setItem()setHorizontalHeaderLabels()setVerticalHeaderLabels()setRowCount()columnCount()rowCount()itemAt()clear

19、()QTreeWidget树（基于item）setColumnCount()setHeaderLabels()addTopLevelItem()clear()currentItem()expandItem()QListView 列表（基于model - view）QTableView表格（基于model - view）QTreeView树（基于model - view）QGroupBox分组框setTitle()setLayout()QSplitter分割器addWidget()setStretchFactor()QWidget小部件sizeHint()setSizePolicy()resiz

20、e()show()hide()close()setLayout()QTabWidget 标签部件addTab()removeTab()setTabText()setTabEnabled()QDialog对话框exec()show()setModal()QMainWindow主窗口setCentralWidget()menuBar()addToolBar()statusBar()练习6：查看各控件的帮助；在项目中练习使用上述控件，并查看最终效果。4 窗口4.1 对话框 QDialog dlg; dlg.setWindowTitle(tr("Dialog"); dlg.exec

21、();/ 显示模态对话框 QDialog * dlg2 = new QDialog(this); dlg2->setWindowTitle(tr("Dialog2"); dlg2->setModal(true); dlg2->show();/ 不添加上一行时，显示非模态对话框4.2 消息框 / 消息框 int ret = QMessageBox:information(this, tr("title"), tr("text"); / 询问框 ret = QMessageBox:question(this, tr(&q

22、uot;title"), tr("text"); if (QMessageBox:Yes = ret) qDebug("dont click yes"); / 警告框 ret = QMessageBox:warning(this, tr("title"), tr("text"), QMessageBox:Ok | QMessageBox:Cancel, QMessageBox:Cancel); if (QMessageBox:Ok != ret) qWarning("warning")

23、; 练习7：分别练习模态和非模态对话框的显示；在程序中使用上述三种消息对话框。4.3 菜单栏 QMenu * mnFile = new QMenu(tr("File"); QAction * actOpen = new QAction(tr("&Open"), this); menuBar()->addMenu(mnFile);/ 第一次调用menuBar()时将创建菜单栏 mnFile->addAction(actOpen);4.4 工具栏 QToolBar * toolbar = new QToolBar(this); addTo

24、olBar(toolbar);/ 工具栏需要手动添加到界面 QAction * actOpen = new QAction(tr("&Open"), this); toolbar->addAction(actOpen);4.5 状态栏 statusBar();/ 第一次调用statusBar()将创建状态栏 statusBar()->showMessage(tr("Ready"), 2000);练习8：创建一个Qt Widget项目，为主界面添加菜单栏、工具栏和状态栏。5 布局管理常用的布局管理有三种，垂直线性布局，水平线性布局，网格

25、布局。5.1 垂直线性布局被QVBoxLayout管理的部件按添加的先后顺序在垂直方向上排成一列。 QWidget * window = new QWidget();QPushButton * button = new QPushButton(); QPushButton * button1 = new QPushButton(); QSpacerItem * spaceItem = new QSpacerItem(10, 10, QSizePolicy:Minimum, QSizePolicy:Expanding); QVBoxLayout * layout = new QVBoxLayou

26、t();layout->addWidget(button); layout->addWidget(button1); layout->addItem(spaceItem);/添加它来占据垂直方向上所有剩余的空间 window->setLayout(layout);5.2 水平线性布局被QHBoxLayout管理的部件按添加进来的先后顺序在水平方向上排成一行。 QWidget * window = new QWidget(); QPushButton * button = new QPushButton(); QPushButton * button1 = new QPu

27、shButton(); QSpacerItem * spaceItem = new QSpacerItem(10, 10, QSizePolicy:Expanding, QSizePolicy:Minimum); QHBoxLayout * layout = new QHBoxLayout(); layout->addWidget(button); layout->addWidget(button1); layout->addItem(spaceItem);/ 添加它来占据水平方向上所有剩余空间 window->setLayout(layout);5.3 网格布局QGr

28、idLayout将空间划分成网格，其中的每一个部件占据其中的一格或几格。添加一个部件时指定其占据的行号、列号、行数、列数、对齐方式。 QWidget * pWindow = new QWidget(); QPushButton * pBtn = new QPushButton(tr(“pBtn”); QPushButton * pBtn1 = new QPushButton(tr(“pBtn1”); QPushButton * pBtn2 = new QPushButton(tr(“pBtn2”); QGridLayout * pLayout = new QGridLayout(); pLay

29、out->addWidget(pBtn, 0, 0, 1, 2, 0); pLayout->addWidget(pBtn1, 1, 0, 1, 1, 0); pLayout->addWidget(pBtn2, 1, 1, 1, 1, 0); pLayout->setRowMinimumHeight(0, 30); pLayout->setColumnMinimumWidth(0, 30); pLayout->setRowStretch(0, 0); pLayout->setRowStretch(1, 1); pLayout->setColumnS

30、tretch(0, 1); pLayout->setColumnStretch(1, 1); pWindow->setLayout(pLayout);练习9：结合三种常用布局和常用控件，实现记事本的查找对话框。6 信号与槽信号和槽是Qt中进行对象间通讯的一种机制。对象状态改变时，主动发送一个信号，与此信号相连接的槽将接收到这个信号，发送信号的对象不知道也不关心哪些槽将接收到这个信号。槽是一个能对信号进行响应的函数。一旦一个槽与一个信号相连接了，槽函数将在信号发送后被调用。所有继承自QObject及其子类的类都可以包含信号和槽。一个信号可以与多个槽相连接，一个槽也可以与多个信号相连接

31、。槽能用来接收信号，它也是普通的成员函数。信号和槽可以有任意多个任意类型的参数，参数类型和排列顺序要相匹配，信号的参数个数可以多于槽，多余的参数将被忽视。6.1 使用Qt定义的信号与槽 connect(m_pPBHello, SIGNAL(clicked(), m_pDlg, SLOT(show();6.2 自定义信号与槽6.2.1 信号的声明/ class MainWindow : public QMainWindow Q_OBJECT/ signals: void btnClicked(bool, int, QString);/ ;/ 6.2.2 信号的发送发送信号时，使用Qt定义的关键字

32、emit，同时指定信号相关的参数。 emit btnClicked(true, 20, tr("");6.2.3 槽函数的声明声明槽函数时，使用Qt定义的关键字slots，也可以指定public等访问控制符。class MainWindow : public QMainWindowQ_OBJECT/ private slots: void emitMySignal();void showDlg(bool b, int num);/ ;6.2.4 槽函数的实现槽函数的实现与普通函数一致。6.2.5 连接信号和槽使用connect函数连接信号和槽，第一个参数为信号的发出者，第二

33、个参数为具体的信号，需要使用SIGNAL()宏，第三个参数为信号的接收者，第四个参数为接收信号的槽函数，需要使用SLOT()宏。 connect(m_pPBHello, SIGNAL(clicked(), this, SLOT(emitMySignal(); connect(this, SIGNAL(btnClicked(bool,int,QString), this, SLOT(showDlg(bool,int);练习10：练习自定义信号和槽函数，熟悉其用法。练习11：查看帮助文档，了解常用控件发送的信号。7 事件事件是由系统或Qt在不同的时刻发出的，比如，鼠标释放事件，窗口关闭事件，计时器

34、事件。通常情况下，我们并不需要关心事件，Qt组件会在需要我们关心的事件发生时发送信号。但是在某些情形下，仍需要我们对一些事件进行处理，比如，响应拖拽，对控件进行自绘。当需要自己处理Qt已经定义的事件时，我们需要继承Qt的类，重写相关事件的响应函数，在函数体进行一些操作，比如发送适当的信号之类的。练习12：重绘控件，比如QPushButton。(提示：重写paintEvent函数)练习13：响应鼠标的拖拽事件，拖拽树控件上的结点到表格上进行显示。（提示：查看QDrag、QMimeData、重写QWidget的mousePressEvent、mouseMoveEvent、dragEnterEven

35、t、dropEvent相关函数）8 Model-View架构传统的MVC模式，即模型、视图、控制器，分别实现管理数据、显示数据、处理用户输入的功能。Qt把视图和控制器组合在一起，形成其独特的Model-View架构，只对模型进行修改，即可完成视图的更新。Qt中使用Model/View架构的最主要的有三个类，QTableView、QTreeView、QListView，支持自定义模型对数据进行管理，和自定义委托处理数据的显示和编辑。对于一般数据量不多的情况，使用相对应的三个基于Item/View的类QTableWidget、QTreeWidget、QListWidget，对结点Item进行操作即

36、可满足需求。8.1 自定义模型模型对数据进行管理，并对外提供操作接口，使得视图从模型中取出要显示的数据，用户能向模型中加入新数据及更新已有数据。如果将一个模型注册到多个视图，对模型进行一次修改，那么所有的视图都将同步更新。示例：表格中将显示所有员工的信息，每一行显示一个员工，每一列显示员工的一个属性值。员工类CEmployee#ifndef CEMPLOYEE_H#define CEMPLOYEE_H#include <QObject>class CEmployee : public QObject Q_OBJECTpublic: explicit CEmployee(QObjec

37、t * parent = 0); explicit CEmployee(QString name, int age, char gender, bool married, QString department, QObject *parent = 0); CEmployee(const CEmployee & employee); CEmployee& operator =(const CEmployee & employee); QString GetName(); void SetName(const QString & name); int GetAge(

38、); void SetAge(int age); char GetGender(); void SetGender(char gender = 'M'); bool isMarried(); void setMarried(bool married); QString GetDepartment(); void SetDepartment(const QString & department);private: QString name; int age; char gender; bool married; QString department;Q_DECLARE_M

39、ETATYPE(CEmployee)#endif / CEMPLOYEE_H为了能在调用setData()时将CEmployee类的变量传给QVariant类型的参数，需要使用宏Q_DECLARE_METATYPE对类进行声明。8.1.1 自定义模型对于表格的模型而言，必须实现rowCount()、columnCount()、data()函数,rowCount()返回视图应该显示的行数，columnCount()返回视图应显示的列数，data()函数根据参数返回请求获取的数据。另外，实现headerData()函数以控制表头的显示。如果要自定义委托对数据进行编辑，那么setData()和fla

40、gs()是必须实现的两个函数，数据编辑结束后会调用setData()更新模型中的数据，调用flags()来判断某些位置是否可以进行编辑等。CEmployeeTableModel类#ifndef CEMPLOYEETABLEMODEL_H#define CEMPLOYEETABLEMODEL_H#include <QAbstractTableModel>#include <QVector>#include "cemployee.h"class CEmployeeTableModel : public QAbstractTableModel Q_OBJE

41、CTpublic: explicit CEmployeeTableModel(QObject *parent = 0); int rowCount(const QModelIndex & parent = QModelIndex() const; int columnCount(const QModelIndex & parent = QModelIndex() const; QVariant data(const QModelIndex & index, int role = Qt:DisplayRole) const; QVariant headerData(int

42、 section, Qt:Orientation orientation, int role = Qt:DisplayRole) const; bool setData(const QModelIndex & index, const QVariant & value, int role = Qt:EditRole); Qt:ItemFlags flags(const QModelIndex & index) const;signals:public slots:private: QStringList headers; QVector<CEmployee *&g

43、t; datas; enum COLUMN_NAME = 0, COLUMN_AGE, COLUMN_GENDER, COLUMN_MARRIED, COLUMN_DEPARTMENT ;#endif / CEMPLOYEETABLEMODEL_H8.1.2 模型的实现需要注意以下几个经常在模型中出现的类和枚举，QModelIndex指示要操作的具体位置，比如数据所在列，所在行；Qt定义的role相关的枚举值表示操作的数据将以什么角色被使用，比如用来进行显示，用来提供给编辑器进行编辑；QVariant类是一个包装类型，对Qt定义的大部分数据类型都有相关的转换方法，它也能包装自定义类型的数据。#

44、include "cemployeetablemodel.h"CEmployeeTableModel:CEmployeeTableModel(QObject *parent) : QAbstractTableModel(parent) headers << "Name" << "Age" << "Gender" << "married?" << "Department"int CEmployeeTableModel:

45、rowCount(const QModelIndex &parent) const return datas.count();int CEmployeeTableModel:columnCount(const QModelIndex &parent) const return headers.count();QVariant CEmployeeTableModel:data(const QModelIndex &index, int role) const if (role = Qt:TextAlignmentRole) return Qt:AlignHCenter |

46、 Qt:AlignBottom; else if (role = Qt:DisplayRole | role = Qt:EditRole) && index.row() < datas.count() CEmployee * employee = datas.at(index.row(); switch(index.column() case COLUMN_NAME: return employee->GetName(); case COLUMN_AGE: return employee->GetAge(); case COLUMN_GENDER: retur

47、n employee->GetGender(); case COLUMN_MARRIED: return employee->isMarried(); case COLUMN_DEPARTMENT: return employee->GetDepartment(); return QVariant();QVariant CEmployeeTableModel:headerData(int section, Qt:Orientation orientation, int role) const if (role = Qt:DisplayRole && orien

48、tation = Qt:Horizontal && section < headers.count() return headers.at(section); return QVariant();bool CEmployeeTableModel:setData(const QModelIndex &index, const QVariant &value, int role) if (role = Qt:UserRole) CEmployee * employee = value.value<CEmployee *>(); if (index.

49、row() >= datas.count() datas.append(employee); else if (index.row() > 0) datas.insert(index.row(), employee); else datas.append(employee); return true; else if (role = Qt:EditRole && index.row() < datas.count() CEmployee * employee = datas.at(index.row(); switch (index.column() case

50、 COLUMN_NAME: employee->SetName(value.toString(); break; case COLUMN_AGE: employee->SetAge(value.toInt(); break; case COLUMN_GENDER: employee->SetGender(value.toChar().cell(); break; case COLUMN_MARRIED: employee->setMarried(value.toBool(); break; case COLUMN_DEPARTMENT: employee->Set

51、Department(value.toString(); break; default: break; return true; return false;Qt:ItemFlags CEmployeeTableModel:flags(const QModelIndex &index) const if (index.column() = COLUMN_NAME | index.column() = COLUMN_AGE | index.column() = COLUMN_GENDER | index.column() = COLUMN_MARRIED) return QAbstract

52、TableModel:flags(index) | Qt:ItemIsEditable; return QAbstractTableModel:flags(index);8.1.3 模型的使用 tableView = new QTableView(this);tableModel = new CEmployeeTableModel(tableView);tableView->setModel(tableModel);向模型中添加数据 QModelIndex index = tableModel->index(0, 0, QModelIndex(); CEmployee * employee = new CEmployee(tr("Jake"), 24, 'M', true, tr("RD"), this);