当前位置：首页 > wzjs >正文

html5网站源码php官网设计比较好看的网站

wzjs 2025/7/22 4:49:48

html5网站源码php,官网设计比较好看的网站,官方商城入口,网站建设英语目录布局管理器 QVBoxLayout QHBoxLayout QGirdLayout QFormLayout Spacer 布局管理器在以往的界面操作上，都是程序员手动拖动控件来布局，这种方式有一些不足之处，比如不能很好的把握控件之间的距离，以及控件的大小&…

布局管理器

QVBoxLayout

QHBoxLayout

QGirdLayout

QFormLayout

Spacer

布局管理器

在以往的界面操作上，都是程序员手动拖动控件来布局，这种方式有一些不足之处，比如不能很好的把握控件之间的距离，以及控件的大小，并且在最终的窗口中，改变窗口大小时，控件的大小不能很好的适应。

于是，引入布局管理器，它是一种控件，可以自动管理其他控件。

常见的布局管理器有垂直布局管理器、水平布局管理器、网格布局、表单布局。

QVBoxLayout

布局管理器只用于界面布局，不提供信号。

Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 创建三个按钮QPushButton* btn1 = new QPushButton("按钮1");QPushButton* btn2 = new QPushButton("按钮2");QPushButton* btn3 = new QPushButton("按钮3");// 创建布局管理器, 并且把按钮添加进去// 如果创建的时候指定⽗元素为 this, 则后⾯不需要 setLayout ⽅法了.QVBoxLayout* layout = new QVBoxLayout();layout->addWidget(btn1);layout->addWidget(btn2);layout->addWidget(btn3);// 把布局管理器设置到 widget 中this->setLayout(layout);
}

每个Widget只能设置一个布局管理器。

使用Qt Design创建两个布局管理器

程序运行后，界面可以正常显示。但是，这两个布局管理器并不会适应窗口的大小变化，因为本质上这是两个Widget。

QHBoxLayout

垂直布局中可以嵌套一个水平布局，反过来也可以。

QGirdLayout

网格布局，可以实现M * N的效果。

 QPushButton* btn1 = new QPushButton("按钮1");QPushButton* btn2 = new QPushButton("按钮2");QPushButton* btn3 = new QPushButton("按钮3");QPushButton* btn4 = new QPushButton("按钮4");QGridLayout* layout = new QGridLayout();layout->addWidget(btn1, 0, 0);layout->addWidget(btn2, 1, 1);layout->addWidget(btn3, 2, 2);layout->addWidget(btn4, 3, 3);this->setLayout(layout);

设置水平方向的拉伸系数

// 创建 6 个按钮QPushButton* btn1 = new QPushButton("按钮1");QPushButton* btn2 = new QPushButton("按钮2");QPushButton* btn3 = new QPushButton("按钮3");QPushButton* btn4 = new QPushButton("按钮4");QPushButton* btn5 = new QPushButton("按钮5");QPushButton* btn6 = new QPushButton("按钮6");// 创建⽹格布局管理器, 并且添加元素QGridLayout* layout = new QGridLayout();layout->addWidget(btn1, 0, 0);layout->addWidget(btn2, 0, 1);layout->addWidget(btn3, 0, 2);layout->addWidget(btn4, 1, 0);layout->addWidget(btn5, 1, 1);layout->addWidget(btn6, 1, 2);// 设置拉伸⽐例// 第 0 列拉伸⽐例设为 1;layout->setColumnStretch(0, 1);// 第 1 列拉伸⽐例设为 0, 即为固定⼤⼩, 不参与拉伸layout->setColumnStretch(1, 0);// 第 2 列拉伸⽐例设为 3, 即为第 2 列的宽度是第 0 列的 3 倍layout->setColumnStretch(2, 3);// 设置 layout 到窗⼝中.this->setLayout(layout);

