Qt-- dialog and type, layout manager

A. Dialog box and type

1 is a simple dialog window, the user interacts top
2.QDialog Qt is the base class for all dialog windows
3.QDialog QWidget inherited class is a container assembly

A.QDialog meaning
1.QDialog as a dedicated interactive window exists
2.QDialog other containers can not be embedded as sub-components
3.QDialog window style is customized special QWidget

a. modal dialog (QDialog :: exec ())
1. Display can not interact in the parent window
2 is a blocking dialog is called
b. Non-modal dialog (QDialog :: show () )
independently of the presence of the parent can simultaneously interact with the display window 1.
2. is a non-blocking dialog is called
, in general, a modal dialog box where the user must rely selected (message prompts, the file selection , print settings, etc.), non-modal dialog boxes for special occasions function settings (lookup operation, property settings, etc.)
Note: Creating a modal dialog on the stack is the easiest way to common, non-modal dialogue under normal circumstances box needs created in the heap, the function creates QDialog :: setModel mixing properties dialog modeless dialog box to specify properties Qt :: WA_DeleteOnClose
B. dialog return value
1. only modal dialog only return When the conceptual value of
the return value of 2. modal dialog for indicating interaction result
3.QDialog :: exec () return value interaction result -void QDialog :: done (int i) close the dialog box as a result of the interaction parameter and success, QDialog :: Accepted-- user operation Failure QDialog :: Rejected-- user operation
code sample

Dialog.h
#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>
#include <QPushButton>

class Dialog : public QDialog
{
    Q_OBJECT
protected:
    QPushButton ModalBtn;
    QPushButton NormalBtn;
    QPushButton MixedBtn;
protected slots:
    void ModalBtn_Clicked();
    void NormalBtn_Clicked();
    void MixedBtn_Clicked();
public:
    Dialog(QWidget *parent = 0);
    ~Dialog();
};

#endif // DIALOG_H

Dialog.cpp
#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>
#include <QPushButton>

class Dialog : public QDialog
{
    Q_OBJECT
protected:
    QPushButton ModalBtn;
    QPushButton NormalBtn;
    QPushButton MixedBtn;
protected slots:
    void ModalBtn_Clicked();
    void NormalBtn_Clicked();
    void MixedBtn_Clicked();
public:
    Dialog(QWidget *parent = 0);
    ~Dialog();
};

#endif // DIALOG_H

mian.cpp
#include "Dialog.h"
#include <QApplication>
#include <QDebug>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Dialog dlg;
    int r = dlg.exec();

    return r;
}

Operating results

Actual results generated button they can run to compare

Two .Qt the standard dialog

Qt provides some reusable box type developers
Qt dialog provides all reusable class inherits from QDialog

standard dialog in Qt follows the same usage

A. message box
1. Application message box is the most common program interface elements
2. the message box is mainly used for - prompt the user for important messages, forcing the user to select the operation
use message box B.

C. file dialog
needs 1.Open Mode-- application open an external file
2.Save Mode-- applications requires the current content stored in the external file specified by the user
using the file dialog mode

code sample

Widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>

class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton SimpleMsgBtn;
    QPushButton CustomMsgBtn;
    QPushButton OpenFileBtn;
    QPushButton SaveFileBtn;
private slots:
    void Simple_clicked();
    void Custom_clicked();
    void Open_clicked();
    void Save_clicked();
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

Widget.cpp
#include "Widget.h"
#include <QMessageBox>
#include <QDebug>
#include <QFileDialog>

Widget::Widget(QWidget *parent)
    : QWidget(parent),SimpleMsgBtn(this),CustomMsgBtn(this),OpenFileBtn(this),SaveFileBtn(this)
{
    SimpleMsgBtn.setText("Simple Message Dialog");
    SimpleMsgBtn.move(20,20);
    SimpleMsgBtn.resize(160,30);

    CustomMsgBtn.setText("Custom Message Dialog");
    CustomMsgBtn.move(20,70);
    CustomMsgBtn.resize(160,30);//表示大小

    OpenFileBtn.setText("Open Message Dialog");
    OpenFileBtn.move(20,120);
    OpenFileBtn.resize(160,30);

    SaveFileBtn.setText("Save Message Dialog");
    SaveFileBtn.move(20,170);
    SaveFileBtn.resize(160,30);

    resize(200,220);
    setFixedSize(200,220);

    connect(&SimpleMsgBtn,SIGNAL(clicked()),this,SLOT(Simple_clicked()));
    connect(&CustomMsgBtn,SIGNAL(clicked()),this,SLOT(Custom_clicked()));
    connect(&OpenFileBtn,SIGNAL(clicked()),this,SLOT(Open_clicked()));
    connect(&SaveFileBtn,SIGNAL(clicked()),this,SLOT(Save_clicked()));

}

