前言:因為項目的要求,需要把幾個不同類型功能的界面集成在同一個窗口中,方便用戶不切換窗口,也能快捷的操作不同類型的功能。我首先想到的是通過選項卡方式,讓幾個類別的功能界面通過不同選項卡進行切換,這在windows系統中也是很常見的一種方式。為了將不同類功能進行模塊化,方便維護,通過自定義QWidget的子類,然后在主界面通過tabWidget.addTab()方法,將不同類功能添加到主界面。由于不同tab頁內控件大小不一,為了讓界面盡可能的美觀,希望新增的tab頁也能跟隨窗口的大小隨時改變尺寸。但是我使用通過遍歷tab頁內的控件,并在窗口改變事件(resizeEvent)中添加控件縮放操作,發現控件并沒有達到我想要的縮放效果。經過不斷嘗試,發現問題出現在:新增的tab頁中的布局控件無法輕易地獲取真實大小,而且也無法觸發tab頁resizeEvent事件。知道了問題所在,經過不懈努力,終于找到了解決方法,于是有了本文。
一、主界面類
? ? ? ? 主界面中包含一個TabWidget控件,并包含一個tab頁。TabWidget通過addTab()方法將其他類型的功能模塊加進來,既實現模塊化,又能將多個功能集成到一個窗口。
以下為主界面內的主要代碼
mainwindow.h
#include <QPlainTextEdit>
#include <QTextBrowser>
#include <QResizeEvent>
#include "tab2widght.h"
class MainWindow : public QMainWindow
{Q_OBJECT
public:MainWindow(QWidget *parent = nullptr);~MainWindow();
private:/** 初始化添加的TabWidget的尺寸 */void initialAddedTabWidgetSize(int tabIndex);// 需要添加的Tab2Widget模塊Tab2Widget *tab2Widget = NULL;// 上次點擊的tab頁序號int preTabWidgetIndex = 0;// 控件根據窗口大小自動調整控件大小 @{
protected:void resizeEvent(QResizeEvent* event) override;
private:QMap<QWidget*, QRect> allWidgetMap;QMap<QLayout*, QRect> allLayoutMap;/** 窗口默認尺寸 */QSize windowOriginalSize;/** 查找所有子布局和子控件 */void findAllLayoutAndWidget(QObject *object);/** 檢查文本是否超出了容器寬或高,方便修改文本大小 */bool checkTextOverflow(QWidget *widget);
// 控件根據窗口大小自動調整控件大小 @}
private slots:/** 當tabwidget切換tab時 **/void onTabClicked(int index);
};
mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{// 實例化tab2模塊類if(tab2Widget == NULL) {tab2Widget = new Tab2Widget();}// tab2模塊添加到主界面的tabwidget中if (tab2Widget != NULL) {ui->tabWidget->addTab(tab2Widget, "Tab2");}// 注冊tabwidget的頁點擊事件connect(ui->tabWidget, &QTabWidget::tabBarClicked, this, &MainWindow::onTabClicked);// 延時為了獲取的控件初始大小是正確的QTimer::singleShot(200, this, [=] {findAllLayoutAndWidget(this);windowOriginalSize = this->size();});// 控件根據窗口大小自動調整控件大小 @}
}MainWindow::~MainWindow()
{if (tab2Widget != NULL) {tab2Widget->deleteLater();}
}/** 當tabview切換tab時 **/
void MainWindow::onTabClicked(int index) {// 根據tab的索引判斷是否需要授權if (index == ui->tabWidget->indexOf(tab2Widget)) {// 首次設置新添加的tab的尺寸,只有切換到對應tab,才能拿到真實的layout尺寸數據,關鍵代碼。initialAddedTabWidgetSize(index);}// 切換tabui->tabWidget->setCurrentIndex(index);preTabWidgetIndex = index;
}void MainWindow::initialAddedTabWidgetSize(int tabIndex)
{// 刷新切換后的tab的布局大小if (tabIndex < ui->tabWidget->count() && preTabWidgetIndex != tabIndex && ui->tabWidget->count() > 1) {// 調整通用參數選項卡頁的尺寸if (tabIndex == ui->tabWidget->indexOf(tab2Widget) && tab2Widget != NULL) {if (tab2Widget->allWidgetMap.size() == 0 && tab2Widget->allLayoutMap.size() == 0) {tab2Widget->findAllLayoutAndWidget(tab2Widget);}// 設置通過addTab()函數新增的選項卡頁內容的大小tab2Widget->setMinimumSize(ui->tabWidget->widget(0)->geometry().width(),ui->tabWidget->widget(0)->geometry().height());// tabwidget需要單獨調用內部控件的大小if (tab2Widget != NULL) {tab2Widget->resizeAllComponents(ui->tabWidget->widget(0)->geometry());}}}
}// 控件根據窗口大小自動調整控件大小 @{
void MainWindow::resizeEvent(QResizeEvent* event)
{if (event == NULL) {return;}double scaleX = (double)event->size().width() / windowOriginalSize.width();double scaleY = (double)event->size().height() / windowOriginalSize.height();for (auto iter = allLayoutMap.begin(); iter != allLayoutMap.end(); ++iter) {QLayout* layout = iter.key();QRect originalGeometry = iter.value();QRect newGeometry(originalGeometry.x() * scaleX,originalGeometry.y() * scaleY,originalGeometry.width() * scaleX,originalGeometry.height() * scaleY);if (layout) {layout->setGeometry(newGeometry);}}for (auto iter = allWidgetMap.begin(); iter != allWidgetMap.end(); ++iter) {QWidget* widget = iter.key();if (widget) {QRect originalGeometry = iter.value();QRect newGeometry(originalGeometry.x() * scaleX,originalGeometry.y() * scaleY,originalGeometry.width() * scaleX,originalGeometry.height() * scaleY);widget->setGeometry(newGeometry);// 防止在多屏(選擇擴展方式),移動到擴展屏時,tab頁文字疊在一起的問題QTabWidget* tab = dynamic_cast<QTabWidget*>(widget);if (tab != NULL) {tab->setElideMode(Qt::ElideNone);}}// 調整帶文本的控件的文本大小QPushButton* btn = dynamic_cast<QPushButton*>(widget);QLabel* label = dynamic_cast<QLabel*>(widget);QCheckBox* checkbox = dynamic_cast<QCheckBox*>(widget);QLineEdit* lineEdit = dynamic_cast<QLineEdit*>(widget);QTextEdit* textEdit = dynamic_cast<QTextEdit*>(widget);QPlainTextEdit* plainTextEdit = dynamic_cast<QPlainTextEdit*>(widget);QTextBrowser* textBrowser = dynamic_cast<QTextBrowser*>(widget);// 條件為了防止在隨意調節界面大小時,界面上出現黑塊問題if (textBrowser == NULL && (btn != NULL || label != NULL || checkbox != NULL|| lineEdit != NULL || textEdit != NULL || plainTextEdit != NULL)) {int initialFontSize = widget->height() / 3;if (btn != NULL) {initialFontSize = widget->height() / 4;} else if (checkbox != NULL) {initialFontSize = widget->height() / 2;}// 使用Do...While語句是為了始終會設置字體大小一次,防止界面縮小后又放大后,字體還一直保持很小的問題do {QFont font = widget->font();int size = initialFontSize;bool needBreak = false;// 最小9if (size < 9) {size = 9;needBreak = true;}// 根據按鈕的寬度/高度調整字體大小,可以根據默認控件的高度和字體的大小比率進行適當調整font.setPointSize(size);widget->setFont(font);initialFontSize--;if (needBreak) {break;}} while(checkTextOverflow(widget));}}if (windowOriginalSize.width() != -1) {// 設置通過addTab()函數新增的選項卡頁內容的大小if (ui->tabWidget->count() > 1) {// 布局或控件拿到之后才能調整if (tab2Widget->allWidgetMap.size() > 0|| tab2Widget->allLayoutMap.size() > 0) {// tab2tab2Widget->setMinimumSize(ui->tabWidget->widget(0)->geometry().width(),ui->tabWidget->widget(0)->geometry().height());// tabwidget需要單獨調用內部控件的大小if (tab2Widget != NULL) {tab2Widget->resizeAllComponents(ui->tabWidget->widget(0)->geometry());}}}}
}void MainWindow::findAllLayoutAndWidget(QObject *object) {QLayout *layout = qobject_cast<QLayout*>(object);QWidget *widget = qobject_cast<QWidget*>(object);if (layout) {if (layout->objectName() != "" && !allLayoutMap.contains(layout)) {allLayoutMap.insert(layout, layout->geometry());}for (int i = 0; i < layout->count(); ++i) {findAllLayoutAndWidget(layout->itemAt(i)->widget());}// 嵌套的選項卡,自適應尺寸放到對應類中,不在此類中調整} else if (widget && widget != tab2Widget) {if (widget != this && widget->objectName() != "" && !allWidgetMap.contains(widget)) {allWidgetMap.insert(widget, widget->geometry());}for (int i = 0; i < widget->children().size(); ++i) {findAllLayoutAndWidget(widget->children().at(i));}}
}bool MainWindow::checkTextOverflow(QWidget *widget) {if (widget == NULL) {return false;}QPushButton* btn = dynamic_cast<QPushButton*>(widget);QLabel* label = dynamic_cast<QLabel*>(widget);QCheckBox* checkbox = dynamic_cast<QCheckBox*>(widget);QLineEdit* lineEdit = dynamic_cast<QLineEdit*>(widget);QTextEdit* textEdit = dynamic_cast<QTextEdit*>(widget);QPlainTextEdit* plainTextEdit = dynamic_cast<QPlainTextEdit*>(widget);// TODO 可增加其他可調節文本的控件,以下的text文本也要相應賦值控件文本// 獲取按鈕的字體和文本QString text = "";if (btn != NULL) {text = btn->text();} else if (label != NULL) {text = label->text();} else if (checkbox != NULL) {text = checkbox->text();} else if (lineEdit != NULL) {text = lineEdit->text();} else if (textEdit != NULL) {text = textEdit->toPlainText();} else if (plainTextEdit != NULL) {text = plainTextEdit->toPlainText();}if (text.isEmpty()) {return false;}QFont font = widget->font();QFontMetrics fm(font);// 計算文本的寬度和高度int textWidth = fm.horizontalAdvance(text);int textHeight = fm.height();// 獲取按鈕的尺寸(不包括邊框)QSize buttonSize = widget->size();// 寬度多減去一些,為了防止有些時候按鈕字體和左右邊框切邊buttonSize.rwidth() -= 8 * widget->style()->pixelMetric(QStyle::PM_DefaultFrameWidth); // 減去邊框寬度buttonSize.rheight() -= 2 * widget->style()->pixelMetric(QStyle::PM_DefaultFrameWidth); // 減去邊框高度// 檢查是否溢出if (textWidth > buttonSize.width() || textHeight > buttonSize.height()) {return true;} else {return false;}
}// 控件根據窗口大小自動調整控件大小 @}
二、通過addTab()方法加入到主界面的類
相當于另一個模塊,只是界面嵌套到了主界面,既方便用戶操作,又能夠模塊化,方便維護。
tab2widget.h
class Tab2Widget : public QWidget
{Q_OBJECTpublic:explicit Tab2Widget(QWidget *parent = nullptr);~Tab2Widget();// 控件根據窗口大小自動調整控件大小 @{
public:void resizeAllComponents(QRect parentRect);QMap<QWidget*, QRect> allWidgetMap;QMap<QLayout*, QRect> allLayoutMap;/** 查找所有子布局和子控件 **/void findAllLayoutAndWidget(QObject *object);
private:/** 窗口默認尺寸 **/QSize windowOriginalSize = QSize(0,0);/** 檢查文本是否超出了容器寬或高,方便修改文本大小 **/bool checkTextOverflow(QWidget *widget);// 控件根據窗口大小自動調整控件大小 @}
};
tab2widget.cpp
#include "tab2widget.h"
#include "ui_tab2widget.h"Tab2Widget::Tab2Widget(QWidget *parent): QWidget(parent), ui(new Ui::Tab2Widget)
{// 控件根據窗口大小自動調整控件大小 @{// 延時為了獲取的控件初始大小是正確的QTimer::singleShot(200, this, [=] {windowOriginalSize = this->size();});// 控件根據窗口大小自動調整控件大小 @}
}Tab2Widget::~Tab2Widget()
{
}// 控件根據窗口大小自動調整控件大小 @{
void Tab2Widget::resizeAllComponents(QRect parentRect)
{if (parentRect.width() == 0 || parentRect.height() == 0|| windowOriginalSize.width() == 0 || windowOriginalSize.height() == 0) {return;}double scaleX = (double)parentRect.width() / windowOriginalSize.width();double scaleY = (double)parentRect.height() / windowOriginalSize.height();for (auto iter = allLayoutMap.begin(); iter != allLayoutMap.end(); ++iter) {QLayout* layout = iter.key();QRect originalGeometry = iter.value();QRect newGeometry(originalGeometry.x() * scaleX,originalGeometry.y() * scaleY,originalGeometry.width() * scaleX,originalGeometry.height() * scaleY);if (layout) {layout->setGeometry(newGeometry);}}for (auto iter = allWidgetMap.begin(); iter != allWidgetMap.end(); ++iter) {QWidget* widget = iter.key();if (widget) {QRect originalGeometry = iter.value();QRect newGeometry(originalGeometry.x() * scaleX,originalGeometry.y() * scaleY,originalGeometry.width() * scaleX,originalGeometry.height() * scaleY);widget->setGeometry(newGeometry);}// 調整帶文本的控件的文本大小QPushButton* btn = dynamic_cast<QPushButton*>(widget);QLabel* label = dynamic_cast<QLabel*>(widget);QCheckBox* checkbox = dynamic_cast<QCheckBox*>(widget);QLineEdit* lineEdit = dynamic_cast<QLineEdit*>(widget);QTextEdit* textEdit = dynamic_cast<QTextEdit*>(widget);QPlainTextEdit* plainTextEdit = dynamic_cast<QPlainTextEdit*>(widget);QTextBrowser* textBrowser = dynamic_cast<QTextBrowser*>(widget);// 條件為了防止在隨意調節界面大小時,界面上出現黑塊問題if (textBrowser == NULL && (btn != NULL || label != NULL || checkbox != NULL|| lineEdit != NULL || textEdit != NULL || plainTextEdit != NULL)) {int initialFontSize = widget->height() / 3;if (btn != NULL) {initialFontSize = widget->height() / 4;} else if (checkbox != NULL) {initialFontSize = widget->height() / 2;}// 使用Do...While語句是為了始終會設置字體大小一次,防止界面縮小后又放大后,字體還一直保持很小的問題do {QFont font = widget->font();int size = initialFontSize;bool needBreak = false;// 最小9if (size < 9) {size = 9;needBreak = true;}// 根據按鈕的寬度/高度調整字體大小,可以根據默認控件的高度和字體的大小比率進行適當調整font.setPointSize(size);widget->setFont(font);initialFontSize--;if (needBreak) {break;}} while(checkTextOverflow(widget));}}
}void Tab2Widget::findAllLayoutAndWidget(QObject *object) {QLayout *layout = qobject_cast<QLayout*>(object);QWidget *widget = qobject_cast<QWidget*>(object);if (layout) {if (layout->objectName() != "" && !allLayoutMap.contains(layout)) {allLayoutMap.insert(layout, layout->geometry());}for (int i = 0; i < layout->count(); ++i) {findAllLayoutAndWidget(layout->itemAt(i)->widget());}} else if (widget) {if (widget != this && widget->objectName() != "" && !allWidgetMap.contains(widget)) {allWidgetMap.insert(widget, widget->geometry());}for (int i = 0; i < widget->children().size(); ++i) {findAllLayoutAndWidget(widget->children().at(i));}}
}bool Tab2Widget::checkTextOverflow(QWidget *widget) {if (widget == NULL) {return false;}QPushButton* btn = dynamic_cast<QPushButton*>(widget);QLabel* label = dynamic_cast<QLabel*>(widget);QCheckBox* checkbox = dynamic_cast<QCheckBox*>(widget);QLineEdit* lineEdit = dynamic_cast<QLineEdit*>(widget);QTextEdit* textEdit = dynamic_cast<QTextEdit*>(widget);QPlainTextEdit* plainTextEdit = dynamic_cast<QPlainTextEdit*>(widget);// TODO 可增加其他可調節文本的控件,以下的text文本也要相應賦值控件文本// 獲取按鈕的字體和文本QString text = "";if (btn != NULL) {text = btn->text();} else if (label != NULL) {text = label->text();} else if (checkbox != NULL) {text = checkbox->text();} else if (lineEdit != NULL) {text = lineEdit->text();} else if (textEdit != NULL) {text = textEdit->toPlainText();} else if (plainTextEdit != NULL) {text = plainTextEdit->toPlainText();}if (text.isEmpty()) {return false;}QFont font = widget->font();QFontMetrics fm(font);// 計算文本的寬度和高度int textWidth = fm.horizontalAdvance(text);int textHeight = fm.height();// 獲取按鈕的尺寸(不包括邊框)QSize buttonSize = widget->size();// 寬度多減去一些,為了防止有些時候按鈕字體和左右邊框切邊buttonSize.rwidth() -= 8 * widget->style()->pixelMetric(QStyle::PM_DefaultFrameWidth); // 減去邊框寬度buttonSize.rheight() -= 2 * widget->style()->pixelMetric(QStyle::PM_DefaultFrameWidth); // 減去邊框高度// 檢查是否溢出if (textWidth > buttonSize.width() || textHeight > buttonSize.height()) {return true;} else {return false;}
}// 控件根據窗口大小自動調整控件大小 @}
注意:要實現界面自適應尺寸,控件的sizePolicy最好設置成Preferred或者Expanding,少用Fixed,否則會出現在縮小窗口尺寸的時候,由于控件最小尺寸設定死了,容易出現文字切邊的問題。