设置垂直方向的拉伸系数

Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 创建 6 个按钮QPushButton* btn1 = new QPushButton("按钮1");QPushButton* btn2 = new QPushButton("按钮2");QPushButton* btn3 = new QPushButton("按钮3");QPushButton* btn4 = new QPushButton("按钮4");QPushButton* btn5 = new QPushButton("按钮5");QPushButton* btn6 = new QPushButton("按钮6");// 设置按钮的 sizePolicy, 此时按钮的⽔平⽅向和垂直⽅向都会尽量舒展开btn1->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);btn2->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);btn3->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);btn4->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);btn5->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);btn6->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);// 创建⽹格布局管理器, 并且添加元素QGridLayout* layout = new QGridLayout();layout->addWidget(btn1, 0, 0);layout->addWidget(btn2, 0, 1);layout->addWidget(btn3, 1, 0);layout->addWidget(btn4, 1, 1);layout->addWidget(btn5, 2, 0);layout->addWidget(btn6, 2, 1);// 设置拉伸⽐例// 第 0 ⾏拉伸⽐例设为 1;layout->setRowStretch(0, 1);// 第 1 ⾏拉伸⽐例设为 0, 即为固定⼤⼩, 不参与拉伸layout->setRowStretch(1, 0);// 第 2 ⾏拉伸⽐例设为 3, 即为第 2 ⾏的宽度是第 0 ⾏的 3 倍layout->setRowStretch(2, 3);
// 设置 layout 到窗⼝中.this->setLayout(layout);}

什么是SizePolicy

在界面中，每个按钮的高度是固定，即使布局管理器按照比例设置了拉伸系数，也是没有效果的，而想让设置生效，就要设置每个按钮的SizePolicy，按钮的尺寸策略有如下几种。

使⽤ setSizePolicy 设置按钮的尺⼨策略. 可选的值如下:

QSizePolicy::Ignored : 忽略控件的尺⼨，不对布局产⽣影响。

QSizePolicy::Minimum : 控件的最⼩尺⼨为固定值，布局时不会超过该值。

QSizePolicy::Maximum : 控件的最⼤尺⼨为固定值，布局时不会⼩于该值。

QSizePolicy::Preferred : 控件的理想尺⼨为固定值，布局时会尽量接近该值。

QSizePolicy::Expanding : 控件的尺⼨可以根据空间调整，尽可能占据更多空间。

QSizePolicy::Shrinking : 控件的尺⼨可以根据空间调整，尽可能缩⼩以适应空间。

总的来说, 使⽤ QGridLayout 能够代替很多 QHBoxLayout 和 QVBoxLayout 嵌套的场景. 毕

竟嵌套的代码写起来是⽐较⿇烦的.

另外不要忘了, QGridLayout ⾥⾯也能嵌套 QHBoxLayout 和 QVBoxLayout , QHBoxLayout 和 QVBoxLayout ⾥⾯也能嵌套 QGridLayout 。灵活使⽤上述布局管理器, 就可以实现出任意的复杂界⾯。

QFormLayout

表单布局，N行2列，主要用于填表这样的场景。

Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 创建 layoutQFormLayout* layout = new QFormLayout();this->setLayout(layout);// 创建三个 labelQLabel* label1 = new QLabel("姓名");QLabel* label2 = new QLabel("年龄");QLabel* label3 = new QLabel("电话");// 创建三个 lineEditQLineEdit* lineEdit1 = new QLineEdit();QLineEdit* lineEdit2 = new QLineEdit();QLineEdit* lineEdit3 = new QLineEdit();// 创建⼀个提交按钮QPushButton* btn = new QPushButton("提交");// 把上述元素添加到 layout 中layout->addRow(label1, lineEdit1);layout->addRow(label2, lineEdit2);layout->addRow(label3, lineEdit3);layout->addRow(NULL, btn);
}

Spacer

Spacer不属于布局管理器，往往搭配在布局管理器中使用，表示一个空白块，可以用来让两个控件之间的距离变大。

属性

Widget::Widget(QWidget *parent): QWidget(parent)
, ui(new Ui::Widget){ui->setupUi(this);QHBoxLayout* layout = new QHBoxLayout();this->setLayout(layout);QPushButton* btn1 = new QPushButton("按钮1");QPushButton* btn2 = new QPushButton("按钮2");// 创建 SpacerQSpacerItem* spacer = new QSpacerItem(200, 20);layout->addWidget(btn1);// 在两个 widget 中间添加空⽩layout->addSpacerItem(spacer);layout->addWidget(btn2);}