Qt基本組件詳解:按鈕、輸入框與容器控件
目錄
- 按鈕類組件
- QPushButton
- QRadioButton
- QCheckBox
- 輸入框組件
- QLineEdit
- QTextEdit
- 容器組件
- QGroupBox
- 綜合應用示例
- 思維導圖總結
1. 按鈕類組件
1.1 QPushButton(普通按鈕)
功能:基礎交互按鈕,支持點擊事件
核心特性:
- 文本/圖標顯示
- 狀態變化(按下/懸停)
- 快捷鍵支持
源碼示例:
#include <QPushButton>QPushButton* btn = new QPushButton("提交", this);
btn->setGeometry(50, 30, 100, 40); // 位置(x,y) 尺寸(寬,高)// 連接點擊信號
connect(btn, &QPushButton::clicked, [](){qDebug() << "按鈕被點擊!";
});
運行效果:
- 顯示灰色矩形按鈕,文字"提交"
- 鼠標懸停時高亮顯示
- 點擊后控制臺輸出提示
1.2 QRadioButton(單選按鈕)
功能:互斥選擇,同一容器內只能選一個
特性:
- 自動互斥(同父組件內)
- 支持按鈕組管理
源碼示例:
#include <QRadioButton>
#include <QButtonGroup>QRadioButton* radio1 = new QRadioButton("選項1", this);
QRadioButton* radio2 = new QRadioButton("選項2", this);
radio1->move(50, 80);
radio2->move(50, 110);// 創建按鈕組
QButtonGroup* group = new QButtonGroup(this);
group->addButton(radio1, 1); // ID=1
group->addButton(radio2, 2); // ID=2// 選擇變化事件
connect(group, QOverload<QAbstractButton*>::of(&QButtonGroup::buttonClicked),[](QAbstractButton* btn){qDebug() << "選中ID:" << group->id(btn);});
運行效果:
- 顯示兩個圓形選擇框
- 點擊"選項1"時,"選項2"自動取消
- 選擇時打印對應ID
1.3 QCheckBox(復選框)
功能:多選控件,支持三態(選中/未選/部分選)
特性:
- 獨立選擇
- tristate模式支持
源碼示例:
#include <QCheckBox>QCheckBox* check1 = new QCheckBox("蘋果", this);
QCheckBox* check2 = new QCheckBox("香蕉", this);
check1->move(50, 150);
check2->move(50, 180);// 三態模式
check2->setTristate(true);// 狀態變化事件
connect(check1, &QCheckBox::stateChanged, [](int state){qDebug() << (state ? "選中" : "取消");
});
運行效果:
- "蘋果"顯示方形復選框
- "香蕉"顯示帶方框的復選框(三態)
- 勾選時控制臺輸出狀態
2. 輸入框組件
2.1 QLineEdit(單行輸入框)
功能:單行文本輸入
核心特性:
- 密碼模式
- 輸入驗證
- 占位提示文本
源碼示例:
#include <QLineEdit>QLineEdit* lineEdit = new QLineEdit(this);
lineEdit->setGeometry(50, 220, 200, 30);
lineEdit->setPlaceholderText("請輸入用戶名");// 密碼模式
QLineEdit* pwdEdit = new QLineEdit(this);
pwdEdit->setGeometry(50, 260, 200, 30);
pwdEdit->setEchoMode(QLineEdit::Password); // 密碼掩碼
運行效果:
- 顯示矩形輸入框,無輸入時顯示灰色提示文本
- 密碼框輸入時顯示圓點替代字符
2.2 QTextEdit(多行文本編輯)
功能:富文本編輯器
特性:
- 支持HTML格式
- 文本查找/替換
- 滾動條支持
源碼示例:
#include <QTextEdit>QTextEdit* textEdit = new QTextEdit(this);
textEdit->setGeometry(50, 300, 300, 200);
textEdit->setHtml("<b>加粗文本</b> <i>斜體文本</i>");// 插入純文本
textEdit->append("追加新行");
運行效果:
- 顯示帶滾動條的多行編輯區
- 首行顯示加粗和斜體HTML文本
- 底部追加普通文本行
3. 容器組件:QGroupBox
功能:創建分組容器,增強布局邏輯
特性:
- 帶標題邊框
- 管理內部組件狀態
- 支持單選組容器
源碼示例:
#include <QGroupBox>
#include <QVBoxLayout>QGroupBox* groupBox = new QGroupBox("用戶信息", this);
groupBox->setGeometry(300, 30, 250, 200);// 內部布局
QVBoxLayout* layout = new QVBoxLayout;
layout->addWidget(new QLineEdit("姓名"));
layout->addWidget(new QLineEdit("電話"));
groupBox->setLayout(layout);// 單選組容器
QGroupBox* radioGroup = new QGroupBox("性別", this);
radioGroup->setGeometry(300, 240, 250, 100);
QVBoxLayout* radioLayout = new QVBoxLayout;
radioLayout->addWidget(new QRadioButton("男"));
radioLayout->addWidget(new QRadioButton("女"));
radioGroup->setLayout(radioLayout);
運行效果:
- 顯示帶"用戶信息"標題的矩形框
- 內部包含兩個單行輸入框
- "性別"分組框包含兩個互斥單選按鈕
4. 綜合應用示例
#include <QApplication>
#include <QWidget>
#include <QPushButton>
#include <QButtonGroup>
#include <QGroupBox>
#include <QTextEdit>
#include <QVBoxLayout>int main(int argc, char *argv[]) {QApplication app(argc, argv);QWidget window;window.setWindowTitle("Qt組件綜合示例");window.resize(600, 400);// 主布局QVBoxLayout* mainLayout = new QVBoxLayout(&window);// 按鈕組QGroupBox* btnGroup = new QGroupBox("操作");QHBoxLayout* btnLayout = new QHBoxLayout;btnLayout->addWidget(new QPushButton("保存"));btnLayout->addWidget(new QPushButton("取消"));btnGroup->setLayout(btnLayout);// 文本編輯區QTextEdit* textEdit = new QTextEdit;textEdit->setPlaceholderText("輸入內容...");mainLayout->addWidget(btnGroup);mainLayout->addWidget(textEdit);window.show();return app.exec();
}
運行效果描述:
- 窗口頂部顯示"操作"分組框
- 內部水平排列"保存"和"取消"按鈕
- 下方顯示多行文本編輯區
- 空白時顯示"輸入內容…"提示
- 支持多行文本輸入和格式編輯
- 窗口尺寸可自由調整
- 組件隨窗口自動縮放
核心要點總結:
- 按鈕類:QPushButton基礎交互,QRadioButton互斥選擇,QCheckBox多選
- 輸入控件:QLineEdit處理單行文本,QTextEdit支持富文本編輯
- 容器管理:QGroupBox實現視覺分組和邏輯分組
- 最佳實踐:組合使用按鈕組(QButtonGroup)和布局管理器實現復雜界面
原創技術筆記,轉載需注明出處。更多系統編程內容持續更新中…