Qt Creator控件及其用途详细总结
Qt Creator控件及其用途详细总结
控件功能总结表
控件名称 | 类别 | 主要用途 | 典型场景 |
---|---|---|---|
QLabel | 显示控件 | 显示文本/图片(支持富文本) | 标题、状态提示、图片展示 |
QLineEdit | 输入控件 | 单行文本输入/编辑(支持密码掩码) | 用户名、密码框、搜索栏 |
QTextBrowser | 显示控件 | 显示富文本/超链接(支持HTML,只读) | 帮助文档、日志显示 |
QCheckBox | 选择控件 | 二值选项(勾选/未勾选) | 设置开关、多选项选择 |
QComboBox | 选择控件 | 下拉列表选择(支持可编辑) | 分类筛选、枚举值选择 |
QPainter | 绘图工具 | 2D绘图引擎(非控件,需在paintEvent中使用) | 自定义图形绘制、图表生成 |
QPushButton | 交互控件 | 触发操作(支持图标) | 确认/取消按钮、工具栏 |
QRadioButton | 选择控件 | 单选按钮(组内互斥) | 单选设置(如主题选择) |
QSpinBox | 输入控件 | 整数输入(带增减箭头) | 年龄、数量设置 |
QDoubleSpinBox | 输入控件 | 浮点数输入 | 价格、百分比设置 |
QSlider | 输入控件 | 滑块调节数值(水平/垂直) | 音量控制、亮度调节 |
QProgressBar | 显示控件 | 进度条显示 | 文件下载、任务进度 |
QTextEdit | 输入/显示控件 | 多行富文本编辑 | 聊天输入框、文本编辑器 |
QListWidget | 容器控件 | 列表项管理(支持图标) | 文件列表、播放列表 |
QTreeWidget | 容器控件 | 树形结构数据展示 | 文件目录、组织结构 |
QTableWidget | 容器控件 | 表格数据展示/编辑 | 数据报表、Excel式界面 |
QTabWidget | 容器控件 | 多页面标签切换 | 设置分页、多文档界面 |
QGraphicsView | 绘图容器 | 复杂2D图形场景容器(需搭配QGraphicsScene) | 流程图、CAD绘图 |
QOpenGLWidget | 绘图容器 | OpenGL渲染窗口 | 3D图形渲染、游戏界面 |
QDateEdit | 输入控件 | 日期选择 | 生日、日程设置 |
QToolButton | 交互控件 | 工具栏按钮(支持菜单) | 绘图工具、格式工具栏 |
QSplitter | 布局控件 | 可调节的分割区域 | 资源管理器式界面 |
详细说明
- QLabel
- 最基础的显示控件,可设置文字对齐、自动换行(
wordWrap
属性)。 - 支持通过
setPixmap()
显示图片。
- 最基础的显示控件,可设置文字对齐、自动换行(
- QLineEdit
- 支持输入掩码(如电话号码格式)、正则验证(
QValidator
)。 - 常用信号:
textChanged()
(实时响应输入)、returnPressed()
(回车触发)。
- 支持输入掩码(如电话号码格式)、正则验证(
- QTextBrowser
- 继承自
QTextEdit
,但默认只读。 - 支持锚点跳转(
anchorClicked()
信号)和资源加载(本地/网络)。
- 继承自
- QCheckBox
- 三态模式:
setTristate(true)
启用(选中/未选中/部分选中)。 - 状态获取:
isChecked()
返回布尔值。
- 三态模式:
- QComboBox
- 动态数据:通过
addItem()
添加选项,currentIndex()
获取选择。 - 可编辑模式:
setEditable(true)
允许用户输入自定义值。
- 动态数据:通过
QLabel - 文本/图片标签
QLabel *label = new QLabel("状态:就绪", this); // 创建文本标签
label->setPixmap(QPixmap("icon.png")); // 设置图片
label->setAlignment(Qt::AlignCenter); // 居中对齐
// 用途:状态栏提示、图片展示
QLineEdit - 单行文本输入框
QLineEdit *edit = new QLineEdit(this);
edit->setPlaceholderText("输入用户名"); // 提示文本
edit->setEchoMode(QLineEdit::Password); // 密码模式
connect(edit, &QLineEdit::returnPressed, []{ // 回车事件qDebug() << "输入内容:" << edit->text();
});
QTextBrowser - 富文本显示器
QTextBrowser *browser = new QTextBrowser(this);
browser->setHtml("<h1>帮助文档</h1><p>点击<a href='https://qt.io'>这里</a>访问官网</p>");
connect(browser, &QTextBrowser::anchorClicked, [](const QUrl &link){ QDesktopServices::openUrl(link); // 打开超链接
});
// 用途:日志显示/帮助系统
QCheckBox - 复选框
QCheckBox *checkbox = new QCheckBox("启用特效", this);
connect(checkbox, &QCheckBox::stateChanged, [](int state){bool enabled = (state == Qt::Checked); // 获取勾选状态applyEffects(enabled); // 应用设置
});
QComboBox - 下拉选择框
QComboBox *combo = new QComboBox(this);
combo->addItems({"红色", "绿色", "蓝色"}); // 添加选项
combo->setCurrentIndex(0); // 默认选中第一项
connect(combo, QOverload<int>::of(&QComboBox::currentIndexChanged), [](int index){ setColor(index); }); // 选择变化时触发
QPainter - 2D绘图工具(非控件)
// 在自定义Widget的paintEvent中绘制
void MyWidget::paintEvent(QPaintEvent*) {QPainter painter(this);painter.setBrush(Qt::red);painter.drawEllipse(10, 10, 100, 100); // 绘制红色圆形painter.drawText(50, 70, "Hello Qt"); // 绘制文本
}
QPushButton - 普通按钮
QPushButton *btn = new QPushButton("确定", this);
btn->setIcon(QIcon("ok.png")); // 带图标按钮
connect(btn, &QPushButton::clicked, []{ // 点击事件QMessageBox::information(nullptr, "提示", "操作已确认");
});
QRadioButton - 单选按钮
QButtonGroup *group = new QButtonGroup(this); // 创建按钮组QRadioButton *rb1 = new QRadioButton("选项1", this);
QRadioButton *rb2 = new QRadioButton("选项2", this);group->addButton(rb1, 1); // ID=1
group->addButton(rb2, 2); // ID=2connect(group, QOverload<int>::of(&QButtonGroup::buttonClicked), [](int id){ selectOption(id); }); // 根据ID处理选择
QSpinBox - 整数输入框
QSpinBox *spinBox = new QSpinBox(this);
spinBox->setRange(0, 100); // 值范围 0~100
spinBox->setValue(50); // 默认值
spinBox->setPrefix("数量: "); // 前缀文本
connect(spinBox, QOverload<int>::of(&QSpinBox::valueChanged), [](int val){ updateCount(val); });
QDoubleSpinBox - 浮点数输入框
QDoubleSpinBox *dspin = new QDoubleSpinBox(this);
dspin->setRange(0.0, 1.0); // 设置范围
dspin->setSingleStep(0.1); // 步进值
dspin->setDecimals(2); // 小数点位数
dspin->setSuffix(" 千克"); // 后缀文本
QSlider - 滑动条
QSlider *slider = new QSlider(Qt::Horizontal, this);
slider->setRange(0, 100); // 水平滑块
connect(slider, &QSlider::valueChanged, [](int val){ setVolume(val); }); // 音量控制
QProgressBar - 进度条
QProgressBar *progress = new QProgressBar(this);
progress->setRange(0, 100);
progress->setValue(75); // 设置当前进度
progress->setTextVisible(true); // 显示百分比文本
// 用途:文件下载进度显示
QTextEdit - 多行富文本编辑器
QTextEdit *textEdit = new QTextEdit(this);
textEdit->setHtml("<b>加粗文本</b><i>斜体文本</i>"); // 支持HTML
textEdit->append("新行内容"); // 追加文本
// 用途:聊天窗口输入框
QListWidget - 列表控件
QListWidget *list = new QListWidget(this);
list->addItem("项目1");
list->addItem(new QListWidgetItem(QIcon("file.png"), "带图标项目"));
connect(list, &QListWidget::itemDoubleClicked, // 双击事件[](QListWidgetItem *item){ openFile(item->text()); });
QTreeWidget - 树形控件
QTreeWidget *tree = new QTreeWidget(this);
tree->setHeaderLabels({"名称", "大小"}); // 设置列标题QTreeWidgetItem *root = new QTreeWidgetItem({"文件夹"});
root->addChild(new QTreeWidgetItem({"文件.txt", "1.2MB"}));
tree->addTopLevelItem(root); // 添加根节点
QTableWidget - 表格控件
QTableWidget *table = new QTableWidget(3, 2, this); // 3行2列
table->setHorizontalHeaderLabels({"姓名", "年龄"});
table->setItem(0, 0, new QTableWidgetItem("张三"));
table->setItem(0, 1, new QTableWidgetItem("25"));
// 用途:数据表格展示
QTabWidget - 标签页容器
QTabWidget *tabs = new QTabWidget(this);
tabs->addTab(new QWidget, "基本信息"); // 添加标签页
tabs->addTab(new QWidget, "高级设置");
tabs->setCurrentIndex(0); // 默认显示第一页
QGraphicsView - 图形视图框架
QGraphicsScene *scene = new QGraphicsScene; // 创建场景
QGraphicsView *view = new QGraphicsView(scene, this); scene->addRect(QRectF(0, 0, 100, 50)); // 添加矩形
scene->addText("图形文字"); // 添加文本
// 用途:流程图/绘图工具
QOpenGLWidget - OpenGL渲染窗口
class GLWidget : public QOpenGLWidget {
protected:void initializeGL() override { glClearColor(0,0,1,1); } // 蓝色背景void paintGL() override {glBegin(GL_TRIANGLES); // 绘制三角形glVertex2f(0,0); glVertex2f(1,0); glVertex2f(0.5,1);glEnd();}
};
// 在窗口中使用:setCentralWidget(new GLWidget);
QDateEdit - 日期选择器
QDateEdit *dateEdit = new QDateEdit(this);
dateEdit->setDate(QDate::currentDate()); // 默认今天
dateEdit->setCalendarPopup(true); // 弹出日历
connect(dateEdit, &QDateEdit::dateChanged, [](const QDate &date){ qDebug() << "选择日期:" << date; });
QToolButton - 工具栏按钮
QToolButton *toolBtn = new QToolButton(this);
toolBtn->setIcon(QIcon("brush.png")); // 设置图标
toolBtn->setText("画笔");
toolBtn->setToolTip("绘图工具"); // 悬停提示// 添加下拉菜单
QMenu *menu = new QMenu;
menu->addAction("铅笔");
menu->addAction("毛笔");
toolBtn->setMenu(menu);
QSplitter - 分割窗口
QSplitter *splitter = new QSplitter(Qt::Horizontal, this); // 水平分割QListView *listView = new QListView;
QTextEdit *textEdit = new QTextEdit;splitter->addWidget(listView); // 左侧列表
splitter->addWidget(textEdit); // 右侧文本
splitter->setSizes({100, 300}); // 初始宽度比例
// 用途:资源管理器式界面
使用要点总结:
- 命名规范:控件指针变量名体现类型(如
btnSave
,txtName
) - 父子关系:创建时指定父对象(
this
)以自动管理内存 - 信号连接:使用Lambda简化槽函数(Qt5以上支持)
- 布局管理:结合
QVBoxLayout
等布局器自动排列控件 - 样式定制:使用
setStyleSheet()
进行CSS样式美化
完整项目需包含头文件如
#include <QPushButton>
并在.pro文件中添加QT += widgets
扩展控件应用场景
- QSlider 与 QSpinBox 联动:
绑定数值变化信号(valueChanged()
),实现滑块与数字框同步更新。 - QListWidget + QPushButton 组合:
实现列表项的增删(如任务管理应用)。 - QTabWidget 嵌套:
创建多层级界面(如浏览器多标签页)。
💡 设计建议:
- 输入类控件(如
QLineEdit
)优先使用QValidator
限制输入范围- 频繁更新的文本显示(如日志)推荐用
QPlainTextEdit
替代QLabel
(性能更优)- 需要复杂数据绑定(如数据库)时,考虑Model/View架构控件(
QTableView
等)