QT6（代码化UI设计）

QT

代码化UI设计

既然已经有可视化的UI设计页面了，那么为什么还要学代码化的UI设计呢？

答案是代码化的UI设计会更灵活，在有些可视化UI设计无法实现的场景使用代码化就可以实现

创建一个新项目

这里创建时就不要勾选Generate from了

布局代码编写

cpp 复制代码

// 在Dialog.h
#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>

class QCheckBox;
class QRadioButton;
class QPushButton;
class QPlainTextEdit;

class Dialog : public QDialog
{

    Q_OBJECT

private:
    
    // 在Dialog.h 中声名需要组件的指针对象
    QCheckBox* chkBoxUnder;
    QCheckBox* chkBoxItalic;
    QCheckBox* chkBoxBold;

    QRadioButton* radioBlack;
    QRadioButton* radioRed;
    QRadioButton* radioBlue;

    QPlainTextEdit* textEdit;

    QPushButton* btnOK;
    QPushButton* btnCancel;
    QPushButton* btnClose;
public:
    Dialog(QWidget *parent = nullptr);
    ~Dialog();

};
#endif // DIALOG_H

cpp 复制代码

// dialog.cpp
#include "dialog.h"

// 布局相关
#include <QHBoxLayout>
#include <QVBoxLayout>
// 需要什么控件在这里就需要我们自己来添加了
#include <QCheckBox>
#include <QRadioButton>
#include <QPlainTextEdit>
#include <QPushButton>
Dialog::Dialog(QWidget *parent)
    : QDialog(parent)
{

    // 申请复选框组件对象
    chkBoxUnder = new QCheckBox("下划线");
    chkBoxBold = new QCheckBox("加粗");
    chkBoxItalic = new QCheckBox("斜体");

    // 申请水平布局对象
    QHBoxLayout* HLayl = new QHBoxLayout();
    HLayl->addWidget(chkBoxUnder);
    HLayl->addWidget(chkBoxBold);
    HLayl->addWidget(chkBoxItalic);

    // 申请单选框组件对象
    radioBlack = new QRadioButton("黑色");
    radioBlue = new QRadioButton("蓝色");
    radioRed = new QRadioButton("红色");

    // 申请水平布局对象
    QHBoxLayout* HLay2 = new QHBoxLayout();
    HLay2->addWidget(radioBlack);
    HLay2->addWidget(radioBlue);
    HLay2->addWidget(radioRed);

    // 申请垂直布局对象
    QVBoxLayout* Vlay = new QVBoxLayout();


    // 申请编辑框对象
    textEdit = new QPlainTextEdit;
    //设置编辑框文本
    textEdit->setPlainText("Hello World QT6 \n");
    // 获取编辑框字体对象
    QFont font = textEdit->font();
    // 设置字体大小
    font.setPixelSize(20);
    // 设置字体
    textEdit->setFont(font);

    // 申请按钮对象
    btnOK = new QPushButton("确定");
    btnCancel = new QPushButton("取消");
    btnClose = new QPushButton("退出");
    // 申请水平布局对象
    QHBoxLayout* HLay3 = new QHBoxLayout();
    HLay3->addWidget(btnOK);
    HLay3->addWidget(btnCancel);
    HLay3->addWidget(btnClose);

    Vlay->addLayout(HLayl);
    Vlay->addLayout(HLay2);
    Vlay->addWidget(textEdit);
    Vlay->addLayout(HLay3);


    setLayout(Vlay);


}

Dialog::~Dialog() {}

界面展示
接下来用代码实现对应的功能

代码UI设计信号槽连接

功能代码编写

cpp 复制代码

// 声名信号与槽绑定的方法
private slots:

    void do_chkBoxUnder(bool checked);
    void do_chkBoxItalic(bool checked);
    void do_chkBoxBold(bool checked);

    void do_setFontColr();

cpp 复制代码

...
void Dialog::do_chkBoxUnder(bool checked)
{
    // 获取编辑框字体对象
    QFont font = textEdit->font();
    // 设置字体
    font.setUnderline(checked);
    textEdit->setFont(font);
}

void Dialog::do_chkBoxItalic(bool checked)
{
    // 获取编辑框字体对象
    QFont font = textEdit->font();
    // 设置字体
    font.setItalic(checked);
    textEdit->setFont(font);
}

void Dialog::do_chkBoxBold(bool checked)
{
    // 获取编辑框字体对象
    QFont font = textEdit->font();
    // 设置字体
    font.setBold(checked);
    textEdit->setFont(font);
}

void Dialog::do_setFontColr()
{
    QPalette plet = textEdit->palette();

    if(radioBlack->isChecked())
        plet.setColor(QPalette::Text,Qt::black);

    if(radioBlue->isChecked())
        plet.setColor(QPalette::Text,Qt::blue);

    if(radioRed->isChecked())
        plet.setColor(QPalette::Text,Qt::red);

    textEdit->setPalette(plet);
}
...
    // 信号与槽进行绑定（当前使用宏的方式，推荐使用指针）
    connect(chkBoxUnder,SIGNAL(clicked(bool)),this,SLOT(do_chkBoxUnder(bool)));
    connect(chkBoxBold,SIGNAL(clicked(bool)),this,SLOT(do_chkBoxBold(bool)));
    connect(chkBoxItalic,SIGNAL(clicked(bool)),this,SLOT(do_chkBoxItalic(bool)));


    connect(radioBlack,SIGNAL(clicked(bool)),this,SLOT(do_setFontColr()));
    connect(radioBlue,SIGNAL(clicked(bool)),this,SLOT(do_setFontColr()));
    connect(radioRed,SIGNAL(clicked(bool)),this,SLOT(do_setFontColr()));

    connect(btnOK,SIGNAL(clicked()),this,SLOT(accept()));
    connect(btnCancel,SIGNAL(clicked()),this,SLOT(reject()));
    connect(btnClose,SIGNAL(clicked()),this,SLOT(close()));