先垂直布局再水平布局

在GUI设计中，先垂直布局再水平布局通常指的是在一个容器内，先按照从上到下的方向添加子控件，然后再对每个子控件在其内部添加横向的子元素。这种布局方式常用于创建网格状或阶梯式的界面布局。

例如，在使用像Qt这样的框架时，你可以这样做：

from PyQt5.QtWidgets import QVBoxLayout, QHBoxLayout, QWidget

# 创建一个顶级容器
main_widget = QWidget()

# 垂直布局 (纵向)
vertical_layout = QVBoxLayout()
vertical_layout.addWidget(QLabel('Row 1, Column 1'))
vertical_layout.addWidget(QLabel('Row 1, Column 2'))

# 水平布局 (横向) 对于第一个垂直布局的子控件
horizontal_layout_1 = QHBoxLayout()
horizontal_layout_1.addWidget(QLabel('Column 1, Row 1'))
horizontal_layout_1.addWidget(QLabel('Column 2, Row 1'))

# 将水平布局添加到垂直布局
vertical_layout.addLayout(horizontal_layout_1)

# 对第二个垂直布局的子控件同样操作
horizontal_layout_2 = QHBoxLayout()
horizontal_layout_2.addWidget(QLabel('Column 1, Row 2'))
horizontal_layout_2.addWidget(QLabel('Column 2, Row 2'))

vertical_layout.addLayout(horizontal_layout_2)

# 将垂直布局应用到顶级容器
main_widget.setLayout(vertical_layout)

在这个例子中，你会首先看到两行，每行包含两个水平排列的标签。