您的位置:首页 > 产品设计 > UI/UE

使用VS2010调用QtDesigner设计的UI文件,并实现控件功能

2015-11-08 20:20 1036 查看
一、利用Qt Designer设计UI。

参见《Linux窗口程序设计—Qt4精彩实例分析》

1、使用Qt Designer设计对话框的步骤:





2、Qt Designer5中表单模板。





3、创建窗体,在窗体放置控件(拖动控件到窗体界面);

4、布局控件;

选择位于同一行的所有控件,选择Qt Designer菜单中的Form->LayOut Horizontally命令,完成所选控件的水平布局。完成布局后适当调整整个窗体的大小,以适应控件的大小。

5、设置各控件标签顺序;

选择Qt Designer菜单中的Edit->Edit Tab Order命令,进入标签设置模式,窗体中各个空间上出现蓝色的小框,框内的数字表示该控件的标签顺序,即焦点顺序,如下图所示,可以单击蓝色小框修改标签顺序。完成后选择QtDesigner菜单中的Edit->Edit
Widgets命令(或者F3)离开标签设置模式。





6、创建和连接信号和槽

选择Qt Designer菜单中的Edit->EditSignals/Slots命令,进入信号/槽连接模式,如下图所示。





此时单击控件,然后拖动鼠标,可以发现一根红色的类似接地线的标志线被拖出,松开鼠标,弹出信号/槽的连接配置窗口,如下图所示。





注:选择左边列表框中的信号,然后才可以选择右边槽函数,之后点击确定即可。

疑问:这些槽函数所代表的意思分别是??

至此,关于QtDesigner的操作就结束了,生成一个.ui文件。此文件即是UI文件,使用前需要加入工程并被编译。

【使用QtDesigner设计对话框的优劣】可以节省设计对话框的时间,而且修改方便、直观,对于初学者来说,这是一种入门的好方法。带随着程序越来越复杂,QtDesigner也有不利的地方:首先,使用QtDesigner生成的代码比较庞大,很多代码是自动生成的,不利于开发者阅读;其次,不利于对Qt编程本质的理解。

二、调用QtDesigner生成的ui文件。

说明:我的开发环境是在VS2010中开发Qt程序,所以以下所有内容均是在此基础上做的实现。此开发环境的搭建见博文《QT介绍以及配置QT使用VS2010开发》

1、单纯的调用ui文件。

在上面生成的ui文件为myui.ui,如何将其添加到工程中并使用呢,步骤如下:

a、使用VS2010新建Qt Application,工程名myui;

b、使用QtDesigner生成的myui.ui文件覆盖VS2010建立Qt工程中的myui.ui;

c、在VS2010解决方案树状图中找到myui.ui,右键选择“编译”命令,VS会自动调用Qt的uic工具编译ui文件,生成头文件ui_myui.h。这个文件包含了在Designer中所做的所有工作。

【对生成的ui_myui.h说明】

c1、该文件是自动生成的,如果在UI设计过程中连接了信号和槽,那么生成的代码中将出现如下类似代码:

retranslateUi(Dialog);
QObject::connect(pushButtonOK, SIGNAL(clicked()), Dialog,
SLOT(accept()));
QObject::connect(pushButtonCancel, SIGNAL(clicked()), Dialog,
SLOT(reject()));

QMetaObject::connectSlotsByName(Dialog);
用于将UI中控件的信号和槽函数绑定。

这样在自己实现槽函数的时候就不用再写绑定函数了。

c2、在此.h文件中有定义了一个类class
Ui_Dialog,并且有一个Dialog类以public的方式继承Ui_Dialog,在namespace ui中,class Dialog: public Ui_Dialog {}
名字可能有些不同。特别说明:Dialog即是我们用designer设计的ui实体类。在main函数中就是使用此类声称对象。
d、修改myui工程的main.cpp文件。如下:





将原有包含的头文件“myui.h”修改为新生成的ui_myui.h,包含Dialog头文件。在main函数中添加如图所示代码运行即可运行调用UI文件。目前只是调用了UI,并没有实现槽函数。

2、实现UI中添加的系统定义槽函数。

自己定义类实现槽函数。为什么要自己定义类呢?是这样的,如果我们直接调用的话,有很大的弊端:当我们的工程很浩大的时候,如果我们要修改ui文件了,则要相应改很多源程序来继续当前的功能,而如果我们定义一个类来继承它的话,随你ui怎么变,跟我关系不是很大。参见:

http://hi.baidu.com/togethershore/blog/item/302ba89af858ebbdc9eaf4e9.html

myclass.h

#include

#include “ui_myui.h”

namespace Ui

{

class myui;//注:designer生成的ui类为ui_DialogClass,而我们只是用它的派生类myui ,即myui是ui_DialogClass的一个实体

}

class myclass : public QDialog//自定义一个类myclass,通过调用ui类

{

Q_OBJECT

public:

myclass(QWidget *parent = 0);//最顶层父窗口为QWidget

~myclass();

private:

Ui::myui *ui;//创建一个ui指针对象,因为designer只是设计出来一个myui实体类,是个宏观概念,我们必须定义一个对象才能调用它

};

myclass.cpp

#include "myclass.h"

myclass::myclass(QWidget *parent) :QDialog(parent),ui(new Ui::myui)

{

ui->setupUi(this);//使用ui类

//如果没有在UI设计过程中连接信号和槽函数则在此处添加。

}

myclass::~myclass()

{

delete ui;

}

OK!我们的类已经定义好,写main函数调用自定义的类

#include

#include"myclass.h"//注:为什么只要这个头文件就可以了呢?因为当我们创建一个myclass的对象的时候,会自动调用它的构造函数,释放时自动调用其析构函数。事实上我们不止只用一个构造函数与析构函数,这时候怎么办呢?在myclass.h中声明该函数,在myclass.cpp中写具体实现方法。

int main(int argc,char *argv[])

{

QApplication app(argc,argv);

myclass window;

window.show();

return app.exec();

}

3、如果没有在UI设计过程中连接信号和槽函数则在自己定义的实现类中添加槽函数,并连接,连接位置一般在实现类的构造函数中。此时connect函数在使用UI上的控件时一定要加前缀。如下:

connect( ui->pushButton, SIGNAL( clicked() ), this, SLOT( close() ) );
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: