Qt基礎——UI文件.h文件說明

首先，需要使用Qt Designer設計你的UI界面。

Qt號稱是跨平台應用程序和UI開發框架，所以其自帶的UI設計器（即Qt Designer）功能也非常強大。

除了通常用的如Button，List等組件外面，使用Qt Designer做UI設計的過程中，用的最多的應該是它的Layouts了。

Qt Layout用於對窗口控件的排版，不需增加任何代碼實現控件自動對齊，以及隨窗口大小自動縮放等效果。對於Layout，這里就不多說了，有時間單獨開一篇寫吧。

此外，Qt Designer的屬性框里，可以對組件的屬性進行編輯（但貌似可供設置的屬性有限，很多特殊屬性還是要在代碼里指定，如輸入驗證等。。），還可以編輯簡單的信號和槽。

如圖，是一個用來測試的UI界面：

 

UI界面設計好以后，需要生成對應的.h文件，才可以在VS2008引用。怎么生成.h文件呢？很簡單，打開命令行，轉到ui文件目錄下，輸入uic -o ui_***.h ***.ui，執行即可在當前目錄下生成名為ui_***的.h文件，看圖：

需要說明的是，如果是新建工程時程序自動創建的ui文件，則不需要手動生成.h文件，因為程序創建時對ui文件屬性做了一些設置，看圖：

即，在ui文件屬性自定義生成步驟里，為文件指定命令行參數，這樣如果ui文件有修改，則程序在每次編譯之前都會生執行命令行內容，生成ui文件對應的.h文件。

好吧，開始今天的正題。

先看一下程序自動生成的幾個文件。

//main.cpp

#include "myqttest.h"
#include <QtGui/QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    myQtTest w;    
    w.show();
    return a.exec();
}

 

只是實例化一個myQtTest對象，然后show。再看下myQtTest里有什么。。

//myQtTest.h

#ifndef MYQTTEST_H
#define MYQTTEST_H

#include <QtGui/QDialog>
#include "ui_myqttest.h"

class myQtTest : public QDialog
{
    Q_OBJECT

public:
    myQtTest(QWidget *parent = 0, Qt::WFlags flags = 0);
    ~myQtTest();

private:
    Ui::myQtTestForm ui;

};

#endif // MYQTTEST_H

//myQtTest.cpp

#include "myqttest.h"
myQtTest::myQtTest(QWidget *parent, Qt::WFlags flags)
    : QDialog(parent, flags)
{
    ui.setupUi(this);
}

  myQtTest::~myQtTest()
  {

  }

 

我們注意到myQtTest.h文件里包含一個文件“ui_myqttest.h”，是我們剛才生成的頭文件，也是我們今天要分析的豬腳。。myQtTest定義了一個私有變量Ui::myQtTestForm ui，然后在構造函數中通過 ui.setupUi(this)方法，為ui對象指定宿主。

然后，去ui_myqttest.h里看看吧。。相關說明，看注釋吧。

/********************************************************************************
** Form generated from reading UI file 'myqttest.ui'
**
** Created: Sat Jun 23 00:28:50 2012
**      by: Qt User Interface Compiler version 4.7.3
**
** WARNING! All changes made in this file will be lost when recompiling UI file!
********************************************************************************/

#ifndef UI_MYQTTEST_H
#define UI_MYQTTEST_H

#include <QtCore/QVariant>
#include <QtGui/QAction>
#include <QtGui/QApplication>
#include <QtGui/QButtonGroup>
#include <QtGui/QDialog>
#include <QtGui/QDialogButtonBox>
#include <QtGui/QHBoxLayout>
#include <QtGui/QHeaderView>
#include <QtGui/QLabel>
#include <QtGui/QLineEdit>
#include <QtGui/QTextEdit>
#include <QtGui/QVBoxLayout>
#include <QtGui/QWidget>

QT_BEGIN_NAMESPACE

class Ui_myQtTestForm
{
public:
    /** 這個Widget在UI設計時是沒有的，是Qt為了方便組合其他的組件而且自動創建的。
    Widget的名字是根據最外層的組件來的，這里最外層是一個QVBoxLayout組件，故Widget
    以VerticalLayoutWidget命名*/
    QWidget *verticalLayoutWidget;
    /** 垂直布局，布局內的所有組件都將垂直對齊 */
    QVBoxLayout *verticalLayout;
    /** 水平布局，布局內的所有組件都將水平對齊 */
    QHBoxLayout *horizontalLayout_2;
    /** 文本顯示控件 */
    QLabel *label;
    /** 單選文本輸入控件 */
    QLineEdit *lineEdit;
    /** 垂直布局 */
    QVBoxLayout *verticalLayout_2;
    /** 單選文本輸入控件 */
    QLabel *label_2;
    /** 文件編輯框 */
    QTextEdit *textEdit;
    /** 按鈕框 */
    QDialogButtonBox *buttonBox;

