QT：Qt设计师的使用 designer

QT设计师的使用 designer

<tips>
源文件/头文件的'最后加空行'，有些编译不加空行会报警告。

1. 启动设计师
在命令行 $: designer
根据提示选择模板（父窗口）：Dialog without buttons
文件 -> 保存 (CalculatorDialog.ui)

2. 设计UI界面，得到 .ui 文件
设置相关属性：
窗口/按钮文字、成员变量名字、组件(大小、样式、文字等...)
1 ） Ctrl + 1 '组件水平布局' 或 Ctrl + 2 '组件垂直布局 '
2 ） Ctrl + j '容器窗口自动适应大小'
3 ）Ctrl + g '栅格化布局 '

3. 使用'uic'命令将 .ui 文件转换成 .h 文件
$: uic *.ui -o *.h
eg：
$: uic CalculatorDialog.ui -o ui_CalculatorDialog.h

4. 使用.h文件
ui_CalculatorDialog.h:
class Ui_CalculatorDialog {
setupUi (QDialog * CalculatorDialog); // 界面初始化
};
namespace Ui {
class CalculatorDialog : public Ui_CalculatorDialog { NULL }
}
Ui_CalculatorDialog <==> Ui::CalculatorDialog
两个名字都可以，等价的，常用的是后者 'Ui::XxxxYxxx'。

"使用方法1"：基类子对象形式去调用setupUi ()
class xx : public Ui::CalculatorDialog {
  // 基类子对象形式去调用setupUi ()
  xx () {
   setupUi (); // 完成界面初始化
  }
};

"使用方法2"：成员子对象，指针调用
class xx {
private:
  Ui::CalculatorDialog* ui; // 成员子对象，指针直接 -> 调用
  xx () : ui (new Ui::CalculatorDialog) {
   ui->setupUi (); // 完成界面初始化
  }
};
5. 编写相关对应构造函数和槽函数声明的.h文件，以及.cpp实现文件
构造函数第一句调用 setupUi (this) ;

《案例》登录对话框 Login
1. 使用设计师设计UI界面
designer ---> LoginDialog.ui
2. 根据UI文件生成对应的头文件
$: uic LoginDialog.ui -o ui_LoginDialog.h

/** 登陆对话框案例 - 代码演示 **/

// LoginDialog.h
#ifndef _LOGINDIALOG_H
#define _LOGINDIALOG_H
#include <QDialog>
#include <QMessageBox > // 消息框
#include "ui_LoginDialog.h"
class LoginDialog : public QDialog, public Ui::LoginDialog {Q_OBJECT
public:LoginDialog (void);
private slots:void onAccpted (void); // 处理Ok按钮void onRejected (void); // 处理Cancel按钮
};
#endif //_LOGINDIALOG_H