Widget::~Widget()
{

}

void Widget::Simple_clicked()
{
    QMessageBox msg(this);
    msg.setText("mylove");
    msg.exec();
}

void Widget::Custom_clicked()
{
    QMessageBox msg(this);
    msg.setWindowTitle("mylove");
    msg.setText("this is a message dialog");
    msg.setIcon(QMessageBox::Information);
    msg.setStandardButtons(QMessageBox::Ok|QMessageBox::Cancel|QMessageBox::Save);

    if(msg.exec()==QMessageBox::Ok)
    {
        qDebug()<<"OK button is clicked";
    }
}

void Widget::Open_clicked()
{
    QFileDialog dlg(this);
    //可以在帮助文档QMessageBox下找到setAcceptMode与setFileMode的用法
    dlg.setAcceptMode(QFileDialog::AcceptOpen);
    dlg.setFilter(QDir::AllDirs);//setFilter的用法看帮助文档
    dlg.setFileMode(QFileDialog::ExistingFiles);//打开多个存在的文件

    if(dlg.exec()==QFileDialog::Accept)
    {
        QStringList fs=dlg.selectedFiles();
        //for循环将所选择的文件路径打印出来
        for(int i=0;i<fs.count();i++)
        {
            qDebug()<<fs[i];
        }
    }
}

void Widget::Save_clicked()
{
    QFileDialog dlg(this);
    //可以在QMessageBox下找到setAcceptMode的用法
    dlg.setAcceptMode(QFileDialog::AcceptSave);

    if(dlg.exec()==QFileDialog::Accept)
    {
        QStringList fs=dlg.selectedFiles();
        //for循环将所选择的文件路径打印出来
        for(int i=0;i<fs.count();i++)
        {
            qDebug()<<fs[i];
        }
    }
}

mian.cpp
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

Results and operation functions implemented

D. Color dialog
Qt provides predefined color box QColorDialog class
QColorDialog class for providing a box member designated color

using the color mode dialog

1.Qt the class is used in the program QColor indicates the color concept
2.QColor class also supports multiple color representations --RGB: RGB reference to the three-color mode; HSV: hue, saturation, lightness, hexagonal pyramid model as a reference; CMYK: with sky blue, magenta, black for the full-color printing color model reference
input dialog E.
Qt provides predefined input dialog QInputDialog class
occasion QInputDialog class for temporary needs for data entry

input dialog box, use

the input dialogue input pattern frame

code implementation

Widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>

class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton color;
    QPushButton input;
private slots:
    void color_clicked();
    void input_clicked();
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

main.cpp
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

Widget.cpp
#include "Widget.h"
#include <QColorDialog>
#include <QDebug>
#include <QInputDialog>

Widget::Widget(QWidget *parent)
    : QWidget(parent),color(this),input(this)
{
    color.setText("Color Dialog");
    color.resize(100,20);
    color.move(20,20);

    input.setText("Input Dialog");
    input.resize(100,20);
    input.move(20,60);

    resize(150,100);
    setFixedSize(150,100);

    connect(&color,SIGNAL(clicked()),this,SLOT(color_clicked()));
    connect(&input,SIGNAL(clicked()),this,SLOT(input_clicked()));
}

void Widget::color_clicked()
{
    QColorDialog dlg(this);

    dlg.setWindowTitle("Color Edit");
    dlg.setCurrentColor(Qt::red);

    if(dlg.exec()==QColorDialog::Accepted)
    {
        qDebug()<<dlg.selectedColor();
    }
}

void Widget::input_clicked()
{
    QInputDialog dlg(this);

    dlg.setWindowTitle("Input...");
    dlg.setLabelText("Please enter an interger:");
    dlg.setInputMode(QInputDialog::IntInput);
    dlg.setIntMinimum(0);
    dlg.setIntMaximum(255);

    if(dlg.exec()==QInputDialog::Accepted)
    {
        qDebug()<<dlg.intValue();
    }
}

Widget::~Widget()
{

}

运行的结果如图

F.字体对话框
Qt中提供了预定义的字体对话框QFontDialog类
QFontDialog类用于提供选择字体的对话框部件

字体对话框的使用方式

G.进度对话框
Qt提供了预定义的进度对话框QProgressDialog类
QProgressDialog类用于显示进度信息
QProgressDialog类用于需要用户等待的场合

进度对话框的使用方式

