四、基本組件
1. Designer設計師(掌握)
Qt Designer 是 Qt 提供的可視化界面設計工具,支持通過拖拽組件快速構建 GUI 界面,生成的界面文件以?.ui
格式保存(基于 XML 的標簽語言)。
- ?
??核心功能??:
- ?
在 Qt Creator 中創建項目時勾選“界面文件”選項,自動生成與窗口類關聯的?
.ui
文件。 - ?
所有 Designer 操作均可通過 C++ 代碼實現(如布局管理、信號槽連接)。
- ?
- ?
??代碼集成??:通過?
ui->setupUi(this)
將界面與邏輯綁定,組件通過?ui->組件名
訪問。
2. 布局管理(Layout)(掌握)
布局通過“透明盒子”模式管理組件排列,支持自適應窗口縮放。
常見布局類型
類型 | 特點 |
---|---|
??垂直布局?? | 組件豎向排列( |
??水平布局?? | 組件橫向排列( |
??網格布局?? | 組件按 n×m 表格排列( |
??表單布局?? | 專為輸入表單設計( |
布局操作技巧
- ?
??貼合窗口??:選中窗口對象后點擊布局按鈕,使布局自動適配窗口邊緣。
- ?
??填充空白??:添加“伸展組件(Stretch)”填充剩余空間。
- ?
??嵌套布局??:外層布局可將內層布局視為子組件,實現復雜界面。
3. QWidget類(掌握)
所有界面組件的基類,代表一個矩形窗口區域,支持嵌套和事件處理。
- ?
??關鍵屬性(Designer 中可見)??:
- ?
??大小策略(Size Policy)??:控制組件在布局中的伸縮行為(默認策略適配多數場景)。
- ?
4. 界面文件與C++代碼的關系(熟悉)
- ?
??
.ui
文件??:通過 Qt Designer 設計的界面描述文件,編譯后生成對應的 C++ 頭文件(如?ui_mainwindow.h
)。 - ?
??代碼綁定??:在窗口類構造函數中調用?
ui->setupUi(this)
初始化界面。
5. QLabel標簽(掌握)
5.1 基本屬性
- ?
??功能??:顯示靜態文本或圖片,不支持用戶交互(無信號函數)。
- ?
??命名規范??:默認命名格式為“標簽名稱_序號”(如?
labelPic
),雙擊可修改文本。
5.2 資源庫管理
- ?
??圖片格式??:支持 JPG(無透明)、PNG(含透明)、GIF(動態圖)。
- ?
??導入步驟??:
- ?
將圖片文件(無中文名)放入項目目錄。
- ?
右鍵項目 → “添加新文件” → 選擇 Qt 資源文件(
.qrc
)。 - ?
在資源文件中添加圖片路徑,生成虛擬路徑(如?
:/new/prefix1/logo.png
)。
- ?
5.3 代碼操作示例
// 加載并縮放圖片
QPixmap pic(":/new/prefix1/logo.png");
QSize size(ui->label->width(), ui->label->height());
pic = pic.scaled(size, Qt::KeepAspectRatio, Qt::SmoothTransformation);
ui->label->setPixmap(pic);
5.4 動態圖播放(QMovie)
// 播動圖
QMovie *movie = new QMovie(":/new/prefix1/kunkun.gif", this);
ui->labelPic->setMovie(movie);
movie->start();
6. QAbstractButton按鈕類(掌握)
按鈕基類,包含通用屬性和信號槽機制。
6.1 按鈕樣式設置
- ?
??圖標添加??:通過 Qt 資源管理器導入圖標(如?
https://www.iconfont.cn/
),設置?icon
屬性。 - ?
??去邊框??:通過樣式表?
border: none; background-color: transparent;
實現透明效果。
6.2 信號與槽
- ?
??單選按鈕(QRadioButton)??:
connect(ui->radioButton_3, SIGNAL(toggled(bool)), this, SLOT(toggledSlot(bool)));
- ?
??按鈕分組(QButtonGroup)??:
QButtonGroup *btp = new QButtonGroup(this); btp->addButton(ui->checkBox, 1); // 按鈕ID為1 connect(btp, SIGNAL(buttonToggled(int,bool)), this, SLOT(buttonToggledSlot(int,bool)));
7. QLineEdit單行文本輸入框(掌握)
7.1 常用信號
- ?
??
returnPressed()
??:回車鍵觸發。 - ?
??
selectionChanged()
??:選中文本變化時觸發。
7.2 代碼示例
// 獲取輸入內容
connect(ui->lineEdit, SIGNAL(returnPressed()), this, SLOT(returnPressedSlot())); void Dialog::returnPressedSlot() { qDebug() << "輸入內容:" << ui->lineEdit->text();
}