在QT Creator中简单的使用UI文件来设计界面并在源码中使用ui文件

时间:2022-05-28 05:22:30
使用的是Qt Creator 2.3.0 基于Qt 4.7.4 (32 bit) 构建于01:25:02 Aug 31 2011
当我们想用QT来做一个有界面的程序的时候,打开QtCreator之后建立一个工程
然后在“界面文件”里面就会存在一个xxx.ui的文件
当我们双击这个文件的时候就会打开一个QT的界面设计器
我们可以拖取很多的控件摆放在上面,然后设置属性之类的


那现在我没有搞明白的是,这个ui文件我怎么在代码中去使用它呢?
下面来研究研究


找了网上不少的博文,发现没看懂……话说我的C++基本上差劲到一定水平了
自己研究研究~~
用的是含有什么“影子构建”的方法创建的工程,因此编译之后会产生一个
xxx-build-desktop-4_7_0___的文件夹
里面有debug和release目录,Makefile之类的文件
还有一个ui_xxx.h的文件
这个文件号称是通过xxx.ui产生的,你清理一下工程它就没了
这个文件的命名也很有意思,就是根据“界面文件”里面的xx.ui产生的
比如我修改文件名为mywindow.ui然后重新构建一下工程就得到了ui_mywindow.h
然后看一下文件里面的内容
就是一个.h文件,用宏来控制重复包含
然后包含了一堆的头文件
QT_BEGIN_NAMESPAE和QT_END_NAMESPACE包裹了代码段,不过我不知道这个宏是干吗的
反正跟命名空间有关系,我对这个命名空间不怎么感冒
代码里面定义了一个Ui_MyWindow的class,一个类啊~
而且里面只有public的东西
哦 这里说一下,我没画什么东西,设计器里是这样子的:
QMainWIndow类的最顶层的叫MyWindow,里面的QWidget类的MyScreen,里面放了个按钮,QPushButton类的MyButton。其中MyScreen的大小是100x100,按钮是50x50我放到了*的位置。


继续看ui_mywindow.h
里面定义了QWidget *MyScree;和QPushButton *MyButton;两个对象。
然后一个void setupUi(QMainWindow *MyWindow)的函数
这个函数就是把MyScreen和MyButton给new出来,并且设置了ObjectName啊,大小啊,位置等等。
调用了下面的retranslateUi的函数,还调用了个QMetaObject::connectSlotByName(MyWindow)的函数


这个retranslateUi函数呢就紧接着在后面,设置了WindowTitle和Text。
这个connectSlotByName的东西参考了http://www.haogongju.net/art/638999这篇文章
它就是简单的根据name吧MyWidnow里面的slot和signal连接起来了。


ui_mywindow.h代码的最后是个
namespace Ui {
    class MyWindow: public Ui_MyWindow {};
} // namespace Ui
这部分很麻烦涉及到了语法和编译器的规则等等,参考了http://blog.chinaunix.net/space.php?uid=21453418&do=blog&id=442302文章。
感觉主要作用就是为了减少重新编译时候需要编译的文件数量,节省时间。
用指针来进行隔离,所谓的namesapce Ui不过是限定了神马命名空间的东西。
根据资料还查到这里面QT用了一个叫做PIMPL的技术,就是有效的隔离变化,不过在C里根本木有这种概念……。哎暂时不深究了。


我们的ui文件生成了代码如下
/********************************************************************************
** Form generated from reading UI file 'mywindow.ui'
**
** Created: Thu Nov 10 10:28:46 2011
**      by: Qt User Interface Compiler version 4.7.0
**
** WARNING! All changes made in this file will be lost when recompiling UI file!
********************************************************************************/


#ifndef UI_MYWINDOW_H
#define UI_MYWINDOW_H


#include <QtCore/QVariant>
#include <QtGui/QAction>
#include <QtGui/QApplication>
#include <QtGui/QButtonGroup>
#include <QtGui/QHeaderView>
#include <QtGui/QMainWindow>
#include <QtGui/QPushButton>
#include <QtGui/QWidget>


QT_BEGIN_NAMESPACE


class Ui_MyWindow
{
public:
    QWidget *MyScreen;
    QPushButton *MyButton;


    void setupUi(QMainWindow *MyWindow)
    {
        if (MyWindow->objectName().isEmpty())
            MyWindow->setObjectName(QString::fromUtf8("MyWindow"));
        MyWindow->resize(100, 100);
        MyScreen = new QWidget(MyWindow);
        MyScreen->setObjectName(QString::fromUtf8("MyScreen"));
        MyButton = new QPushButton(MyScreen);
        MyButton->setObjectName(QString::fromUtf8("MyButton"));
        MyButton->setGeometry(QRect(25, 25, 50, 50));
        MyWindow->setCentralWidget(MyScreen);


        retranslateUi(MyWindow);


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


    void retranslateUi(QMainWindow *MyWindow)
    {
        MyWindow->setWindowTitle(QApplication::translate("MyWindow", "MainWindow", 0, QApplication::UnicodeUTF8));
        MyButton->setText(QApplication::translate("MyWindow", "PushButton", 0, QApplication::UnicodeUTF8));
    } // retranslateUi


};


namespace Ui {
    class MyWindow: public Ui_MyWindow {};
} // namespace Ui


QT_END_NAMESPACE


#endif // UI_MYWINDOW_H



那么在QT的代码部分,我们怎么使用它呢???
自动建立的工程里面就三个文件:main.cpp mainwindow.cpp mainwidnow.h
在mainwindow.h里写上了
namespace Ui {
    class MyWindow;
}
好吧,该死的namespace。这里应该算个声明吧。
下面是MyWidnow的实现,继承自QMainWindow。
然后在private里有一个Ui::MyWidnow *ui;就是这里了,建立了一个ui的对象。
然后在mainwindow.cpp中MyWindow的构造函数里用ui(new Ui::MyWindow)来建立了对象,恩,应该是这样子吧。
然后构造函数里调用了ui->setupUI(this);来建立界面。
在main.cpp中直接用MyWindow w;来建立对象然后显示操作了w.show();


为了用一下这个按钮,我在设计器中把按钮的QAbstactButton的text改成了“A",就是个字母A。
然后想让它点击一下的时候打印点东西出来。
怎么搞呢?
似乎我找到了个简单的不行的办法。在mainwindow.h中的MyWindow类里定义个SLOT用来打印以具体是信息什么的。
然后呢,在mainwindow.cpp中实现这个函数,并且在类的构造函数中用connect连接起来。
这样当类被实例化的时候,构造函数被自动调用,信号和槽就关联起来了。
这里要说的是,基本的语法信号函数要被SINGAL()包含起来,槽函数要被SLOT()包含起来。


最后编译运行,点击按钮就可以看到打印信息了。


mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

namespace Ui {
    class MyWindow;
}

class MyWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MyWindow(QWidget *parent = 0);
    ~MyWindow();

private:
    Ui::MyWindow *ui;

public slots:
    void ButtonClickedMsg(void);
};

#endif // MAINWINDOW_H

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mywindow.h"

MyWindow::MyWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MyWindow)
{
    ui->setupUi(this);
    connect(ui->MyButton, SIGNAL(clicked()), this, SLOT(ButtonClickedMsg()));
}

MyWindow::~MyWindow()
{
    delete ui;
}

void MyWindow::ButtonClickedMsg(void)
{
    qDebug("You just clicked the Button \"A\"\n");
}

main.cpp

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

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MyWindow w;
    w.show();

    return a.exec();
}