使用Qt Designer进行可视化图形界面开发,可以看作一个传统的工具集,并且不会对编译器强加其他特殊要求。
创建对话框的基本步骤:
1、创建并初始化子窗口部件;
2、把子窗口部件放到布局中;
3、设置Tab键顺序;
4、建立信号-槽之间的连接;
5、实现对话框中的自定义槽。
创建项目,包括ui文件,点击打开Qt设计师界面。
第一步创建一个标签(QLabel)、一个行编辑器(Line Edit)、一个水平分隔符(Horizontal Spacer)和两个按钮(Push Button)。
这一步可先从窗口部件工具箱中拖拽其名字或图标并将其放在窗体中的大概位置。在Qt设计师中分隔符会显示为一个弹簧模样,但在最终结果的窗体中它是不可见的。
1、单击文本标签,text属性设置为“&Cell Location:”;
2、单击第一个按钮,objectName设置为“okButton”,enabled属性设置为“false”,text属性设置为“OK”,default属性设置成“true”;
3、单击第二个按钮,objectName设置为“cancelButton“,并且将它的text属性设置成”Cancel“;
4、单击空白处,选中窗体本身,将窗口的windowTitle属性设置成”Go to Cell“。
现在,除了文本标签仍显示为”&Cell Location:“,其他窗口部件看起来都很不错。单击编辑->Edit Buddies进入一种允许设置窗口部件伙伴(buddy)模式。然后单击这个标签并把红色箭头拖到行编辑器上,释放鼠标按键。现在标签看起来应该显示为“Cell Location:”,单击编辑->Edit Widgets离开伙伴设置模式。
下一步在窗体中摆放这些窗口部件,步骤如下:
1、单击“Cell Location:”标签并且当单击与之相邻的行编辑器时按下Shift键Ctrl键,这样就可以同时选择它们,单击工具->Form Editor->水平布局(快捷键Ctrl+H);
2、单击分隔符,然后单击窗体窗体的OK按钮和Cancel按钮时一直按下Ctrl键。单击工具->Form Editor->水平布局(快捷键Ctrl+H);
3、单击窗体中的空白(即选中中心区域),取消对所有已选中项的选择,然后单击工具->Form Editor->垂直布局(快捷键Ctrl+L);
4、单击工具->Form Editor->调整大小(快捷键Ctrl+J);
在窗体上出现的红线就是已经创建的布局,在窗体运行时候,它们是绝不会出现的。
现在,单击编辑->Edit Tab Order。在每一个可以接收焦点的窗口部件上,都会出现一个带蓝色矩形的数字,按照你所希望的接收焦点的顺序单击每一个窗口部件,然后单击编辑->Edit Widgets,离开Tab键顺序设置模式。
要预览这个对话框,可单击工具->Form Editor->预览(快捷键Alt+Shift+R),通过重复按下Tab键来检查对话框Tab键的顺序。使用窗口标题栏上的Close按钮,可以关闭对话框。
如果现在运行该程序,对话框也可以工作,但它并没有正确地实现所想要的那些功能:
1、OK按钮总是失效;
2、Cancel按钮什么也做不了;
3、行编辑器可以接收任何文本,而不是只能接收有效的单元格位置坐标。
这里通过写一些代码,就可以让对话框具有适当的功能。最为简捷的做法是创建一个新类,让该类同时从QDialog和Ui::GoToCellDialog中继承出来,并且由它来实现那些缺失的功能。命名惯例是将该类与uic所生成的类具有相同的名字,只是没有Ui::前缀而已。
//gotocelldialog.h
#ifndef GOTOCELLDIALOG_H
#define GOTOCELLDIALOG_H
#include <QDialog>
namespace Ui {
class GoToCellDialog;
}
class GoToCellDialog : public QDialog
{
Q_OBJECT
public:
explicit GoToCellDialog(QWidget *parent = 0);
~GoToCellDialog();
private slots:
void on_lineEdit_textChanged();
private:
Ui::GoToCellDialog *ui;
};
#endif // GOTOCELLDIALOG_H
//gotocelldialog.cpp
#include "gotocelldialog.h"
#include "ui_gotocelldialog.h"
GoToCellDialog::GoToCellDialog(QWidget *parent) :
QDialog(parent),
ui