Qt本质上只是一个对C++进行了全面封装的界面库和功能库
我们只需了解其常用功能和核心原理即可，细节之处不必逐一死记
下面基本汇总了Qt自带的所有控件，入手慢的给出了一些基本的使用代码
QWidget：所有Qt控件的基类
QFrame：加强版的QWidget
增加了边框功能，可以为控件设置边框样式和阴影，比QWidget支持更多的stylesheet
//设置QFrame边框形状和阴影
QFrame *frame = new QFrame();
frame->setWindowTitle("QFrame");
frame->setGeometry(100, 100, 1280, 720);
frame->setFrameShape(QFrame::WinPanel);
frame->setFrameShadow(QFrame::Plain);
frame->setFrameStyle(QFrame::WinPanel | QFrame::Plain);
frame->show();QLabel：文本标签
//窗口
QMainWindow window;
window.setGeometry(100, 100, 800, 450);
window.show();
//窗口主内容区域
QWidget *centralWidget = new QWidget(&window);
window.setCentralWidget(centralWidget);
//添加QLabel控件
QLabel *label = new QLabel(centralWidget);
label->setGeometry(50, 50, 200, 50);
label->setText("QLabel");QLineEdit ：单行文本编辑框
//添加QLineEdit控件
QLineEdit *edit = new QLineEdit(centralWidget);
edit->setGeometry(50, 50, 200, 50);
edit->setText("QLineEdit2");QTextEdit ：多行文本编辑框
//添加QTextEdit控件
QTextEdit *edit = new QTextEdit(centralWidget);
edit->setGeometry(50, 50, 200, 50);
edit->setText("QTextEdit");
edit->setHtml("<h1>Header Level 1</h1>");QPlainTextEdit ：处理大型文本的编辑框
QPlainTextEdit由QTextEdit优化而来，使其更适合处理大型文本
QPlainTextEdit文本处理效率的提升，是以牺牲细节为代价的，因此在界面展现上会逊色于QTextEdit
//添加QPlainTextEdit控件
QPlainTextEdit *edit = new QPlainTextEdit(centralWidget);
edit->setGeometry(50, 50, 200, 600);
edit->setPlainText("QPlainTextEdit"); //设置文本
edit->insertPlainText("Insert Text\n"); //头部插入文本
edit->appendPlainText("Append Text"); //尾部添加文本
edit->appendHtml("<h1 style='color:red;'>HTML</h1>"); //添加HTML文本
QString plainText = edit->toPlainText(); //获取普通文本，HTML代码也将只保留字面文字
cout << plainText.toStdString() << endl;QTextBrowser：文本浏览器
用于显示复杂格式的文本，不能编辑
QPushButton：按钮
//窗口
QMainWindow window;
window.setGeometry(100, 100, 800, 450);
window.show();
//窗口主内容区域
QWidget *centralWidget = new QWidget(&window);
window.setCentralWidget(centralWidget);
//添加QPushButton控件
QPushButton *button = new QPushButton(centralWidget);
button->setGeometry(50, 50, 200, 50);
button->setText("QPushButton");QToolButton：工具按钮
一般摆放在QToolBar中，不但可以显示文字，还可以显示图标
QRadioButton：单选框
一般摆放在QButtonGroup中，一组只能选中一个
QCommandLinkButton：选项按钮
用于选项对话框中，从多个选项中选择一个选项
QDialogButtonBox：对话框按钮组
提供了对话框中常用的按钮，可以任意组合
QCheckBox：复选框
QComboBox：下拉框
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//设置下拉选项
QComboBox *comboBox = w.ui->comboBox;
comboBox->insertItem(comboBox->count(), "item-1");
comboBox->insertItem(comboBox->count(), "item-2");
comboBox->insertItem(comboBox->count(), "item-3");
comboBox->insertItem(comboBox->count(), "item-4");
comboBox->insertItem(comboBox->count(), "item-5");
//设置选中项
comboBox->setCurrentIndex(2);QFontComboBox：字体选择框
可选择所有已安装的系统字体
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//设置初始项
QFontComboBox *fontComboBox = w.ui->fontComboBox;
fontComboBox->setCurrentIndex(20);
//获取字体名称
QFont font = fontComboBox->currentFont();
std::cout << fontComboBox->itemText(20).toStdString() << std::endl;
std::cout << font.family().toStdString() << std::endl;
//设置选中字体和控件自身字体
fontComboBox->setCurrentFont(font);
fontComboBox->setFont(font);QSpinBox：数字微调框
可以通过微调按钮来增加或减小编辑框里面的数值
QDoubleSpinBox：小数微调框
QDateEdit：日期编辑框
以编辑框加微调按钮的形式编辑日期
QTimeEdit：时间编辑框
QDateTimeEdit：日期时间编辑框
QCalendarWidget：日历控件
QKeySequenceEdit：按键监听器
可以监听和显示按键组合
QProgressBar：进度条
QSlider：滑块
QScrollBar：滚动条
QDial：表盘控件
可以通过拖拽或上下左右按键来控制表盘刻度转动
Line：分割线
可以设置分割线的方向和宽度
QScrollArea：滚动面板
可以容纳一个子Widget，子Widget过大时，以滚动方式显示
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
// 设置内容面板和布局
// QScrollArea只能拥有一个子Widget
QScrollArea *scrollArea = w.ui->scrollArea;
QWidget *contentWidget = new QWidget();
scrollArea->setWidget(contentWidget);
QVBoxLayout *layout = new QVBoxLayout();
contentWidget->setLayout(layout);
// 调整内容面板大小
// 如果resizable=false，内容面板会和ScrollArea一样大小
// 对于QVBoxLayout来说，这也做的结果就是，没有滚动条，100个item平分ScrollArea的高度
scrollArea->setWidgetResizable(true);
for (int i = 0; i < 100; i++) layout->addWidget(new QLabel("Hello"));QHBoxLayout：水平布局
所有子控件横向排列
//创建主窗口
MainWindow w;
w.setWindowTitle("Qt Widgets");
w.setGeometry(100, 100, 800, 450);
w.show();
//创建一个按钮
QPushButton *button = new QPushButton();
button->setGeometry(0, 0, 200, 50);
button->setText("ABC");
//为中央面板设置水平布局
QHBoxLayout *hLayout = new QHBoxLayout();
w.ui->centralWidget->setLayout(hLayout);
//按钮居中，左右的弹性区域按照1:2的比例分配剩余空间
hLayout->addStretch(1);
hLayout->addWidget(button);
hLayout->addStretch(2);QVBoxLayout：竖直布局
所有子控件竖直排列
QGridLayout：网格布局
按行列将布局划分为若干区域，摆放子控件
MainWindow w;
w.show();
Ui::MainWindow *ui = w.ui;
QWidget *centralWidget = ui->centralWidget;
//为中央面板设置网格布局
QGridLayout *gridLayout = new QGridLayout();
centralWidget->setLayout(gridLayout);
//设置布局参数，这里以一个4*4等宽等高的网格为例
//四行按1:1:1:1的比例关系占据布局空间
gridLayout->setRowStretch(0, 1);
gridLayout->setRowStretch(1, 1);
gridLayout->setRowStretch(2, 1);
gridLayout->setRowStretch(3, 1);
//四列按1:1:1:1的比例关系占据布局空间
gridLayout->setColumnStretch(0, 1);
gridLayout->setColumnStretch(1, 1);
gridLayout->setColumnStretch(2, 1);
gridLayout->setColumnStretch(3, 1);
//设置水平竖直间距
gridLayout->setHorizontalSpacing(5);
gridLayout->setVerticalSpacing(5);
//创建若干按钮
QPushButton *button1 = new QPushButton("1");
QPushButton *button2 = new QPushButton("2");
QPushButton *button3 = new QPushButton("3");
QPushButton *button4 = new QPushButton("4");
//从第一行第一列开始添加按钮，占据一行一列的空间
gridLayout->addWidget(button1, 0, 0, 1, 1);
//从第一行第二列开始添加按钮，占据一行三列的空间
gridLayout->addWidget(button2, 0, 1, 1, 3);
//从第二行第三列添加按钮，默认占据一行一列的空间
gridLayout->addWidget(button3, 1, 2);
//从尾行的末列之后，或新行的首列开始添加按钮
gridLayout->addWidget(button4);QFormLayout：表单布局
将若干组标签-编辑框，按左右或上下位置进行排列
MainWindow w;
w.show();
Ui::MainWindow *ui = w.ui;
QWidget *centralWidget = ui->centralWidget;
//为中央面板设置表单布局
QFormLayout *formLayout = new QFormLayout();
centralWidget->setLayout(formLayout);
//设置标签-编辑框布局方式
//左右排列，上下排列，空间不足时上下排列
formLayout->setRowWrapPolicy(QFormLayout::RowWrapPolicy::WrapLongRows);
//创建若干组标签和编辑框
QLabel *label1 = new QLabel("姓名");
QLabel *label2 = new QLabel("姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名");
QLabel *label3 = new QLabel("姓名姓名姓名");
QLineEdit *edit1 = new QLineEdit();
QLineEdit *edit2 = new QLineEdit();
QLineEdit *edit3 = new QLineEdit();
//添加控件到布局
formLayout->addRow(label1, edit1);
formLayout->addRow(label2, edit2);
formLayout->addRow(label3, edit3);QListView：列表控件
// 创建主窗口
MainWindow w;
w.setWindowTitle("Qt Widgets");
w.setGeometry(100, 100, 800, 450);
w.show();
// 创建数据模型
// QStandardItem可以直接用string作为数据，也可以通过setData设置复杂数据
QStandardItemModel *model = new QStandardItemModel();
model->appendRow(new QStandardItem("item1"));
model->appendRow(new QStandardItem("item2"));
model->appendRow(new QStandardItem("item3"));
model->appendRow(new QStandardItem("item4"));
model->appendRow(new QStandardItem("item5"));
// 绑定数据模型
QListView *listView = w.ui->listView;
listView->setModel(model);
// 绑定ItemDelegate
// ItemDelegate可以决定如何绘制一个复杂的Item，可用于显示复杂的Model数据
listView->setItemDelegate(nullptr);QTreeView：树状控件
//为QTreeView绑定数据模型
QTreeView *treeView = w.ui->treeView;
QStandardItemModel *model = new QStandardItemModel();
treeView->setModel(model);
//设置横向标题
QStringList hHeaderList = QStringList() << "A" << "B" << "C" << "D";
model->setHorizontalHeaderLabels(hHeaderList);
//设置三级树结构数据
QStandardItem *item1 = new QStandardItem("Item 1");
model->appendRow(item1);
QStandardItem *item11 = new QStandardItem("Item 1-1");
item1->appendRow(item11);
item1->appendRow(new QStandardItem("Item 1-2"));
item1->appendRow(new QStandardItem("Item 1-3"));
item1->appendRow(new QStandardItem("Item 1-4"));
item11->appendRow(new QStandardItem("Item 1-1-1"));
item11->appendRow(new QStandardItem("Item 1-1-2"));
item11->appendRow(new QStandardItem("Item 1-1-3"));
//设置其它列数据
model->setItem(0, 1, new QStandardItem("Hello"));
model->setItem(0, 2, new QStandardItem("Hello"));
model->setItem(0, 3, new QStandardItem("Hello"));
model->setItem(0, 4, new QStandardItem("Hello"))QTableView：表格控件
MainWindow w;
w.show();
//获取QTableView
QTableView *tableView = w.ui->tableView;
//设置是否可编辑
tableView->setEditTriggers(QAbstractItemView::DoubleClicked);
//设置整行选中
tableView->setSelectionBehavior(QAbstractItemView::SelectRows);
//设置只能选中单条记录
tableView->setSelectionMode(QAbstractItemView::SingleSelection);
//显示表头
tableView->horizontalHeader()->setVisible(true);
tableView->verticalHeader()->setVisible(true);
//显示网格线
tableView->setShowGrid(true);
//设置网格线风格
tableView->setGridStyle(Qt::DotLine);
//绑定数据模型
QStandardItemModel *model = new QStandardItemModel();
QStringList horizontalHeaderList = QStringList() << "A" << "B" << "C";
QStringList verticalHeaderList = QStringList() << "1" << "2" << "3";
model->setHorizontalHeaderLabels(horizontalHeaderList);
model->setVerticalHeaderLabels(verticalHeaderList);
tableView->setModel(model);
//添加数据
model->setItem(0, 0, new QStandardItem("A1"));
model->setItem(0, 1, new QStandardItem("A2"));
model->setItem(0, 2, new QStandardItem("A3"));
model->setItem(1, 0, new QStandardItem("B1"));
model->setItem(1, 1, new QStandardItem("B2"));
model->setItem(1, 2, new QStandardItem("B3"));
//设置表格样式
tableView->setStyleSheet(
"QTableView {"
" color: rgba(0,0,0,0.8);"
" selection-background-color: deepskyblue;"
"}"
);QListWidget：列表控件
简化版的QListView，跳过Model直接使用Item设置内容
//获取QListWidget
QListWidget *listWidget = w.ui->listWidget;
//直接添加Item
QListWidgetItem *item1 = new QListWidgetItem("item-1");
QListWidgetItem *item2 = new QListWidgetItem("item-2");
QListWidgetItem *item3 = new QListWidgetItem("item-3");
listWidget->addItem(item1);
listWidget->addItem(item2);
listWidget->addItem(item3);QTreeWidget：树状控件
简化版的QTreeView，跳过Model直接使用Item设置内容
//创建主窗口
MainWindow w;
w.setWindowTitle("Qt Widgets");
w.setGeometry(100, 100, 800, 450);
w.show();
//设置列标题
QTreeWidget *treeWidget = w.ui->treeWidget;
treeWidget->setColumnCount(3);
treeWidget->setHeaderLabels(QStringList() << "A" << "B" << "C");
//设置顶层数据
QTreeWidgetItem *item1 = new QTreeWidgetItem(QStringList() << "item-1" << "B" << "C");
QTreeWidgetItem *item2 = new QTreeWidgetItem(QStringList() << "item-2" << "B" << "C");
treeWidget->insertTopLevelItem(0, item1);
treeWidget->insertTopLevelItem(1, item2);
//设置下级数据
item1->addChild(new QTreeWidgetItem(QStringList() << "item-1-1" << "B" << "C"));
item1->addChild(new QTreeWidgetItem(QStringList() << "item-1-2" << "B" << "C"));
item1->addChild(new QTreeWidgetItem(QStringList() << "item-1-3" << "B" << "C"));QTableWidget：表格控件
简化版的QTableView，跳过Model直接使用Item设置内容
//创建主窗口
MainWindow w;
w.setWindowTitle("Qt Widgets");
w.setGeometry(100, 100, 800, 450);
w.show();
//设置表格标题
QTableWidget *tableWidget = w.ui->tableWidget;
tableWidget->setColumnCount(3);
tableWidget->setRowCount(10);
tableWidget->setHorizontalHeaderLabels(QStringList() << "A" << "B" << "C");
tableWidget->setVerticalHeaderLabels(QStringList() << "R1" << "R2" << "R3");
//设置表格数据
tableWidget->setItem(0, 0, new QTableWidgetItem("A1"));
tableWidget->setItem(0, 1, new QTableWidgetItem("B1"));
tableWidget->setItem(0, 2, new QTableWidgetItem("C1"));
tableWidget->setItem(1, 0, new QTableWidgetItem("A2"));
tableWidget->setItem(1, 1, new QTableWidgetItem("B2"));
tableWidget->setItem(1, 2, new QTableWidgetItem("C2"));QUndoView：命令撤销重做控件
与QUndoStack，QUndoCommand一起使用
可以记录并显示一组命令，还可以对这些命令进行撤销重做操作
具体用法可以在Qt Creator首页的示例代码中查看
QColumnView：列视图控件
一列展开后，可以显示子列内容
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//绑定数据模型
QColumnView *columnView = w.ui->columnView;
QStandardItemModel *model = new QStandardItemModel();
columnView->setModel(model);
//添加多层列数据
QStandardItem *item1 = new QStandardItem("record-1");
QStandardItem *item2 = new QStandardItem("record-2");
QStandardItem *item3 = new QStandardItem("record-3");
model->appendRow(item1);
model->appendRow(item2);
model->appendRow(item3);
QStandardItem *item11 = new QStandardItem("record-1-1");
QStandardItem *item12 = new QStandardItem("record-1-2");
QStandardItem *item13 = new QStandardItem("record-1-3");
item1->appendRow(item11);
item1->appendRow(item12);
item1->appendRow(item13);
QStandardItem *item131 = new QStandardItem("record-1-3-1");
item13->appendRow(item131);QGroupBox：分组框
用一个带标题的框形容器，包裹一组控件
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//设置布局
QGroupBox *groupBox = w.ui->groupBox;
QHBoxLayout *layout = new QHBoxLayout();
groupBox->setLayout(layout);
//添加控件
layout->addStretch(1);
QPushButton *button1 = new QPushButton("Button1");
layout->addWidget(button1, 2);
QPushButton *button2 = new QPushButton("Button2");
layout->addWidget(button2, 2);
layout->addStretch(1);QToolBox：竖向选项卡控件
命名不是很准确，相当于QVerticalQTabWidget
拥有多个竖向排列的选项卡，每个选项卡控制一个面板内容的显示隐藏
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//移除QtDesigner默认生成的选项卡
QToolBox *toolBox = w.ui->toolBox;
toolBox->removeItem(0);
//添加新的选项卡
toolBox->addItem(new QLabel("Hello"), "Page-1");
toolBox->addItem(new QLabel("Hello"), "Page-2");
toolBox->addItem(new QLabel("Hello"), "Page-3");
toolBox->addItem(new QLabel("Hello"), "Page-4");
toolBox->addItem(new QLabel("Hello"), "Page-5");QTabWidget：选项卡控件
通过选项卡以分页的方式显示若干组内容
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//移除QtDesigner默认生成的标签页
QTabWidget *tabWidget = w.ui->tabWidget;
tabWidget->removeTab(0);
tabWidget->removeTab(0);
//插入标签页
tabWidget->insertTab(tabWidget->count(), new QLabel("Hello"), "Page-1");
tabWidget->insertTab(tabWidget->count(), new QLabel("Hello"), "Page-2");
tabWidget->insertTab(tabWidget->count(), new QLabel("Hello"), "Page-3");
tabWidget->insertTab(tabWidget->count(), new QLabel("Hello"), "Page-4");
tabWidget->insertTab(tabWidget->count(), new QLabel("Hello"), "Page-5");QStackWidget：堆栈窗体
以堆栈形式存储多个界面内容，动态显示其中一个界面
一般配合QComboBox或其它切换控件使用
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//设置每个面板的界面
QStackedWidget *stackWidget = w.ui->stackedWidget;
stackWidget->insertWidget(stackWidget->count(), new QLabel("Hello-1"));
stackWidget->insertWidget(stackWidget->count(), new QLabel("Hello-2"));
stackWidget->insertWidget(stackWidget->count(), new QLabel("Hello-3"));
stackWidget->insertWidget(stackWidget->count(), new QLabel("Hello-4"));
stackWidget->insertWidget(stackWidget->count(), new QLabel("Hello-5"));
//设置显示的界面
stackWidget->setCurrentIndex(3);QDockWidget：悬停窗口
以悬停面板的方式停靠在主窗口的侧边，可以拖拽，合并，浮动，停靠
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
//允许Dock窗口间的联动行为
w.setDockNestingEnabled(true);
//添加Dock
QDockWidget *dock1 = new QDockWidget("D1");
w.addDockWidget(Qt::DockWidgetArea::RightDockWidgetArea, dock1, Qt::Orientation::Vertical);
QDockWidget *dock2 = new QDockWidget("D2");
w.addDockWidget(Qt::DockWidgetArea::RightDockWidgetArea, dock2, Qt::Orientation::Vertical);
QDockWidget *dock3 = new QDockWidget("D3");
w.addDockWidget(Qt::DockWidgetArea::RightDockWidgetArea, dock3, Qt::Orientation::Vertical);
//合并成标签显示
w.tabifyDockWidget(dock1, dock2);
w.tabifyDockWidget(dock1, dock3);
//分开并列显示
w.splitDockWidget(dock1, dock2, Qt::Orientation::Horizontal);
w.splitDockWidget(dock2, dock3, Qt::Orientation::Horizontal);
//设置拐角区域属于哪一侧
w.setCorner(Qt::Corner::BottomLeftCorner, Qt::DockWidgetArea::BottomDockWidgetArea);
//限制Dock只能显示在固定区域
dock1->setAllowedAreas(Qt::DockWidgetArea::RightDockWidgetArea);
//设置Dock不可拖动，不可关闭，不可浮动
dock1->setFeatures(QDockWidget::NoDockWidgetFeatures);
//设置Dock可拖动，可关闭，可浮动
dock1->setFeatures(
QDockWidget::DockWidgetMovable |
QDockWidget::DockWidgetClosable |
QDockWidget::DockWidgetFloatable
);QMdiArea：多文档窗体
MDI全称Multi-Document-Interface，即多文档用户界面
用于容纳多个文档窗口，配合QMdiSubWindow使用
MainWindow w;
w.setGeometry(100, 100, 1280, 720);
w.show();
QMdiArea *mdiArea = w.ui->mdiArea;
// 添加子窗口
QMdiSubWindow *w1 = new QMdiSubWindow();
mdiArea->addSubWindow(w1);
w1->show();
w1->resize(200, 100);
// 添加子窗口
QMdiSubWindow *w2 = new QMdiSubWindow();
mdiArea->addSubWindow(w2);
w2->show();
w2->resize(500, 100);
// 添加QWidget作为子窗口
// Qt会自动创建一个QMdiSubWindow来包装QWidget
QWidget *w3 = new QPushButton("Hello");
mdiArea->addSubWindow(w3);
w3->setWindowFlags(Qt::SubWindow);
w3->show();
mdiArea->activeSubWindow()->resize(500, 100);
//子窗口并列排序
mdiArea->tileSubWindows();
//子窗口层叠排序
mdiArea->cascadeSubWindows();QAxWidget：ActiveX控件
可以调用ActiveX组件来处理任务
MainWindow w;
w.setWindowTitle("Qt Widget");
w.setGeometry(100, 100, 1280, 720);
w.show();
QAxWidget *ax = w.ui->axWidget;
//打开Excel
ax->setControl("C:/abc.xlsx");
//打卡网页
ax->setControl("{8856F961-340A-11D0-A96B-00C04FD705A2}");
ax->dynamicCall("Navigate(string)", "https://www.baidu.com");
ax->setProperty("DisplayAlerts", false);QQuickWidget和QQuickView：QtQuick控件
后面会专门介绍
QGraphicsView和QOpenGLWidget：绘图控件
高级知识，感兴趣请自学
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