H.打印对话框
Qt中提供了预定义的打印对话框QPrintDialog类
QPrintDialog类用于设置打印相关的参数信息

打印对话框的使用方式

Qt中的QPrinter类是打印设备及其参数的封装
QPrinter类封装了系统中打印设备的驱动接口
QPrinter以相同方式使用系统中的不同打印设备
代码示例

Widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>

class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton FontDialogBtn;
    QPushButton ProgressDialogBtn;
    QPushButton PrintDialogBtn;
private slots:
    void FontDialogBtn_Clicked();
    void PrintDialogBtn_Clicked();
    void ProgressDialogBtn_Clicked();
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

Widget.cpp
#include "Widget.h"
#include <QDebug>
#include <QtPrintSupport/QPrinter>
#include <QPrintDialog>
#include <QTextDocument>
#include <QProgressDialog>
#include <QFontDialog>

Widget::Widget(QWidget *parent) : QWidget(parent),
    FontDialogBtn(this), ProgressDialogBtn(this), PrintDialogBtn(this)
{
    FontDialogBtn.setText("Font Dialog");
    FontDialogBtn.move(20, 20);
    FontDialogBtn.resize(160, 30);

    ProgressDialogBtn.setText("Progress Dialog");
    ProgressDialogBtn.move(20, 70);
    ProgressDialogBtn.resize(160, 30);

    PrintDialogBtn.setText("Print Dialog");
    PrintDialogBtn.move(20, 120);
    PrintDialogBtn.resize(160, 30);

    resize(200, 170);
    setFixedSize(200, 170);

    connect(&FontDialogBtn, SIGNAL(clicked()), this, SLOT(FontDialogBtn_Clicked()));
    connect(&ProgressDialogBtn, SIGNAL(clicked()), this, SLOT(ProgressDialogBtn_Clicked()));
    connect(&PrintDialogBtn, SIGNAL(clicked()), this, SLOT(PrintDialogBtn_Clicked()));
}

void Widget::FontDialogBtn_Clicked()
{
    QFontDialog dlg(this);

    dlg.setWindowTitle("Font Dialog Test");
    dlg.setCurrentFont(QFont("Courier New", 10, QFont::Bold));

    if( dlg.exec() == QFontDialog::Accepted )
    {
        qDebug() << dlg.selectedFont();
    }
}

void Widget::ProgressDialogBtn_Clicked()
{
    QProgressDialog dlg(this);

    dlg.setWindowTitle("Updating...");
    dlg.setLabelText("Downloading update from server...");
    dlg.setMinimum(0);
    dlg.setMaximum(100);
    dlg.setValue(35);

    // create a new thread

    dlg.exec();
}

void Widget::PrintDialogBtn_Clicked()
{
    QPrintDialog dlg(this);

    dlg.setWindowTitle("Print Dialog Test");

    if( dlg.exec() == QPrintDialog::Accepted )
    {
        QPrinter* p = dlg.printer();
        QTextDocument td;

        //td.setPlainText("Printer object test!");
        td.setHtml("<h1>Print html object test</hl>");

        p->setOutputFileName("D:\\test.xps");

        td.print(p);
    }
}

Widget::~Widget()
{

}

main.cpp
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

运行结果如图

三.Qt布局管理器

目前的GUI开发方式：绝对定位--直接在像素级指定各个组件的位置和大小void QWidget::move(int x,int y) void QWidget::resize(int w,int h)
存在的问题就是--组件的位置和大小无法自适应父窗口的变化
对此的解决方案--布局管理器：提供相关的类对界面组件进行布局管理，能够自动排列窗口中的界面组件，窗口变化后自动更新界面组件的大小
A.布局管理器
QLayout是Qt中布局管理器的抽象基类，提供继承QLayout实现了功能各异且互补的布局管理器，Qt中可以根据需要自定义布局管理器，布局管理器不是界面部件，而是界面部件的定位策略

B.QBoxLayout布局管理器--以水平或者垂直的方式管理界面组件

布局管理器可以相互嵌套，形成更加复杂的布局方式--布局嵌套几乎可以完成所有常用的界面布局，自定义布局类可以达到个性化界面布局的效果
代码示例

Wiidget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>

class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton TestBtn1;
    QPushButton TestBtn2;
    QPushButton TestBtn3;
    QPushButton TestBtn4;

    void testVBoxLayout();
    void testHBoxLayout();
    void testVHBoxLayout();
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

Widget.cpp
#include "Widget.h"
#include <QVBoxLayout>