    void setupUi(QDialog *myQtTestForm)
    {
        //設置對象名稱
        if (myQtTestForm->objectName().isEmpty())
            myQtTestForm->setObjectName(QString::fromUtf8("myQtTestForm"));
        //根據UI設計重置對話框的大小
        myQtTestForm->resize(535, 354);
        //創建myQtTestForm的Child Widget，
        verticalLayoutWidget = new QWidget(myQtTestForm);
        verticalLayoutWidget->setObjectName(QString::fromUtf8("verticalLayoutWidget"));
        verticalLayoutWidget->setGeometry(QRect(20, 20, 491, 311));

        //以下內容為UI設計的簡單的代碼實現
        verticalLayout = new QVBoxLayout(verticalLayoutWidget);
        verticalLayout->setObjectName(QString::fromUtf8("verticalLayout"));
        verticalLayout->setContentsMargins(0, 0, 0, 0);
        horizontalLayout_2 = new QHBoxLayout();
        horizontalLayout_2->setObjectName(QString::fromUtf8("horizontalLayout_2"));
        label = new QLabel(verticalLayoutWidget);
        label->setObjectName(QString::fromUtf8("label"));

        horizontalLayout_2->addWidget(label);

        lineEdit = new QLineEdit(verticalLayoutWidget);
        lineEdit->setObjectName(QString::fromUtf8("lineEdit"));

        horizontalLayout_2->addWidget(lineEdit);


        verticalLayout->addLayout(horizontalLayout_2);

        verticalLayout_2 = new QVBoxLayout();
        verticalLayout_2->setObjectName(QString::fromUtf8("verticalLayout_2"));
        label_2 = new QLabel(verticalLayoutWidget);
        label_2->setObjectName(QString::fromUtf8("label_2"));

        verticalLayout_2->addWidget(label_2);

        textEdit = new QTextEdit(verticalLayoutWidget);
        textEdit->setObjectName(QString::fromUtf8("textEdit"));

        verticalLayout_2->addWidget(textEdit);


        verticalLayout->addLayout(verticalLayout_2);

        buttonBox = new QDialogButtonBox(verticalLayoutWidget);
        buttonBox->setObjectName(QString::fromUtf8("buttonBox"));
        buttonBox->setOrientation(Qt::Horizontal);
        buttonBox->setStandardButtons(QDialogButtonBox::Cancel|QDialogButtonBox::Ok);

        verticalLayout->addWidget(buttonBox);

        //顯示控件文本，動態語言切換
        retranslateUi(myQtTestForm);
        QObject::connect(buttonBox, SIGNAL(accepted()), myQtTestForm, SLOT(accept()));
        QObject::connect(buttonBox, SIGNAL(rejected()), myQtTestForm, SLOT(reject()));

        QMetaObject::connectSlotsByName(myQtTestForm);
    } // setupUi

    void retranslateUi(QDialog *myQtTestForm)
    {
        myQtTestForm->setWindowTitle(QApplication::translate("myQtTestForm", "Dialog", 0, QApplication::UnicodeUTF8));
        label->setText(QApplication::translate("myQtTestForm", "LineEidt", 0, QApplication::UnicodeUTF8));
        lineEdit->setText(QApplication::translate("myQtTestForm", "\346\265\213\350\257\225lineEidt", 0, QApplication::UnicodeUTF8));
        label_2->setText(QApplication::translate("myQtTestForm", "TextEidt", 0, QApplication::UnicodeUTF8));
        textEdit->setHtml(QApplication::translate("myQtTestForm", "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0//EN\" \"http://www.w3.org/TR/REC-html40/strict.dtd\">\n"
"<html><head><meta name=\"qrichtext\" content=\"1\" /><style type=\"text/css\">\n"
"p, li { white-space: pre-wrap; }\n"
"</style></head><body style=\" font-family:'SimSun'; font-size:9pt; font-weight:400; font-style:normal;\">\n"
"<p style=\" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;\">Qt ui\345\244\264\346\226\207\344\273\266\350\247\243\346\236\220</p></body></html>", 0, QApplication::UnicodeUTF8));
    } // retranslateUi

};

//在命名空間UI下定義myQtTestForm，且全部從Ui_myQtTestForm繼承。只是為了使用時更加友好
namespace Ui {
    class myQtTestForm: public Ui_myQtTestForm {};
} // namespace Ui

QT_END_NAMESPACE

#endif // UI_MYQTTEST_H

 

相對比較簡單，這里需要注意一點就是，ui頭文件是在編譯ui文件時自動生成的，所以不要試圖對.h文件進行修改，那樣只會費力不討好。

另外，Qt在頭文件里自動創建了一個child widget，而且這個widget的大小是固定的，即設計時的大小，從而導致使用UI文件的窗口，其子控件們無法隨着窗口的放大縮小進行自動縮放。后面會介紹一個辦法來解決這個問題。