QT纯代码设计UI界面Demo

一、前言

二、界面

三、源码简析

四、Demo/源码

一、前言

UI的设计方法有几种：

①一种是使用Qt Designer，也就是可视化设计，这在小型项目中常见，优点就是可观简便；

②另一种就是纯代码设计UI，也就是不可视设计UI，这在中大型项目常见，优点是界面隐蔽性强。

无论那种方式，实际上都是转化为第二种的方式，只是第一种是QT已经帮忙处理了，处理成第二种纯代码的形式。

本文简析纯代码设计UI的Demo，大家在项目中可以直接套用。

二、界面

界面设计很简便，两个label，两个button，button配槽函数，请配合源码看

三、源码简析

①源码结构

②工程里需要加入model

CUI.pro

QT       += core guigreaterThan(QT_MAJOR_VERSION, 4): QT += widgetsTARGET = CUITEMPLATE = appSOURCES += main.cpp \CUI.cppHEADERS += \CUI.h

③在main里显示CUI界面类

main.cpp

#include <QApplication>
#include "CUI.h"int main(int argc, char *argv[])
{QApplication a(argc, argv); //注意是QApplicationCUI ui;ui.show();return a.exec();
}

④界面类的设计：

CUI.h

#ifndef CUI_H
#define CUI_H#include <QWidget>class CUI : public QWidget
{Q_OBJECTclass Impl;
public:explicit CUI(QWidget *parent = 0);~CUI();private slots:void stClickedbutton1();void stClickedbutton2();private://使用智能指针处理界面的内容QScopedPointer<Impl>    m_Impl;
};#endif // CUI_H

CUI.cpp

#include "CUI.h"
#include <QPushButton>
#include <QLabel>
#include <QGridLayout>//定义界面类的键和函数
class CUI::Impl
{
public:QLabel*             label_1;QPushButton*        button_1;QLabel*             label_2;QPushButton*        button_2;void setupUi(QWidget* parent);void retranslate(QWidget* parent);void signalSlot(QWidget* parent);
};//初始化布局
void CUI::Impl::setupUi(QWidget *parent)
{label_1 = new QLabel;button_1 = new QPushButton;label_2 = new QLabel;button_2 = new QPushButton;QGridLayout* glayReview = new QGridLayout(parent);glayReview->setContentsMargins(10, 10, 10, 10);glayReview->addWidget(label_1, 0, 0, 1, 1);glayReview->addWidget(button_1, 0, 1, 1, 1);glayReview->addWidget(label_2, 1, 0, 1, 1);glayReview->addWidget(button_2, 1, 1, 1, 1);retranslate(parent);signalSlot(parent);
}//初始化名称size等
void CUI::Impl::retranslate(QWidget* parent)
{label_1->setText("label_1");button_1->setText("button_1");label_2->setText("label_2");button_2->setText("button_2");label_1->setMinimumWidth(150);button_1->setMinimumWidth(100);label_2->setMinimumWidth(150);button_2->setMinimumWidth(100);parent->setFixedSize(250,250);
}//初始化信号槽
void CUI::Impl::signalSlot(QWidget *parent)
{connect(button_1, SIGNAL(clicked()), parent, SLOT(stClickedbutton1()));connect(button_2, SIGNAL(clicked()), parent, SLOT(stClickedbutton2()));
}CUI::CUI(QWidget *parent) :QWidget(parent),m_Impl(new Impl)
{//设置UIm_Impl->setupUi(this);
}CUI::~CUI()
{
}void CUI::stClickedbutton1()
{m_Impl->label_1->setText("label_1_change");
}void CUI::stClickedbutton2()
{m_Impl->label_2->setText("label_2_change");
}

四、Demo/源码

链接：https://pan.baidu.com/s/1IfprWv2D5nxA88yNFXlPLw
提取码：pn49

QT纯代码设计UI界面Demo相关推荐

PyQt5 图形界面-用Qt Designer来设计UI界面，并转化为python代码运行实例演示
Qt Designer 是 Qt Creater 程序里的一个功能. PyQt5 是把 Qt Designer 设计的界面转化为 python 代码的库. 请看这篇文章: Qt Creater.PyQ ...
嵌入式开发QT教程-5集纯代码编写UI界面
上节课我们使用ui界面文件形式创建了窗体以及关闭按钮,现在尝试使用纯代码形式创建,并对比二者优劣.我们创建工程文件NO_UI,并取消勾选Generate form表示不生成界面文件,选择QWidget ...
QT纯代码打造音乐播放器
QT纯代码打造音乐播放器在.pro文件中添加 QT = prmultimedia 然后就是在.h文件中添加相关库函数我添加的库函数有些是不需要的,可以自定义删除修改我是为方便以后扩展功能就留下 ...
PyQt4设计UI界面并添加简单功能【python+pyqt4+opencv】
学习python的过程中,了解到PyQt,加上先前用过OpenCV,自然就有了用PyQt设计UI界面,调用OpenCV函数实现功能的想法. 步骤: 1. Qt designer 快速实现UI界面,并 ...
MATLAB AppDesigner 设计UI界面中调用自定义函数
在MATLAB AppDesigner设计UI界面过程中,如果直接在APPDesigner代码编辑框中编写代码,如代码量较大,会导致代码混乱的问题.使用调用函数的方法能够解决该问题. 本文将介绍MAT ...
GUI Guider设计UI界面移植到STM32
GUI Guider设计UI界面移植到STM32 一.什么是GUI Guider 什么是 GUI-Guider? GUI Guider 是恩智浦为 LVGL 开发了一个上位机GUI 设计工具,可以通过 ...
优秀的设计UI界面按钮素材，让点击率飙升
快节奏的网络数码时代人们越来越离不开智能设备,面对屏幕上无数的按钮,点还是不点是个问题.不知道大家有没有发现,按钮越多,我们点击得越慢.这是因为只要有按钮,我们的下意识就会"检查" ...
Java代码控制UI界面
介绍在 Android 中,支持像 Java Swing 那样完全通过代码控制 UI 界面.也就是所有的 UI 组件都通过 new 关键字创建出来,然后将这些 UI 组件添加到布局管理器中,从而实现 ...
PyQt5系列教程(二)利用QtDesigner设计UI界面
软硬件环境 OS X EI Capitan Python 3.5.1 PyQt 5.5.1 PyCharm 5.0.1 前言在PyQt5系列教程的第一篇http://blog.csdn.net/dj ...

QT纯代码设计UI界面Demo

一、前言

二、界面

三、源码简析

四、Demo/源码

QT纯代码设计UI界面Demo相关推荐

最新文章

热门文章