Widget::Widget(QWidget *parent) : QWidget(parent),
    TestBtn1(this), TestBtn2(this), TestBtn3(this), TestBtn4(this)
{

    //testVBoxLayout();
    //testHBoxLayout();
    testVHBoxLayout();
}
//实现水平与垂直随着应用窗口的变化而变化
void Widget::testVHBoxLayout()
{
    QHBoxLayout* hLayout1 = new QHBoxLayout();
    QHBoxLayout* hLayout2 = new QHBoxLayout();
    QVBoxLayout* vLayout = new QVBoxLayout();

    TestBtn1.setText("Test Button 1");
    TestBtn1.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn1.setMinimumSize(160, 30);

    TestBtn2.setText("Test Button 2");
    TestBtn2.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn2.setMinimumSize(160, 30);

    hLayout1->setSpacing(10);
    hLayout1->addWidget(&TestBtn1);
    hLayout1->addWidget(&TestBtn2);

    TestBtn3.setText("Test Button 3");
    TestBtn3.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn3.setMinimumSize(160, 30);

    TestBtn4.setText("Test Button 4");
    TestBtn4.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn4.setMinimumSize(160, 30);

    hLayout2->setSpacing(10);//设置的间隔
    hLayout2->addWidget(&TestBtn3);
    hLayout2->addWidget(&TestBtn4);

    vLayout->setSpacing(10);
    vLayout->addLayout(hLayout1);
    vLayout->addLayout(hLayout2);

    setLayout(vLayout);
}
/*
void Widget::testHBoxLayout()
{
    QHBoxLayout* layout = new QHBoxLayout();

    TestBtn1.setText("Test Button 1");
    TestBtn1.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn1.setMinimumSize(160, 30);

    TestBtn2.setText("Test Button 2");
    TestBtn2.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn2.setMinimumSize(160, 30);

    TestBtn3.setText("Test Button 3");
    TestBtn3.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn3.setMinimumSize(160, 30);

    TestBtn4.setText("Test Button 4");
    TestBtn4.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn4.setMinimumSize(160, 30);

    layout->setSpacing(30);
    layout->addWidget(&TestBtn1);
    layout->addWidget(&TestBtn2);
    layout->addWidget(&TestBtn3);
    layout->addWidget(&TestBtn4);

    setLayout(layout);
}

void Widget::testVBoxLayout()
{
    QVBoxLayout* layout = new QVBoxLayout();

    TestBtn1.setText("Test Button 1");
    TestBtn1.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn1.setMinimumSize(160, 30);

    TestBtn2.setText("Test Button 2");
    TestBtn2.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn2.setMinimumSize(160, 30);

    TestBtn3.setText("Test Button 3");
    TestBtn3.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn3.setMinimumSize(160, 30);

    TestBtn4.setText("Test Button 4");
    TestBtn4.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn4.setMinimumSize(160, 30);

    layout->setSpacing(30);
    layout->addWidget(&TestBtn1);
    layout->addWidget(&TestBtn2);
    layout->addWidget(&TestBtn3);
    layout->addWidget(&TestBtn4);

    setLayout(layout);
}

*/
Widget::~Widget()
{

}

main.cpp
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

运行的结果如图所示

C.布局管理器的比例系数
默认情况下以等比例更新组件的大小
可以自定义组件大小更新时的比例系数
QBoxLayout中的比例系数设置

D.QGridLayout布局管理器-以网格的方式管理界面组件

QGridLayout中的比例系数设置

布局管理器的嵌套-QGridLayout支持嵌套其它布局管理器成为其管理对象

代码示例

Widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>

class Widget : public QWidget
{
    Q_OBJECT
    QPushButton testbtn1;
    QPushButton testbtn2;
    QPushButton testbtn3;
    QPushButton testbtn4;

    void testQGridlayout();

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

#endif // WIDGET_H

Widget.cpp
#include <QGridLayout>

Widget::Widget(QWidget *parent)
    : QWidget(parent),testbtn1(this),testbtn2(this),testbtn3(this),testbtn4(this)
{
    testQGridlayout();
}

Widget::~Widget()
{

}

void Widget::testQGridlayout()
{
    QGridLayout *layout=new QGridLayout();

    testbtn1.setText("btn 1");
    testbtn1.setMinimumSize(160,30);
    testbtn1.setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);