// LoginDialog.cpp
#include "LoginDialog.h"
#include <QPushButton>
// 构造函数
LoginDialog::LoginDialog (void) {// 初始化界面setupUi (this);// ok按钮发送信号 acceptedconnect (m_btnBox, SIGNAL (accepted ()), this, SLOT (onAccpted ()));// cancel按钮发送信号 rejectedconnect (m_btnBox, SIGNAL (rejected ()), this, SLOT (onRejected ()));// 将按钮盒上的内容改成中文m_btnBox->button (QDialogButtonBox::Ok)->setText ("登录");m_btnBox->button (QDialogButtonBox::Cancel)->setText ("取消");
}
// 处理Ok按钮槽函数
void LoginDialog::onAccpted (void) {if (m_editUserName->text () == "tarena" && m_editPasswd->text () == "123456") {// qDebug 是一个打印调试的函数，使用方法类似于 printfqDebug ("登录成功Login Success...");close (); // 关闭窗口} else {  // 如果用户名或者密码错误
//      QMessageBox msgBox (QMessageBox::Critical, "错误：", "用户名或密码错误！", QMessageBox::Ok, this);QMessageBox msgBox (QMessageBox::Warning, "提示", "用户名或密码错误！", QMessageBox::Ok, this);// 改变Ok按钮为中文：确定msgBox.setButtonText (QMessageBox::Ok, "确定");msgBox.exec (); // 等待时间结束，也就是等待点击Ok按钮}
}
// 处理Cancel按钮槽函数
void LoginDialog::onRejected (void) {// 创建一个用于提示的消息框 QMessageBox// 参数1：消息框风格// 参数2：标题// 参数3：提示消息内容// 参数4：按钮盒// 参数5：父窗口指针this QMessageBox msgBox (QMessageBox::Question, windowTitle (), "确定要取消登录吗？", QMessageBox::No | QMessageBox::Yes, this);msgBox.setButtonText (QMessageBox::No, "取消");msgBox.setButtonText (QMessageBox::Yes, "确定");// 显示消息框，如果点击Yes按钮则关闭对话框if (msgBox.exec () == QMessageBox::Yes)close ();  // QDialog 继承过来的, this->close () 关闭对话框
}

// main.cpp
#include "LoginDialog.h"
#include <QApplication>
int main(int argc, char *argv[])
{QApplication a(argc, argv);LoginDialog w;w.show();return a.exec();
}

《案例》显示系统时间

/** 代码演示 - 显示静态的系统时间 **/

// TimeDialog.h
#ifndef _TIMEDIALOG_H
#define _TIMEDIALOG_H
#include <QDialog>
#include <QTime>  // 补充到当天笔记
#include <QPushButton>
#include <QLabel>
#include <QVBoxLayout>  // 垂直布局器
#include <stdio.h>
class TimeDialog : public QDialog {Q_OBJECT
public:TimeDialog (void);
private slots:void timeClicked (void); // 自定义点击对应的槽函数
signals: // 自定义信号，只需声明不能写实现!!!void timeSetText (const QString&);
private:QLabel* m_labTime;QPushButton* m_btnTime;
};
#endif //_TIMEDIALOG_H

// TimeDialog.cpp
#include "TimeDialog.h"
// 构造函数
TimeDialog::TimeDialog (void) {setWindowTitle ("系统时间");m_labTime = new QLabel (this);m_btnTime = new QPushButton ("当前系统时间", this);// 设置label边框效果: 凹陷m_labTime->setFrameStyle (QFrame::Panel | QFrame::Sunken);// 设置文本内容水平和垂直都居中显示 m_labTime->setAlignment (Qt::AlignHCenter | Qt::AlignVCenter); // 创建垂直布局器 QVBoxLayout* layout = new QVBoxLayout (this); layout->addWidget (m_labTime); layout->addWidget (m_btnTime); setLayout (layout);// 点击获取时间按钮执行自定义槽函数connect (m_btnTime, SIGNAL (clicked ()),this, SLOT (timeClicked ()));connect (this, SIGNAL (timeSetText (const QString&)),m_labTime, SLOT (setText (const QString&)));
}
// 自定义槽函数
void TimeDialog::timeClicked (void) {
#if 0m_labTime->setText (QTime::currentTime ().toString ( "hh:mm:ss"));
#else// emit是qt定义的关键字，后面跟的是信号内容，没有特殊作用emit timeSetText (QTime::currentTime ().toString ("hh:mm:ss"));
#endif
}

// Time.cpp (main)
#include <QApplication>
#include "TimeDialog.h"
int main (int argc, char** argv) {QApplication app (argc, argv); TimeDialog dialog; dialog.show (); return app.exec ();
}

QT：Qt设计师的使用 designer相关推荐

Qt创建设计师自定义控件（Qt Designer自定义控件）
Qt提供了一个Designer界面,使得我们可以自由拖动控件对ui进行布局,但所有的控件都是固定的,如果我们想要自定义一个自己设计的控件,添加到Designer中,可供设计者自由设计.那么可以进行如下 ...
第七章：Qt设计师使用（designer）
前情回顾: 第一章:Qt的概述第二章:在Ubuntu编写第一个Qt程序第三章:Qt的字符串和字符编码第四章:Qt的信号和槽第五章:Qt容器窗口(父窗口) 第六章:面向对象的Qt编程 Qt设计师 ...
VS+QT双击ui文件用Designer打开时出现未指定错误/无法打开XX.ui文件
在VS与Qt交互中,刚刚会在VS中使用Designer打开某ui文件,工作机制其实是vs利用到了qt vs tools 工具调用designer.exe打开某ui文件下面介绍的方法一就是重置qt v ...
QT - QT中配置MSVC编译环境以及 VS中配置QT开发环境
本文主要记录一下如何在 QT5.14.2 中配置 MSVC2017 构建套件,以及在VS2017中配置QT的开发环境.开发环境为 Win10 + QT5.14.2 + Visual Studio 2 ...
QT——Qt QtCreator 官方下载地址
[系列专栏]:博主结合工作实践输出的,解决实际问题的专栏,朋友们看过来! <项目案例分享> <极客DIY开源分享> <嵌入式通用开发实战> <C++语言开发基 ...
Qt, QT/E, Qtopia 的区别
转自Qt, QT/E, Qtopia 的区别 Qt泛指Qt的所有桌面版本,比如Qt/X11,Qt Windows,Qt Mac等.由于Qt最早是在Linux中随着KDE流行开来的,因此通常很多人说的Q ...
Qt | Qt For Android、Qt5.14.2安卓开发环境搭建详细步骤
Qt | Qt For Android.Qt5.14.2安卓开发环境搭建详细步骤目录 Qt | Qt For Android.Qt5.14.2安卓开发环境搭建详细步骤 1.简介 2.软件下载 1.J ...
[Qt] Qt自带的modbus client 和 server 例程的拓展
使用Qt的modbus时,看官方的例程学习一下,发现各种寄存器只定义了10个,不方便使用,于是将寄存器数量拓展了,并将client 和 server集成到一个工程中,用.pri文件进行管理. 主页: ...
linux 界面工具 qt,Qt主窗口中的工具栏
工具栏类 QToolBar 快捷项 QAcitonQToolBar* tb = addToolBar("Tool Bar");//addToolBar是Qt主窗口的成员函数,在主窗 ...

QT：Qt设计师的使用 designer

QT：Qt设计师的使用 designer相关推荐

最新文章

热门文章