Qt学习07——布局管理

本文分别介绍分割窗口类QSplitter、停靠窗口类QDockWidget、堆栈窗体类QStackWidget的使用，并通过实例展示效果。

（本文中的UI均由代码实现，注意添加相应库函数到头文件中）

一、分割窗口类QSplitter

QSplitter用于分割窗口的布局。

例1：三个窗口可以任意切割大小。

#include "widget.h"#include <QApplication>int main(int argc, char *argv[]){    QApplication a(argc, argv);    QSplitter *splitterMain = new QSplitter(Qt::Horizontal,0);    QTextEdit *textLeft = new QTextEdit(QObject::tr("Left TextEdit"),splitterMain);    textLeft->setAlignment(Qt::AlignCenter);    QSplitter *splitterRight = new QSplitter(Qt::Vertical,splitterMain);    splitterRight->setOpaqueResize(false);    //设置分割条拖动时是否实时更新，默认为true。设为false则在鼠标拖动完成之后才显示新位置的分割条。    //这里设置左右分割条实时更新，上下分割条分割完成后更新。    QTextEdit *textTop = new QTextEdit(QObject::tr("Top TextEdit"),splitterRight);    QTextEdit *textBottom = new QTextEdit(QObject::tr("Bottom TextEdit"),splitterRight);    textTop->setAlignment(Qt::AlignCenter);    textBottom->setAlignment(Qt::AlignCenter);    splitterMain->setStretchFactor(1,1);    //设定控件可伸缩性。第一个参数用于指定设置的控件序号，第二个参数大于0表示可伸缩。    //这里设置编号为1的splitterRight可伸缩，当整个窗口变化时，左侧宽度不变，右侧随大小调整。    splitterMain->setWindowTitle(QObject::tr("Splitter Test"));//设置窗口标题栏    splitterMain->show();    return a.exec();}

输出

二、停靠窗口类QDockWidget

QDockWidget用于设置窗口的停靠功能。

设置停靠窗口的一般流程：

1、创建一个QDockWidget对象的停靠窗体；

2、设置此停靠窗体的属性，如setFeatures()和setAllowedAreas()两种方法。

例2：窗口1可在主窗口左右停靠，窗口2只能浮动和在右部停靠且不能移动，窗口3可实现各种方式的停靠。

#include "dockwidget.h"#include "ui_dockwidget.h"DockWidget::DockWidget(QWidget *parent) :    QMainWindow(parent),    ui(new Ui::DockWidget){    ui->setupUi(this);    setWindowTitle(tr("DockWindow"));    QTextEdit *tx = new QTextEdit(this);    //定义一个文本编辑框作为一个主窗口    tx->setText(tr("Main Window"));    tx->setAlignment(Qt::AlignCenter);    setCentralWidget(tx);    //设置文本编辑框为主窗口的中央窗体    QDockWidget *dock = new QDockWidget(tr("DockWindow1"),this);    dock->setFeatures(QDockWidget::DockWidgetMovable);    //设置dock属性为可移动    dock->setAllowedAreas(Qt::LeftDockWidgetArea|Qt::RightDockWidgetArea);    //设置可移动范围为左右区域    QTextEdit *tx1 = new QTextEdit();    tx1->setText(tr("Window1"));    dock->setWidget(tx1);    addDockWidget(Qt::RightDockWidgetArea,dock);    dock = new QDockWidget(tr("DockWindow2"),this);    dock->setFeatures(QDockWidget::DockWidgetClosable|QDockWidget::DockWidgetFloatable);    //设置dock属性为可关闭、可浮动    QTextEdit *tx2 = new QTextEdit();    tx2->setText(tr("window2"));    dock->setWidget(tx2);    addDockWidget(Qt::RightDockWidgetArea,dock);    dock = new QDockWidget(tr("DockWindow3"),this);    dock->setFeatures(QDockWidget::AllDockWidgetFeatures);    //设置dock具备全部特性    QTextEdit *tx3 = new QTextEdit();    tx3->setText(tr("Window3"));    dock->setWidget(tx3);    addDockWidget(Qt::RightDockWidgetArea,dock);}DockWidget::~DockWidget(){    delete ui;}

三、堆栈窗体类QStackedWidget

堆栈窗体常与列表框QListWidget和下拉列表框QComboBox配合使用。

例3：左侧选择不同选项，右侧显示相应的窗体。

stackwidget.cpp

