Qt常用控件之网格布局QGridLayout

网格布局QGridLayout

QGridLayout 是一个网格布局控件，它与 QVLayout 和 QHLayout 的不同在于，QGridLayout 能够允许自定义控件放入布局中所处的行和列。

1. QGridLayout属性

2. QGridLayout方法

3. 使用QGridLayout添加控件到布局

注意，addWidget() 在 QGridLayout 中还要指定行和列，但这个行和列只是一个用于比较大小来决定控件先后顺序的值，故意设置一个很大的值和很小的值并不会使两个控件间隔很远。代码一定要 this->setLayout(Glayout); 或 set 到其他父控件，否则不会显示。

#include "widget.h"
#include "ui_widget.h"
#include <QLayout>
#include <QPushButton>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    QGridLayout* Glayout = new QGridLayout();
    QPushButton* button1 = new QPushButton("button1");
    QPushButton* button2 = new QPushButton("button2");
    QPushButton* button3 = new QPushButton("button3");
    QPushButton* button4 = new QPushButton("button4");

//    //相当于垂直排布
//    Glayout->addWidget(button1,1,0);
//    Glayout->addWidget(button2,2,0);
//    Glayout->addWidget(button3,3,0);
//    Glayout->addWidget(button4,4,0);

//    //相当于水平排布
//    Glayout->addWidget(button1,0,1);
//    Glayout->addWidget(button2,0,2);
//    Glayout->addWidget(button3,0,3);
//    Glayout->addWidget(button4,0,4);

    //对角线布局
    Glayout->addWidget(button1,1,1);
    Glayout->addWidget(button2,2,2);
    Glayout->addWidget(button3,3,3);
    Glayout->addWidget(button4,4,4);

    this->setLayout(Glayout);

}

Widget::~Widget()
{
    delete ui;
}

4. 调整QGridLayout中不同控件的拉伸比例

QGridLayout 有两个接口，setColumnStretch() 用于调整同一列的控件之间的左右拉伸比例， setRowStretch() 用于调整同一行控件的上下拉伸比例。但要注意，拉伸比例小于控件的 text 能显示的正常大小时，这个拉伸比例就不会起作用：

#include "widget.h"
#include "ui_widget.h"
#include <QLayout>
#include <QPushButton>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QGridLayout* Glayout = new QGridLayout();
    QPushButton* button1 = new QPushButton("button1");
    QPushButton* button2 = new QPushButton("button2");
    QPushButton* button3 = new QPushButton("button3");
    QPushButton* button4 = new QPushButton("button4");

    //相当于水平排布
    Glayout->addWidget(button1,0,1);
    Glayout->addWidget(button2,0,2);
    Glayout->addWidget(button3,0,3);
    Glayout->addWidget(button4,0,4);

    Glayout->setColumnStretch(1,1);
    Glayout->setColumnStretch(2,2);
    Glayout->setColumnStretch(3,4);
    Glayout->setColumnStretch(4,8);

    this->setLayout(Glayout);
}

Widget::~Widget()
{
    delete ui;
}

按 $1:2:4:8$ 的比例排布。

在使用 setRowStretch() 前要注意，有些控件是受限于自身 sizePolicy 属性影响，是不会随着这个拉伸设置而改变布局的：

#include "widget.h"
#include "ui_widget.h"
#include <QLayout>
#include <QPushButton>
#include <QSizePolicy>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QGridLayout* Glayout = new QGridLayout();
    QPushButton* button1 = new QPushButton("button1");
    QPushButton* button2 = new QPushButton("button2");
    QPushButton* button3 = new QPushButton("button3");
    QPushButton* button4 = new QPushButton("button4");

    //将按钮的水平和垂直方向都设置为任意拉伸
    button1->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    button2->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    button3->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    button4->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);

    Glayout->addWidget(button1,1,1);
    Glayout->addWidget(button2,1,2);
    Glayout->addWidget(button3,2,1);
    Glayout->addWidget(button4,2,2);

    Glayout->setRowStretch(1,1);
    Glayout->setRowStretch(2,2);

    this->setLayout(Glayout);
}

Widget::~Widget()
{
    delete ui;
}