Qt5布局管理项目示例

项目1 分割窗口QSplitter类

介绍一个十分简单的分割窗口功能，整个对话框由三个窗口组成，各个窗口之间的大小可随意拖曳改变

停靠窗口QDockWidget类也是应用程序中经常用到的，设置停靠窗口的一般流程如下。

main.cpp

#include "mainwindow.h"

#include <QApplication>

#include <QSplitter>

#include <QTextEdit>

int main(int argc, char *argv[])

{

    QApplication a(argc, argv);

    //指定显示字体

    QFont font("ZYSong18030", 12);

    a.setFont(font);

    //主分割窗口(作为主分割窗口，设定次分割窗口为水平分割窗口)

    QSplitter *splitterMain = new QSplitter(Qt::Horizontal, 0);

    //新建一个QTextEdit对象，并将其插入主分割窗口中

    QTextEdit *textLeft = new QTextEdit(QObject::tr ("Left Widget"), splitterMain);

    //设置TextEdit的对其方式

    textLeft->setAlignment (Qt::AlignHCenter);

    //右部分分割(以主分割窗口为父窗口)

    QSplitter *splitterRight = new QSplitter(Qt::Vertical, splitterMain);

    //设定主分割窗口的分割条在拖曳时是否为实时更新显示。

    splitterRight->setOpaqueResize (false);

    QTextEdit *textUp = new QTextEdit(QObject::tr("Top Widget"), splitterRight);

    textUp->setAlignment (Qt::AlignHCenter);

    QTextEdit *textBotton = new QTextEdit(QObject::tr("Botton Widget"), splitterRight);

    textBotton->setAlignment (Qt::AlignHCenter);

    /*设定可伸缩控件，它的第一个参数用于指定设置的控件序号，控件序号插入的先后次序从0起一次编号；

     *第2个参数为大于0的值，表示此控件为可伸缩控件*/

    splitterMain->setStretchFactor (1, 1);

    //设置窗口的标签

    splitterMain->setWindowTitle (QObject::tr ("Splitter"));

    splitterMain->show ();

    return a.exec();

}

项目2 停靠窗口QDockWidget类

（1）创建一个QDockWidget对象的停靠窗体。

（2）设置此停靠窗体的属性，通常调用setFeatures()及setAllowedAreas()两种方法。

（3）新建一个要插入停靠窗体的控件，常用的有QListWidget和QTextEdit。

（4）将控件插入停靠窗体，调用QDockWidget的setWidget()方法。

（5）使用addDockWidget()方法在MainWindow中加入此停靠窗体。

dockwindows.cpp

#include "dockwindows.h"

#include <QTextEdit>

#include <QDockWidget>

DockWindows::DockWindows(QWidget *parent)

    : QMainWindow(parent)

{

    setWindowTitle (QObject::tr ("DockWindows"));   //设置主窗口标题栏文字

    QTextEdit *te = new QTextEdit(this);            //定义一个QTextEdit对象作为主窗口

    te->setText (tr("Mian Window"));

    te->setAlignment (Qt::AlignHCenter);

    setCentralWidget (te);                          //将此编辑框设为主窗口的中央窗体

    //停靠窗口1

    QDockWidget *dock = new QDockWidget(tr("DockWindow1"), this);

    //设置窗体可停靠的特性

    dock->setFeatures (QDockWidget::DockWidgetMovable);     //可移动

    //设置窗体可停靠的区域

    dock->setAllowedAreas (Qt::LeftDockWidgetArea | Qt::RightDockWidgetArea);

    QTextEdit * te1 = new QTextEdit();

    te1->setText (tr("window1, The dock widget can be moved between docks by the user"));

    //将控件插入停靠窗体

    dock->setWidget (te1);

    //在dock中加入停靠窗体

    addDockWidget (Qt::RightDockWidgetArea, dock);

    //停靠窗口2

    dock = new QDockWidget(tr("DockWindow2"), this);

    //设置窗体可停靠的特性

    dock->setFeatures (QDockWidget::DockWidgetClosable | QDockWidget::DockWidgetFloatable);    //可关闭、可浮动

    QTextEdit *te2 = new QTextEdit();

    te2->setText (tr("window2, The dock widget can be detached from the main window, "" and floated as an "

                     "independent window, and can be closed"));

    //将控件插入停靠窗体

    dock->setWidget (te2);

    //在dock中加入停靠窗体

    addDockWidget (Qt::RightDockWidgetArea, dock);

    //停靠窗口3

    dock = new QDockWidget(tr("DockWindow3"), this);

    //设置窗体可停靠的特性

    dock->setFeatures (QDockWidget::AllDockWidgetFeatures); //全部特性

    QTextEdit *te3 = new QTextEdit();

    te3->setText (tr("Window3, The dock widget can be closed, moved, and floated"));

    //将控件插入停靠窗体

    dock->setWidget (te3);

    //在dock中加入停靠窗体

    addDockWidget (Qt::RightDockWidgetArea, dock);

}

