Qt5.9.1 簡單字體設計(代碼化UI設計)

  UI 的可視化設計是對用戶而言的,其實底層都是 C++ 的代碼實現,只是 Qt 巧妙地進行了處理,讓用戶省去了很多繁瑣的界面設計工作。本節介紹一個用純代碼方式設計 UI 的實例,通過實例瞭解用純代碼設計 UI 的基本原理。與前面的可視化 UI 設計相對應,且稱之爲代碼化 UI 設計。

運行結果圖:

步驟如下:
第一步:
首先建立一個 Widget Appliation 項目 samp2_3,在創建項目嚮導中選擇基類時,選擇基類 QDialog,新類的名稱命名爲 QWDlgManual,關鍵是取消創建窗體,即不勾選“Generate form”(創建界面)複選框。創建後的項目文件目錄樹下沒有 qwdlgmanual.ui 文件。

第二步:
代碼如下:
 qwdlgmanual.h文件

#ifndef QWDLGMANUAL_H
#define QWDLGMANUAL_H

#include <QDialog>
#include<QCheckBox>
#include<QRadioButton>
#include<QPushButton>
#include<QPlainTextEdit>
#include<QHBoxLayout>

class QWDlgManual : public QDialog
{
    Q_OBJECT
private:
    QCheckBox *chkBoxUnder;
    QCheckBox *chkBoxItalic;
    QCheckBox *chkBoxBold;

    QRadioButton *rBtnBlack;
    QRadioButton *rBtnRed;
    QRadioButton *rBtnBlue;

    QPlainTextEdit *txtEdit;

    QPushButton *btnOK;
    QPushButton *btnCancel;
    QPushButton *btnClose;
    void iniUI();  //UI創建與初始化
    void iniSignalSlots();//初始化信號與槽的連接
  private slots:
    void on_chkBoxUnder(bool checked); //Underline的槽函數
    void on_chkBoxItalic(bool checked); //Italic的槽函數
    void on_chkBoxBold(bool checked); //Bold的槽函數
    void setTextFontColor(); //設置字體顏色

public:
    QWDlgManual(QWidget *parent = 0);
    ~QWDlgManual();
};

#endif // QWDLGMANUAL_H

 

 在 QWDlgManual 類的 private 部分,聲明瞭界面上的各個組件的指針變量,這些界面組件都需要在 QWDlgManual 類的構造函數裏創建並在窗體上佈局。

在 private 部分自定義了兩個函數,iniUI() 用來創建所有界面組件,並完成佈局和屬性設置,iniSignalSlots() 用來完成所有的信號與槽函數的關聯。

在 private slots 部分聲明瞭 4 個槽函數,分別是 3 個 CheckBox 的響應槽函數,以及 3 個顏色設置的 RadioButton 的共同響應槽函數。

 qwdlgmanual.cpp文件

#include "qwdlgmanual.h"
#include    <QHBoxLayout>
#include    <QVBoxLayout>

QWDlgManual::QWDlgManual(QWidget *parent)
    : QDialog(parent)
{
    iniUI();//界面創建與佈局
   iniSignalSlots(); //界面與槽的關聯
   setWindowTitle("Form created mannually");
}

QWDlgManual::~QWDlgManual()
{

}

void QWDlgManual::on_chkBoxUnder(bool checked)
{
    QFont font=txtEdit->font();
    font.setUnderline(checked);
    txtEdit->setFont(font);
}

void QWDlgManual::on_chkBoxItalic(bool checked)
{
    QFont font=txtEdit->font();
    font.setItalic(checked);
    txtEdit->setFont(font);
}

void QWDlgManual::on_chkBoxBold(bool checked)
{
    QFont font=txtEdit->font();
    font.setBold(checked);
    txtEdit->setFont(font);
}