#include "stackwidget.h"#include "ui_stackwidget.h"stackWidget::stackWidget(QWidget *parent) :    QDialog(parent),    ui(new Ui::stackWidget){    ui->setupUi(this);    setWindowTitle(tr("StackWidget"));    list = new QListWidget(this);    list->insertItem(0,tr("Window1"));    list->insertItem(1,tr("Window2"));    list->insertItem(2,tr("Window3"));    label1 = new QLabel(tr("windowtest1"));    label2 = new QLabel(tr("windowtest2"));    label3 = new QLabel(tr("windowtest3"));    stack = new QStackedWidget(this);    stack->addWidget(label1);    stack->addWidget(label2);    stack->addWidget(label3);    mainLayout = new QHBoxLayout(this);    mainLayout->setMargin(5);    mainLayout->setSpacing(5);    mainLayout->addWidget(list);    mainLayout->addWidget(stack,0,Qt::AlignHCenter);    mainLayout->setStretchFactor(list,1);    mainLayout->setStretchFactor(stack,3);    connect(list,SIGNAL(currentRowChanged(int)),stack,SLOT(setCurrentIndex(int)));}stackWidget::~stackWidget(){    delete ui;}

stackwidget.h

#ifndef STACKWIDGET_H#define STACKWIDGET_H#include <QDialog>#include <QListWidget>#include <QStackedWidget>#include <QLabel>#include <QHBoxLayout>namespace Ui {class stackWidget;}class stackWidget : public QDialog{    Q_OBJECTpublic:    explicit stackWidget(QWidget *parent = 0);    ~stackWidget();private:    Ui::stackWidget *ui;    QStackedWidget *stack;    QListWidget *list;    QLabel *label1;    QLabel *label2;    QLabel *label3;    QHBoxLayout *mainLayout;};#endif // STACKWIDGET_H

四、基本布局QLayout

Qt提供了几种基本的布局管理，分别是水平排列布局（QHBoxLayout）、垂直排列布局（QVBoxLayout）、网格排列布局（QGridLayout），他们之间继承关系如下：

layout.h

#ifndef LAYOUT_H#define LAYOUT_H#include <QDialog>#include <QLabel>#include <QLineEdit>#include <QComboBox>#include <QTextEdit>#include <QGridLayout>#include <QPushButton>#include <QFrame>#include <QTextCodec>namespace Ui {class layout;}class layout : public QDialog{    Q_OBJECTpublic:    explicit layout(QWidget *parent = 0);    ~layout();private:    Ui::layout *ui;    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 // LAYOUT_H

layout.cpp

#include "layout.h"#include "ui_layout.h"layout::layout(QWidget *parent) :    QDialog(parent),    ui(new Ui::layout){    ui->setupUi(this);    setWindowTitle(tr("UserInfo"));    /************** 左侧 ******************************/    UserNameLabel =new QLabel(tr("user:"));    UserNameLineEdit =new QLineEdit;    NameLabel = new QLabel(tr("name:"));    NameLineEdit = new QLineEdit;    SexLabel = new QLabel(tr("sex:"));    SexComboBox = new QComboBox;    SexComboBox->addItem(tr("female"));    SexComboBox->addItem(tr("male"));    DepartmentLabel = new QLabel(tr("department"));    DepartmentTextEdit = new QTextEdit;    AgeLabel = new QLabel(tr("age"));    AgeLineEdit = new QLineEdit;    OtherLabel = new QLabel(tr("mark:"));    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("picture"));                    //右上角部分    HeadIconLabel = new QLabel;    QPixmap icon("312.png");    HeadIconLabel->setPixmap(icon);    HeadIconLabel->resize(icon.width(),icon.height());    UpdateHeadBtn = new QPushButton(tr("update"));    TopRightLayout = new QHBoxLayout();    TopRightLayout->setSpacing(20);    TopRightLayout->addWidget(HeadLabel);    TopRightLayout->addWidget(HeadIconLabel);    TopRightLayout->addWidget(UpdateHeadBtn);    IntroductionLabel = new QLabel(tr("description"));         //右下角部分    IntroductionTextEdit = new QTextEdit;    RightLayout = new QVBoxLayout();    RightLayout->setMargin(10);    RightLayout->addLayout(TopRightLayout);    RightLayout->addWidget(IntroductionLabel);    RightLayout->addWidget(IntroductionTextEdit);    /*--------------------- 底部 --------------------*/    OkBtn = new QPushButton(tr("Ok"));    CancelBtn = new QPushButton(tr("Cancel"));    ButtomLayout = new QHBoxLayout();    ButtomLayout->addStretch();    ButtomLayout->addWidget(OkBtn);    ButtomLayout->addWidget(CancelBtn);    /*---------------------------------------------*/    QGridLayout *mainLayout = new QGridLayout(this);    mainLayout->setMargin(15);    mainLayout->setSpacing(10);    mainLayout->addLayout(LeftLayout,0,0);    mainLayout->addLayout(RightLayout,0,1);    mainLayout->addLayout(ButtomLayout,1,0,1,2);    mainLayout->setSizeConstraint(QLayout::SetFixedSize);}layout::~layout(){    delete ui;}