DockWindows::~DockWindows()

{

}

项目3 堆栈窗体QStackedWidget类

Stackedlg.h

#ifndef STACKDLG_H

#define STACKDLG_H

#include <QDialog>

#include <QLabel>

#include <QListWidget>

#include <QStackedWidget>

class StackDlg : public QDialog

{

    Q_OBJECT

public:

    StackDlg(QWidget *parent = 0);

    ~StackDlg();

    QListWidget *list;      //定义列表框指针

    QStackedWidget *stack;  //定义窗口栈指针

    QLabel *label1;

    QLabel *label2;

    QLabel *label3;

};

#endif // STACKDLG_H

Stackedlg.cpp

#include "stackdlg.h"

#include <QHBoxLayout>  //水平显示布局

StackDlg::StackDlg(QWidget *parent)

    : QDialog(parent)

{

    setWindowTitle (tr("StackedWidget"));

    //在新建的QListWidget中插入三个条目，作为选择项

    list = new QListWidget(this);

    list->insertItem (0, tr("Window1"));

    list->insertItem (1, tr("Window2"));

    list->insertItem (2, tr("Window3"));

    //创建三个QLabel标签控件对象，作为栈窗口要显示的三层窗体

    label1 = new QLabel(tr("WindowTest1"));

    label2 = new QLabel(tr("WindowTest2"));

    label3 = new QLabel(tr("WindowTest3"));

    //新建一个QStackedWidget堆栈对象

    stack = new QStackedWidget(this);

    //将创建的三个QLabel标签控件依次插入堆栈窗体中

    stack->addWidget (label1);

    stack->addWidget (label2);

    stack->addWidget (label3);

    //对整个对话框进行布局

    QHBoxLayout *mainLayout = new QHBoxLayout(this);

    mainLayout->setMargin (5);  //设置对话框（或窗体）的边距为5

    mainLayout->setSpacing (5); //设定每个空间之间的间距为5

    mainLayout->addWidget (list);

    mainLayout->addWidget (stack, 0, Qt::AlignHCenter);

    //设置可伸缩性第一个参数用于指定设置的控件，第二参数的值大于0则表示此控件可伸缩控件

    mainLayout->setStretchFactor (list, 1);

    mainLayout->setStretchFactor (stack, 3);

    connect (list, SIGNAL(currentRowChanged(int)), stack, SLOT(setCurrentIndex(int)));

}

StackDlg::~StackDlg()

{

}

项目4 基本布局（QLayout）

addWidget()方法用于向布局中加入需要布局的控件，addWidget()的函数原型如下：

void addWidget

(

  QWidget*widget,             //需要插入的控件对象

  int  fromRow,                  //插入的行

  int  fromColumn,             //插入的列

  int  rowSpan,                  //表示占用的行数

  int  columnSpan,             //表示占用的列数

  Qt::Alignment  alignment=0    //描述各个控件的对齐方式

)

addLayout ()方法用于向布局中加入需要布局的子布局，addLayout ()的函数原型如下：

void addLayout

(

  QLayout*layout,                        //表示需要插入的子布局对象

  introw,                                     //插入的起始行

  intcolumn,                                //插入的起始列

  int rowSpan,                            //表示占用的行数

  int columnSpan,                       //表示占用的列数

  Qt::Alignment alignment=0       //指定对齐方式

)

本实例共用到四个布局管理器，分别是LeftLayout、RightLayout、BottomLayout和MainLayout，其布局框架如图所示

dialog.h

#ifndef DIALOG_H

#define DIALOG_H

#include <QDialog>

#include <QLabel>

#include <QLineEdit>

#include <QTextEdit>

#include <QComboBox>

#include <QHBoxLayout>

class Dialog : public QDialog

{

    Q_OBJECT

public:

    explicit Dialog(QWidget *parent = 0);

    ~Dialog();

private:

    //左侧声明的变量

    QLabel *UserNameLabel;

    QLabel *NameLabel;

    QLabel *SexLabel;

    QLabel *DepartmentLabel;

    QLabel *AgeLabel;

    QLabel *OtherLabel;

    QLineEdit *UserNameLineEdit;

    QLineEdit *NameLineEdit;

    QComboBox *SexComboBox;

    QTextEdit *DepartmentTextEdit;

    QLineEdit *AgeLineEdit;

    QGridLayout *LeftLayout;        //设置左侧布局指针

    //右侧上半部分声明的变量

    QLabel *HeadLabel;

    QLabel *HeadIconLabel;

    QPushButton *UpdateHeadBtn;

    QHBoxLayout *TopRightLayout;    //设置水平布局指针

    QLabel *IntroductionLabel;

    QTextEdit *IntroductionTextEdit;

    QVBoxLayout *RightLayout;       //设置垂直布局指针