    testbtn2.setText("btn 2");
    testbtn2.setMinimumSize(160,30);
    testbtn2.setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);

    testbtn3.setText("btn 3");
    testbtn3.setMinimumSize(160,30);
    testbtn3.setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);

    testbtn4.setText("btn 4");
    testbtn4.setMinimumSize(160,30);
    testbtn4.setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);

    layout->setSpacing(10);
    //QGridLayout设置行列的效果
    layout->addWidget(&testbtn1,0,0);
    layout->addWidget(&testbtn2,0,1);
    layout->addWidget(&testbtn3,1,0);
    layout->addWidget(&testbtn4,1,1);
    //设置比例因子Row为行  stretch为因子
    layout->setRowStretch(0,1);
    layout->setRowStretch(1,3);

    setLayout(layout);
}

main.cpp
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

The results shown in FIG running


E. stack layout manager
1. All components perpendicular to the direction of the screen is managed
2. Only one assembly will be displayed on the screen
3. Only the topmost assembly is finally displayed

Stacker characteristics layout manager
1. the assembly of the same size and full assembly display region
2. the other can not directly be nested layout manager
3 can freely switch component needs to display
4, and each can display only a component
usage summary of QStackedLayout

Code

Widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>
#include <QLabel>
#include <QLineEdit>
#include <QStackedLayout>

class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton prebtn;//设置的按钮
    QPushButton nextbtn;
    //测试的函数
    void intControl();

    QLabel l1;
    QLabel l2;
    QLabel l3;
    QLabel l4;
    QLineEdit sLineEdit;
    QPushButton tPushBtn1;
    QPushButton tPushBtn2;
    QStackedLayout slayout;
//槽函数的构造
private slots:
    void onPreBtnClicked();
    void onNextBtnClicked();
    //三个QStackedLayout布局的页面
    QWidget* get1stPage();
    QWidget* get2ndPage();
    QWidget* get3rdPage();

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

#endif // WIDGET_H

Widget.cpp
#include "Widget.h"
#include <QVBoxLayout>
#include <QHBoxLayout>
#include <QStackedLayout>
#include <QFormLayout>
#include <QGridLayout>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
{
    //构造函数中对intControl()进行调用
    intControl();
}

void Widget::intControl()
{
    QVBoxLayout* vlayout=new QVBoxLayout();
    QHBoxLayout* hlayout=new QHBoxLayout();

    prebtn.setText("Prebtn");
    prebtn.setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Fixed);
    prebtn.setMinimumSize(160,30);

    nextbtn.setText("Nextbtn");
    nextbtn.setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Fixed);
    nextbtn.setMinimumSize(160,30);

    connect(&prebtn,SIGNAL(clicked()),this,SLOT(onPreBtnClicked()));
    connect(&nextbtn,SIGNAL(clicked()),this,SLOT(onNextBtnClicked()));

    slayout.addWidget(get1stPage());
    slayout.addWidget(get2ndPage());
    slayout.addWidget(get3rdPage());
    //水平布局的两个按钮
    hlayout->addWidget(&prebtn);
    hlayout->addWidget(&nextbtn);
    //在垂直方向上是一个QStackedLayout与QHBoxLayout
    vlayout->addLayout(&slayout);
    vlayout->addLayout(hlayout);
    //对应的槽函数的实现

    setLayout(vlayout);
}

QWidget* Widget::get1stPage()
{
    QWidget* ret=new QWidget();
    QGridLayout* layout=new QGridLayout();

    l1.setText("this");
    l2.setText("is");
    l3.setText("first");
    l4.setText("page");
    //将四个标签进行行列的排列
    layout->addWidget(&l1,0,0);
    layout->addWidget(&l2,0,1);
    layout->addWidget(&l3,1,0);
    layout->addWidget(&l4,1,1);

    ret->setLayout(layout);

    return ret;
}

QWidget* Widget::get2ndPage()
{//QFormLayout表格布局的实现
    QWidget* ret = new QWidget();
    QFormLayout* layout = new QFormLayout();

    sLineEdit.setText("This is 2rd page");

    layout->addRow("Hint:", &sLineEdit);

    ret->setLayout(layout);

    return ret;
}

QWidget* Widget::get3rdPage()
{
    QWidget* ret = new QWidget();
    QVBoxLayout* layout = new QVBoxLayout();

    tPushBtn1.setText("This is");
    tPushBtn2.setText("3rd page");

    layout->addWidget(&tPushBtn1);
    layout->addWidget(&tPushBtn2);

    ret->setLayout(layout);

    return ret;
}

void Widget::onPreBtnClicked()
{
    int index = ((slayout.currentIndex() - 1) + 3) % 3;

    slayout.setCurrentIndex(index);
}

void Widget::onNextBtnClicked()
{//槽函数翻页的实现
    int index = (slayout.currentIndex() + 1) % 3;

    slayout.setCurrentIndex(index);
}

Widget::~Widget()
{

}

main.cpp
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

Operating results shown in FIG.