QT布局以及使用QSS
? ? ? ? ?最近花了一周的時間學習了QT,學習的結果是能夠使用它進行一些簡單的界面開發,其實在學習的過程中發現QT的功能還是挺強大的,但因為學習的時間太短,可能它的精髓還沒有能夠體會到,現在想要把這段時間學習的心得體會記錄一下,以便將來使用時可能會用到。
做了一個簡單的界面,界面的大致情況如下圖所示:
? ? ?
? ? ?界面配色有點丑,整個界面我是使用QSplitter進行分隔的,分成了四個板塊,分別是左邊的Control,上邊的Toolbar、中間的Content以及下面的TextButtom, Control、ToolBar、Content我都分別創建了三個單獨的類用于他們的布局以及功能的完善,最終在MainWindow中進行最終的布局,在這里遇到過一個問題,就是在MainWindow中布局的時候,當時沒有布局的顯示,最后需要加上這句話setCentralWidget(splitterMain);? 即把主要的窗口放到MainWindow的CentralWidget中,代碼如下:
? ??
splitterMain = new QSplitter(Qt::Vertical,this);splitterTop = new QSplitter(Qt::Horizontal,splitterMain);textButtom = new QTextEdit(splitterMain);textButtom->setAlignment(Qt::AlignLeft);splitterMain->setStretchFactor(0,8);splitterMain->setStretchFactor(1,2);Control *control = new Control(splitterTop);splitterRight = new QSplitter(Qt::Vertical,splitterTop);splitterTop->setStretchFactor(0,2);splitterTop->setStretchFactor(1,15);ToolBar *toolbar = new ToolBar(splitterRight);Content *content = new Content(splitterRight);splitterRight->setStretchFactor(1,1);splitterRight->setStretchFactor(1,9);setCentralWidget(splitterMain);toolbar->setObjectName(tr("toolbar"));? ? ?QT中核心的就是信號(SIGNAL)與槽(SLOT)的概念,這樣可以將不同的函數之間的關系通過信號與槽連接在一起,在Control中,通過將按鈕與相對應的槽函數連接起來,當按鈕被按下時發送相對應的信號,在主函數中又將該信號同需要執行的函數進行連接,這樣就可以實現界面與函數之間的關聯了。
 
? ? ?QCustomPlot是一個十分有用的繪圖控件,我在content中用到了QCustomPlot進行數據的繪制,使用QCustonPlot很方便,只需要在其中加上qcustomplot.hqcustomplot.cpp就可以,QCustomPlot可以繪制比較復雜的圖像,我在本例中只是簡單的使用了key-value,關于QCustomPlot的使用今后我會繼續學習,在這里就不做 贅述。
 
? ? ?在這里我想要著重說明的是對QT界面的美化,使用的是setStyleSheet,并將所有的界面配置信息都放到了一個資源文件skin.qss當中,程序中只需要加載這個資源文件就可以實現對界面的weight進行美化,這樣就很方便的將程序和美化分離開來,也方便之后的修改。
? ? ?在main函數中對skin.qss的調入代碼如下:
? ? ??
#include "mainwindow.h" #include <QApplication> #include <QObject> #include <QSize> #include "control.h" #include "toolbar.h" #include "content.h"#include <QFile> #include <QStyleFactory> #include <QTextStream>bool setSkin(QApplication* const app, QString const &skinFile) {QFile file(skinFile);if (QFile::exists(skinFile) && file.open(QIODevice::ReadOnly)){QApplication::setStyle(QStyleFactory::create("Windows"));QString strTemp;QTextStream in(&file);while (!in.atEnd()){strTemp.append(in.readLine());}file.close();app->setStyleSheet(strTemp);}else{ #ifdef Q_WS_MACqDebug("%s: %s: File does not exist %s... setting mac style...",__FILE__, __FUNCTION__, qPrintable(skinFile));app->setStyle(new QMacStyle());return true; #elseqDebug("%s: %s: File does not exist or failed to open %s",__FILE__, __FUNCTION__, qPrintable(skinFile));return false; #endif}return true; }int main(int argc, char *argv[]) {QApplication a(argc, argv);QFont font("ZYSong18030",8);a.setFont(font);MainWindow w ;w.resize(QSize(1000,700));//加載應用皮膚setSkin(&a ,("skin.qss"));w.show();return a.exec(); }? ? ? ?這樣就能夠把skin.qss加載到程序當中,而本界面中的skin.qss的相關代碼如下: QPushButton {color:white;background:#6495ED;border-width: 1px;border-radius: 5px;border-color: black;padding: 1px;font-weight:bold;}QPushButton::hover{ background:#4169E1;border-color:black;} QPushButton::disabled{background: silver;border-color:black;color:black; }QLabel{border: 1px solid #32435E;border-radius: 3px;color: white;font-weight:bold;background:#212C3F; }QMainWindow{background:#DCDCDC; }QSplitter::handle{background-color:#A9A9A9; }QCheckBox{font-weight:bold; }QCheckBox::indicator{width:70px;height: 30px; }QCheckBox::indicator::unchecked{ font-weight:bold;image: url(:/images/unchecked); }QCheckBox::indicator::checked{image: url(:/images/checked); }QLineEdit{border: 1px solid #32435E;border-radius: 3px;background:white;selection-background-color: #0A246A; }QTextEdit{border: 1px solid #32435E;border-radius: 3px;background:white;selection-background-color: #0A246A; }QComboBox {border: 1px solid #32435E;border-radius: 3px;padding: 1px 18px 1px 3px;min-width: 6em; }QComboBox::hover{border-color:#5D8B9E; }QComboBox QAbstractItemView {border: 2px solid #32435E;selection-background-color:#6495ED;background: white; } ? ? ? 在其中用到的圖片是通過加載到QT資源文件的方式加載進去的,使用起來較為方便。? ? ? 當然,一周的成品效果并沒有太好,因為是通過純代碼的方式進行的布局,因此相對使用QT Designer 來說相對耗時一些,但個人覺得使用代碼更加靈活,如果只是簡單的布局當然是使用Designer更加方便,但是如果使用的是較為復雜的布局,那么使用代碼布局將會更加的方便進行修改,后期如果需要修改的話那么耗時以及精力就會需要的更少。
 
總結
以上是生活随笔為你收集整理的QT布局以及使用QSS的全部內容,希望文章能夠幫你解決所遇到的問題。
 
                            
                        - 上一篇: 由温度决定风扇转速
- 下一篇: linux系统搭建redis clust
