【Qt 学习笔记】Qt常用控件 | 布局管理器 | 表单布局Form Layout

简介: 【Qt 学习笔记】Qt常用控件 | 布局管理器 | 表单布局Form Layout

Qt常用控件 | 布局管理器 | 表单布局Form Layout

一、QFormLayout介绍

1. 简介

QFormLayout是Qt中的一个布局管理器,用于在窗口中创建表单布局。它能够根据需要自动调整表单元素的大小和位置,从而创建一个漂亮且具有一致性的表单界面。


QFormLayout按照类似HTML表单的方式将窗口分割成行和列,每个表单元素都放置在一个单独的行中。每一行通常包含一个标签(用于描述表单元素的用途)和一个表单控件(如文本框、下拉框等)。

2. 常用方法

image.png

二、QFormLayout使用

1. 图形化创建表单布局

  1. 在界面中拖入表单布局框,将三个标签和三个输入框拖入表单布局框中,如下图所示

  2. 点击运行,查看运行结果

2. 代码创建表单布局

  1. 编写代码,创建三个标签(Label)和三个输入框(Line Edit)和一个提交按钮
#include "widget.h"
#include "ui_widget.h"
#include<QLabel>
#include<QPushButton>
#include<QLineEdit>
#include<QFormLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    //创建三个标签
    QLabel* label1 =new QLabel("账号");
    QLabel* label2 =new QLabel("密码");
    QLabel* label3 =new QLabel("验证码");

    //创建三个输入框
    QLineEdit* edit1 =new QLineEdit();
    QLineEdit* edit2 =new QLineEdit();
    QLineEdit* edit3 =new QLineEdit();

    //创建一个按钮
    QPushButton* pushbutton =new QPushButton("提交");

    //创建表单布局
    QFormLayout* layout = new QFormLayout();

    layout->addRow(label1,edit1);
    layout->addRow(label2,edit2);
    layout->addRow(label3,edit3);
    layout->addRow(nullptr,pushbutton);

    //将layout设置到窗口中
    this->setLayout(layout);
}

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

2.运行代码,查看运行结果,随窗口变化而变化

目录
相关文章
|
1月前
|
网络协议 Linux C++
【Qt】多种控件实现“hello world“
【Qt】多种控件实现“hello world“
|
1月前
【qt】 QGridLayout布局管理器怎么用?
【qt】 QGridLayout布局管理器怎么用?
53 0
|
1月前
【Qt 学习笔记】Qt窗口 | 标准对话框 | 消息对话框QMessageBox
【Qt 学习笔记】Qt窗口 | 标准对话框 | 消息对话框QMessageBox
249 4
【Qt 学习笔记】Qt窗口 | 标准对话框 | 消息对话框QMessageBox
|
1月前
|
前端开发 程序员 API
【Qt】控件介绍
【Qt】控件介绍
|
1月前
|
开发者
【Qt 学习笔记】Qt系统相关 | Qt事件 | 事件的介绍及基本概念
【Qt 学习笔记】Qt系统相关 | Qt事件 | 事件的介绍及基本概念
131 4
|
1月前
【Qt 学习笔记】Qt窗口 | 标准对话框 | 文件对话框QFileDialog
【Qt 学习笔记】Qt窗口 | 标准对话框 | 文件对话框QFileDialog
299 4
|
1月前
|
数据安全/隐私保护
【Qt 学习笔记】Qt窗口 | 对话框 | 模态与非模态对话框的创建
【Qt 学习笔记】Qt窗口 | 对话框 | 模态与非模态对话框的创建
178 4
|
1月前
【Qt 学习笔记】Qt窗口 | 标准对话框 | 输入对话框QInputDialog
【Qt 学习笔记】Qt窗口 | 标准对话框 | 输入对话框QInputDialog
87 3
|
1月前
|
数据可视化
【Qt 学习笔记】Qt窗口 | 标准对话框 | 字体对话框QFontDialog
【Qt 学习笔记】Qt窗口 | 标准对话框 | 字体对话框QFontDialog
44 3
|
1月前
【Qt 学习笔记】Qt窗口 | 标准对话框 | 颜色对话框QColorDialog
【Qt 学习笔记】Qt窗口 | 标准对话框 | 颜色对话框QColorDialog
199 3