void QWDlgManual::iniUI()
{
    //創建Underline,Italic,Bold3個checkBox,並水平佈局
    chkBoxUnder=new QCheckBox(tr("Underline"));
    chkBoxItalic=new QCheckBox(tr("Italic"));
    chkBoxBold=new QCheckBox(tr("Bold"));

    QHBoxLayout *HLay1=new QHBoxLayout;
    HLay1->addWidget(chkBoxUnder);
    HLay1->addWidget(chkBoxItalic);
    HLay1->addWidget(chkBoxBold);

    //創建Black,Red,Blue3個RadioButton,並水平佈局
    rBtnBlack=new QRadioButton(tr("Black"));
    rBtnBlack->setChecked(true);
    rBtnRed=new QRadioButton(tr("Red"));
    rBtnBlue=new QRadioButton(tr("Blue"));

    QHBoxLayout *HLay2=new QHBoxLayout;
    HLay2->addWidget(rBtnBlack);
    HLay2->addWidget(rBtnRed);
    HLay2->addWidget(rBtnBlue);
    //創建 確定,取消,退出3個PushButton,並水平佈局
    btnOK=new QPushButton(tr("確定"));
    btnCancel=new QPushButton(tr("取消"));
    btnClose=new QPushButton(tr("退出"));
    QHBoxLayout *HLay3=new QHBoxLayout;
    HLay3->addStretch();
    HLay3->addWidget(btnOK);
    HLay3->addWidget(btnCancel);
    HLay3->addStretch();
    HLay3->addWidget(btnClose);
    //創建 文本框,並設置初始字體
    txtEdit=new QPlainTextEdit;
    txtEdit->setPlainText("Hello world\n\nIt is my demo.");
    QFont font=txtEdit->font(); //獲取字體
    font.setPointSize(20);//修改字體大小
    txtEdit->setFont(font);//設置字體
    //創建 垂直佈局,並設置爲主佈局
    QVBoxLayout *VLay=new QVBoxLayout;
    VLay->addLayout(HLay1);//添加字體類型組
    VLay->addLayout(HLay2);//添加字體顏色組
    VLay->addWidget(txtEdit);//添加PlainTextEdit
    VLay->addLayout(HLay3);//添加按鍵組
    setLayout(VLay);//設置爲窗體的主佈局
}

void QWDlgManual::iniSignalSlots()
{
    //三個顏色 QRadioButton的clicked()信號與setTextFontColor()槽函數關聯
    connect(rBtnBlue,SIGNAL(clicked()),this,SLOT(setTextFontColor()));
            connect(rBtnRed,SIGNAL(clicked()),this,SLOT(setTextFontColor()));
            connect(rBtnBlack,SIGNAL(clicked()),this,SLOT(setTextFontColor()));
     //三個字體設置的 QCheckBox的clicked(bool)信號與相應的槽函數相聯
            connect(chkBoxUnder,SIGNAL(clicked(bool)),this,SLOT(on_chkBoxUnder(bool)));
            connect(chkBoxItalic,SIGNAL(clicked(bool)),this,SLOT(on_chkBoxItalic(bool)));
            connect(chkBoxBold,SIGNAL(clicked(bool)),this,SLOT(on_chkBoxBold(bool)));
            //三個按鈕的信號與窗體的槽函數關聯
            connect(btnOK,SIGNAL(clicked()),this,SLOT(accept()));
            connect(btnCancel,SIGNAL(clicked()),this,SLOT(reject()));
            connect(btnClose,SIGNAL(clicked()),this,SLOT(close()));
}

void QWDlgManual::setTextFontColor()
{
    QPalette plet=txtEdit->palette();
    if(rBtnBlue->isChecked())
        plet.setColor(QPalette::Text,Qt::blue);
    else if(rBtnRed->isChecked())
        plet.setColor(QPalette::Text,Qt::red);
    else if(rBtnBlack->isChecked())
        plet.setColor(QPalette::Text,Qt::black);
    else
        plet.setColor(QPalette::Text,Qt::black);
    txtEdit->setPalette(plet);

}

設計完成後,編譯並運行程序。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章