    //右侧底部声明的变量

    QPushButton *OkBtn;

    QPushButton *CancelBtn;

    QHBoxLayout *ButtomLayout;      //设置水平布局指针

};

#endif // DIALOG_H

dialog.cpp

#include "dialog.h"

#include <QLabel>

#include <QLineEdit>

#include <QTextEdit>

#include <QPushButton>

#include <QComboBox>

#include <QGridLayout>

#include <QFrame>

#include <QPixmap>

#include <QHBoxLayout>

Dialog::Dialog(QWidget *parent) :

    QDialog(parent)

{

    setWindowTitle (tr("UserInfor"));

    //左侧信息

    UserNameLabel = new QLabel(tr("用户名："));

    UserNameLineEdit = new QLineEdit;

    NameLabel = new QLabel(tr("姓名："));

    NameLineEdit = new QLineEdit;

    SexLabel = new QLabel(tr("性别："));

    SexComboBox = new QComboBox;

    SexComboBox->addItem (tr("女"));

    SexComboBox->addItem (tr("男"));

    DepartmentLabel = new QLabel(tr("部门："));

    DepartmentTextEdit = new QTextEdit;

    AgeLabel = new QLabel(tr("年龄："));

    AgeLineEdit = new QLineEdit;

    OtherLabel = new QLabel(tr("备注："));

    //设置控件的风格形状（NorFrame，Panel，Box，HLine，VLine，WInPanel）和阴影（Plain，Raised，Sunken）两项配合设定

    OtherLabel->setFrameStyle (QFrame::Panel | QFrame::Sunken);

    //左侧布局管理

    LeftLayout = new QGridLayout();

    LeftLayout->addWidget (UserNameLabel, 0, 0);

    LeftLayout->addWidget (UserNameLineEdit, 0, 1);

    LeftLayout->addWidget (NameLabel, 1, 0);

    LeftLayout->addWidget (NameLineEdit, 1, 1);

    LeftLayout->addWidget (SexLabel, 2, 0);

    LeftLayout->addWidget (SexComboBox, 2, 1);

    LeftLayout->addWidget (DepartmentLabel, 3, 0);

    LeftLayout->addWidget (DepartmentTextEdit, 3, 1);

    LeftLayout->addWidget (AgeLabel, 4, 0);

    LeftLayout->addWidget (AgeLineEdit, 4, 1);

    //设置显示一行两列

    LeftLayout->addWidget (OtherLabel, 5, 0, 1, 2);

    LeftLayout->setColumnStretch (0, 1);

    LeftLayout->setColumnStretch (1, 3);

    //右侧上半部分

    HeadLabel = new QLabel(tr("头像"));

    HeadIconLabel = new QLabel;

    QPixmap icon("312.png");

    HeadIconLabel->setPixmap (icon);

    HeadIconLabel->resize (icon.width (), icon.height ());

    UpdateHeadBtn = new QPushButton(tr("更新"));

    //完成右上侧头像选择区的水平布局

    TopRightLayout = new QHBoxLayout();

    //设置每个控件之间的间距

    TopRightLayout->setSpacing (20);

    TopRightLayout->addWidget (HeadLabel);

    TopRightLayout->addWidget (HeadIconLabel);

    TopRightLayout->addWidget (UpdateHeadBtn);

    IntroductionLabel = new QLabel(tr("个人说明"));

    IntroductionTextEdit = new QTextEdit;

    //设置垂直布局

    RightLayout = new QVBoxLayout();

    RightLayout->setMargin (10);

    RightLayout->addLayout (TopRightLayout);

    RightLayout->addWidget (IntroductionLabel);

    RightLayout->addWidget (IntroductionTextEdit);

    OkBtn = new QPushButton(tr("确定"));

    CancelBtn = new QPushButton(tr("取消"));

    ButtomLayout = new QHBoxLayout();

    /*在按钮之前插入一个占位符,使两个按钮能够靠右对齐,并且当整个对话框大小发生改变时,保证按钮的大小不发生变化*/

    ButtomLayout->addStretch ();

    ButtomLayout->addWidget (OkBtn);

    ButtomLayout->addWidget (CancelBtn);

    /*对整个对话框进行布局*/

    QGridLayout *mainLayout = new QGridLayout(this);

    mainLayout->setMargin (15);         //设定对话框（或窗体）的边距为5

    mainLayout->setSpacing (10);        //设定各个部件之间的间距为5

    mainLayout->addLayout (LeftLayout, 0 , 0);

    mainLayout->addLayout (RightLayout, 0, 1);

    mainLayout->addLayout (ButtomLayout, 1, 1);

    //设定最优化显示,并且使用户无法改变对话框的大小.所谓最优化显示,即控件都按其SizeHint()的大小显示

    mainLayout->setSizeConstraint (QLayout::SetFixedSize);

}

Dialog::~Dialog()

{

}