关键词

Qt QVBoxLayout垂直布局(超级详细)

实际开发中,一个界面中可能包含十几个控件,手动调整它们的位置既耗时又耗力。作为一款成熟的 GUI 框架,Qt 提供了很多辅助我们摆放控件的工具(又称布局管理器或者布局控件),它们可以完成两件事:
  • 自动调整控件的位置,包括控件之间的间距、对齐等问题;
  • 当用户调整窗口的尺寸时,布局管理器会随之调整各个控件的尺寸。

Qt 提供的布局控件有 QVBoxLayout、QHBoxLayout、QGridLayout 等,本节我们讲解 QVBoxLayout 布局控件的用法。

QVBoxLayout垂直布局

垂直布局指的是将所有控件从上到下(或者从下到上)依次摆放,例如:


图 1 QVBoxLayout垂直布局


图 1 给大家演示的是 QVBoxLayout 垂直摆放 4 个 QPushButton 按钮的布局效果。实际场景中,QVBoxLayout 中还可以放置其它控件,比如 QLabel 文本框、QLineEdit 单行输入框等。

项目中使用 QVBoxLayout 布局控件,需提前引入<QVBoxLayout>头文件。每个 QVBoxLayout 控件本质都是 QVBoxLayout 类的实例对象,该类提供了两个构造函数,分别是:
QVBoxLayout()
QVBoxLayout(QWidget *parent)
创建 QVBoxLayout 布局时,可以指定父窗口,那么它将作为父窗口中布局其它控件的工具;也可以暂时不指定父窗口,待全部设置完毕后再将其添加到某个窗口中。

QVBoxLayout 类的继承关系是QVBoxLayout->QBoxLayout->QLayout。QVBoxLayout 类并没有新增任何成员方法,它只能使用从父类 QBoxLayout 继承过来的成员方法,下表给大家罗列了常用的一些:

表 1 QVBoxLayout常用方法
成员方法 功 能
void QBoxLayout::addWidget(QWidget *widget, int stretch = 0, Qt::Alignment alignment = Qt::Alignment()) 向布局管理器中添加指定的 widget 控件。

默认情况下,新加入控件的 stretch 拉伸系数为 0,表示该控件不会过多占用布局管理器的空间;alignment 是一个枚举类型参数,默认的枚举值也是 0,表示该控件会填满占用的整个空间。
void QBoxLayout::addStretch(int stretch = 0) 添加一个空白行,整个窗口中除了控件占用的区域外,其它区域可以由多个(≥0)空白行分摊,分摊比例取余于各个空白行设置的 stretch 的值(又称伸缩系数)。

strech 参数的默认值为 0,表示当窗口很小时,空白行可以不占据窗口空间。当窗口中包含多个 strech 值为 0 的空白行时,它们会平分窗口中的空白区域。
void QBoxLayout::addSpacing(int size) 添加一个 size 大小的固定间距。
void QLayout::setMargin(int margin) 设置布局管理器中所有控件的外边距,上、下、左、右外边距的大小都为 margin。默认情况下,所有方向的外边距为 11 px。
void QLayout::setContentsMargins(int left, int top, int right, int bottom) 设置布局管理器中所有控件的外边距,可以自定义上、下、左、右外边距的值。
void QBoxLayout::setDirection(Direction direction) 设置布局管理器中控件的布局方向,Direction 是一个枚举类型,对于 QVBoxLayout 布局管理器,direction 参数的值通常选择 QBoxLayout::TopToBottom(从上到下依次摆放)或者 QBoxLayout::BottomToTop(从下到上依次摆放)。
bool QBoxLayout::setStretchFactor(QWidget *widget, int stretch) 设置布局管理器中某个控件的拉伸系数。
bool QBoxLayout::setStretchFactor(QLayout *layout, int stretch) 布局管理器内部可以再放置一个布局管理器,该方法用来设置内部某个布局管理器的拉伸系数。

举个简单的例子:
#include <QApplication>
#include <QWidget>
#include <QLabel>
#include <QVBoxLayout>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    //创建主窗口
    QWidget widget;
    widget.setWindowTitle("QVBoxLayout垂直布局");
    //创建垂直布局管理器
    QVBoxLayout *layout=new QVBoxLayout;
    //设置布局管理器中所有控件的布局方向为从下往上依次排列
    layout->setDirection(QBoxLayout::BottomToTop);
   
    //连续创建 3 个文本框,并设置它们的背景和字体大小
    QLabel lab1("Label1");
    lab1.setStyleSheet("QLabel{background:#dddddd;font:20px;}");
    lab1.setAlignment(Qt::AlignCenter);
    QLabel lab2("Label2");
    lab2.setStyleSheet("QLabel{background:#cccccc;font:20px;}");
    lab2.setAlignment(Qt::AlignCenter);
    QLabel lab3("Label3");
    lab3.setStyleSheet("QLabel{background:#ffffff;font:20px;}");
    lab3.setAlignment(Qt::AlignCenter);
   
    //将 3 个文本框和 2 个空白行添加到管理器中,它们的伸缩系数比是 2:1:2:3:3
    layout->addStretch(2);
    layout->addWidget(&lab1,1);
    layout->addWidget(&lab2,2);
    layout->addWidget(&lab3,3);
    layout->addStretch(3);
   
    //将布局管理器添加到 widget 窗口中
    widget.setLayout(layout);
    widget.show();
    return a.exec();
}
程序中做了以下几个操作:
  • 通过调用 setDirection() 方法,我们将添加到 QVBoxLayout 中的所有控件(包括空白行)按照从下到上的顺序依次排列。举个例子,由于 lab1 文本框是第二个添加到 QVBoxLayout 中的,因此最终显示的界面中 lab1 应该位于倒数第二的位置。
  • 通过调用 addStrech() 方法,我们向 QVBoxLayout 中先后添加了两个空白行,它们的伸缩系数分别为 2 和 3,因此 widget 窗口中的空白区域会被平均分成 5 份,一个空白行占 3 份,另一个占 2 份。
  • 通过调用 addWidget() 方法,我们向 QVBoxLayout 先后添加了 3 个文本框,它们的拉伸系数比为 1:2:3,所以当我们拉伸 widget 窗口时,三个文本框的大小(宽度)呈现 1:2:3 的关系。
  • 通过调用 setLayout() 方法,layout 被成功地添加到 widget 窗口中。当然,我们也可以在创建 layout 对象时指定 widget 作为它的父窗口,两种方式是完全等价的。

执行结果为:


图 2 QVBoxLayout 实例演示

本文链接:http://task.lmcjl.com/news/16404.html

展开阅读全文