【Qt学习】 垂直布局和水平布局

已于 2022-11-18 12:17:27 修改
阅读量5.4k 收藏 17
点赞数 2
分类专栏： Qt学习之路 文章标签： qt c++
于 2022-05-06 01:16:57 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_56051805/article/details/124600761
版权

目录

一：项目重构

二：VBoxLayout 垂直布局

三：HBoxLayout 水平布局

四：水平垂直布局综合应用

五：创建控件

一：项目重构

在使用Qt软件的时候，有时候会出现程序异常结束[而自己的代码逻辑是没有问题的]

此时的解决方法：重新构建项目

二：VBoxLayout 垂直布局

垂直布局，代码示例 

indexwin.h .cpp

#ifndef INDEXWIN_H
#define INDEXWIN_H

#include <QWidget>
#include<QVBoxLayout>//垂直布局
#include<QPushButton>

class IndexWin : public QWidget
{
    Q_OBJECT
public:
    explicit IndexWin(QWidget *parent = 0);

    QWidget *window;
    QPushButton *button1;
    QPushButton *button2;
    QPushButton *button3;
    QPushButton *button4;
    QPushButton *button5;


signals:

public slots:
};

#endif // INDEXWIN_H

#include "indexwin.h"

IndexWin::IndexWin(QWidget *parent) : QWidget(parent)
{
    this->resize(1500,800);

    window = new QWidget(this);
    button1 = new QPushButton("One");
    button2 = new QPushButton("Two");
    button3 = new QPushButton("Three");
    button4 = new QPushButton("Four");
    button5 = new QPushButton("Five");

    QVBoxLayout *layout = new QVBoxLayout;//垂直布局
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    layout->addWidget(button4);
    layout->addWidget(button5);

    window->setLayout(layout);
}

main.cpp

#include "widget.h"
#include <QApplication>
#include"indexwin.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    IndexWin w;
    w.show();

    return a.exec();
}

垂直布局，效果展示 


三：HBoxLayout 水平布局

水平布局，代码示例 

indexwin.h .cpp

#ifndef INDEXWIN_H
#define INDEXWIN_H

#include <QWidget>
#include<QVBoxLayout>//垂直布局
#include<QHBoxLayout>//水平布局
#include<QPushButton>

class IndexWin : public QWidget
{
    Q_OBJECT
public:
    explicit IndexWin(QWidget *parent = 0);

    QWidget *window;
    QPushButton *button1;
    QPushButton *button2;
    QPushButton *button3;
    QPushButton *button4;
    QPushButton *button5;


signals:

public slots:
};

#endif // INDEXWIN_H

#include "indexwin.h"

IndexWin::IndexWin(QWidget *parent) : QWidget(parent)
{
    this->resize(1500,800);

    window = new QWidget(this);
    button1 = new QPushButton("One");
    button2 = new QPushButton("Two");
    button3 = new QPushButton("Three");
    button4 = new QPushButton("Four");
    button5 = new QPushButton("Five");

    QHBoxLayout *layout = new QHBoxLayout;//水平布局
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    layout->addWidget(button4);
    layout->addWidget(button5);

    window->setLayout(layout);
}

水平布局，效果展示

四：水平垂直布局综合应用

布局设计 练习如下：

水平的五个按钮(按钮在window中)

垂直的两个窗口(window和window1垂直)

indexwin.h .cpp

#ifndef INDEXWIN_H
#define INDEXWIN_H

#include <QWidget>
#include<QVBoxLayout>//垂直布局
#include<QHBoxLayout>//水平布局
#include<QPushButton>

class IndexWin : public QWidget
{
    Q_OBJECT
public:
    explicit IndexWin(QWidget *parent = 0);

    QWidget *window;
    QPushButton *button1;
    QPushButton *button2;
    QPushButton *button3;
    QPushButton *button4;
    QPushButton *button5;
    QWidget *window1;


signals:

public slots:
};

#endif // INDEXWIN_H

#include "indexwin.h"

IndexWin::IndexWin(QWidget *parent) : QWidget(parent)
{
    this->resize(1500,800);

    //多个窗口不要this
    window = new QWidget();
    button1 = new QPushButton("One");
    button2 = new QPushButton("Two");
    button3 = new QPushButton("Three");
    button4 = new QPushButton("Four");
    button5 = new QPushButton("Five");

    QHBoxLayout *layout = new QHBoxLayout;//水平的按钮
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    layout->addWidget(button4);
    layout->addWidget(button5);
    window->setLayout(layout);

    window1= new QWidget();

    //this是最大窗口              垂直的窗口
    QVBoxLayout *vlayout = new QVBoxLayout(this);//两个窗口垂直放置
    vlayout->addWidget(window);
    vlayout->addWidget(window1);
}

main.cpp

#include "widget.h"
#include <QApplication>
#include"indexwin.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    IndexWin w;
    w.show();

    return a.exec();
}

效果展示

 在window1中放置一个按钮

#include "indexwin.h"

IndexWin::IndexWin(QWidget *parent) : QWidget(parent)
{
    this->resize(1500,800);

    //多个窗口不要this
    window = new QWidget();
    button1 = new QPushButton("One");
    button2 = new QPushButton("Two");
    button3 = new QPushButton("Three");
    button4 = new QPushButton("Four");
    button5 = new QPushButton("Five");

    QHBoxLayout *layout = new QHBoxLayout;//水平的按钮
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    layout->addWidget(button4);
    layout->addWidget(button5);
    window->setLayout(layout);

    window1= new QWidget();
    QPushButton *button1 = new QPushButton("One",window1);//在window1中放置一个按钮

    //this是最大窗口              垂直的窗口
    QVBoxLayout *vlayout = new QVBoxLayout(this);//两个窗口垂直放置
    vlayout->addWidget(window);
    vlayout->addWidget(window1);
}

效果展示

五：创建控件

创建控件方法[两种方法]如下 

1.自定义所有控件（不推荐）

2.动态创建所有控件（推荐）

indexwin.h .cpp

#ifndef INDEXWIN_H
#define INDEXWIN_H

#include <QWidget>
#include<QVBoxLayout>//垂直布局
#include<QHBoxLayout>//水平布局
#include<QPushButton>
#include<QLineEdit>

class IndexWin : public QWidget
{
    Q_OBJECT
public:
    explicit IndexWin(QWidget *parent = 0);

    QWidget *leftwin;
    QWidget *topwin;
    QWidget *indexwin;
    QLineEdit *searchEdit;
    QPushButton *userBtn;
    QPushButton *vipBtn;



signals:

public slots:
};

#endif // INDEXWIN_H

#include "indexwin.h"
#include<QStringList>

IndexWin::IndexWin(QWidget *parent) : QWidget(parent)
{
     this->resize(1500,800);

     leftwin = new QWidget();
     topwin = new QWidget();
     indexwin = new QWidget();

     //方法一：自定义所有控件
     //控件水平
     QHBoxLayout *hboxlayout = new QHBoxLayout(topwin);
     searchEdit = new QLineEdit();
     userBtn = new QPushButton();
     vipBtn = new QPushButton();
     hboxlayout->addWidget(searchEdit);
     hboxlayout->addWidget(userBtn);
     hboxlayout->addWidget(vipBtn);

     //方法二：动态创建所有控件
     //按钮控件垂直
     QVBoxLayout *vboxlayout1 = new QVBoxLayout(indexwin);
     QStringList funBtnlist;
     funBtnlist<<"logo"<<"视频"<<"动漫"<<"电影";
     for(int i=0;i<funBtnlist.size();i++)
     {
         QPushButton *newBtn = new QPushButton(funBtnlist.at(i));
         vboxlayout1->addWidget(newBtn);
     }

     //两个窗口垂直
     QVBoxLayout *vboxlayout = new QVBoxLayout(this);
     vboxlayout->addWidget(topwin);
     vboxlayout->addWidget(indexwin);
}

main.cpp

#include "widget.h"
#include <QApplication>
#include"indexwin.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    IndexWin w;
    w.show();

    return a.exec();
}

效果展示 


chenruhan_QAQ_
关注
  • 2
    点赞
  • 踩
  • 17
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Qt 布局：水平、垂直布局的使用详解
QtCompany的博客
07-26 549
上面介绍了基本所有常用的接口使用，掌握了这些接口，其它布局 QVBoxLayout、QGridLayout 功能也相同或类似，一通百通。Qt 布局之二：水平、垂直布局的使用详解。
[QT_045]Qt学习之水平（QHBoxLayout ）和垂直布局器（QVBoxLayout）
kongcheng253的博客
01-28 6497
Qt学习之水平（QHBoxLayout ）和垂直布局器（QVBoxLayout）
【Qt】布局之道：Qt界面设计中的五大布局管理器：垂直布局QVBoxLayout,水平布局QHBoxLayout,网格布局QGridLayout,表单布局QFormLayout,QSpacerItem
最新发布
Colorful___的博客
05-22 1814
在现代软件开发中，用户界面的设计和布局是至关重要的一环。一个直观、美观且响应式的界面不仅能提升用户体验，还能使应用更加易于使用。Qt框架，作为跨平台开发的强大工具，提供了多种布局管理器来帮助开发者轻松实现复杂界面的布局。本文将详细介绍Qt中的五种主要布局管理器：垂直布局、水平布局、网格布局、表单布局以及Spacer的使用，并通过代码示例展示如何使用这些布局管理器来创建灵活且自适应的界面。之前把控件放到界面上，都是靠“手动”的方式来布局的。这种调整方式是不科学的!手动布局的方式非常复杂，而且不精确。
Qt 垂直布局 (QVBoxLayout)
热门推荐
shenmingyi.blog.csdn.net
08-27 5万+
Qt 垂直布局 (QVBoxLayout) 上一节说了水平布局:https://blog.csdn.net/weixin_42837024/article/details/82114258 QVBoxLayout:在垂直的方向上排列控件 上下排列 QVBoxLayout* pLayout = new QVBoxLayout();//水平布局 QPushButton* p...
【QT入门】 Qt代码创建布局之水平布局、竖直布局详解
LF__plus的博客
03-25 1322
【QT入门】 Qt代码创建布局之水平布局、竖直布局详解
QT入门之布局 水平布局、垂直布局、表单布局、网格布局
llk15884975173的博客
09-17 1万+
1 简介 2 QVBoxLayout 垂直布局 QVBoxLayout 其中的 “V” 就是单词 vertical 的简写，垂直的意思，就是该布局中的组件都是垂直方向排列的。 简单示例： int main(int argc, char *argv[]) { QApplication a(argc, argv); Widget w; QVBoxLayout layout; QPushButton btn1("btn1",&w);//创建 3 个按钮 QPu
QT布局：实现动态布局
05-01
QT布局是Qt库中一种强大的功能，用于在用户界面上管理控件的排列和尺寸调整。在QT中，布局管理器能够自动调整控件的位置和大小，以适应窗口的变化，从而提供灵活...通过不断实践和学习，你将能更好地掌握QT布局的精髓。
Qt FlowLayout布局
02-23
与标准的Qt布局（如QVBoxLayout、QHBoxLayout和QGridLayout）不同，FlowLayout允许控件按照特定的方向（水平或垂直）流式排列，当空间不足时会自动换行。这种布局非常适合用于创建动态的、自适应大小的界面，例如...
QT 界面水平布局demo
02-27
例如，你可以在水平布局中添加一个垂直布局，形成一个复杂的网格布局。此外，布局的属性，如边距和间距，也可以通过`setMargin()`和`setSpacing()`方法进行调整，以满足不同设计需求。 在实际开发中，除了手动编写...
QtFlowlayout Qt流式布局器
02-01
QtFlowlayout是一个专门为Qt开发的自定义布局器，它扩展了Qt的标准布局系统，使得在QWidget容器中可以灵活地自动...对于想要深入理解和定制Qt布局的开发者来说，学习和使用QtFlowlayout的源代码将是一次有价值的体验。
Qt : 简单介绍五种界面布局方式！（非常简单）
weixin_49297121的博客
09-16 4826
Qt提供了方便快捷的界面布局方式，包括水平布局，垂直布局，网格布局，表单布局，以及分组布局的方式，避免了手动排布的繁琐，能够覆盖大部分设计需要；
Qt 水平布局（QHBoxLayout）
houxian1103的博客
02-27 1万+
Qt 水平布局（QHBoxLayout），QHBoxLayout: 在水平的方向上排列控件 左右排列。
Qt 代码实现页面布局 水平、垂直、网格
qq_43838261的博客
08-24 2875
QtCreator 可以使用ui对页面进行布局，但有时需求不方便创建单独的.h .cpp .ui文件，需要在代码中实现页面布局。最常见的布局为水平布局：QHBoxLayout、垂直布局：QVBoxLayout、网格布局：QGridLayout今天讲一下水平布局和垂直布局，网格布局后期补上。
QT的水平布局详解
qq_52137592的博客
05-09 833
水平布局（QHBoxLayout）有许多属性，这篇文章我们详细了解下这些属性都是怎么使用的。
垂直盒布局（VBoxLayout）
程序员的天堂
05-18 995
Ext.layout.VBoxLayout扩展自Ext.layout.BoxLayout，其xtype值为vbox。  主要配置项：      align：子元素在水平方式的对齐方式，可选值有left、center、stretch(水平伸展)、stretchmax，默认为left。      flex：垂直伸缩。将面板的body高减去不伸缩的子元素的高后剩余的高度等分成【flex和值】份，子元素伸...
【Qt】水平和垂直布局
C/C++软件工程师、嵌入式软件工程师、物联网研发工程师、C/C++讲师、物联网讲师、嵌入式讲师---欢迎大家一起交流(私信添加博主微信)
03-30 2882
00. 目录 文章目录00. 目录01. 概述02. 开发环境03. 水平布局常用方式04. 水平布局常用设置4.1 设置外边距4.2 设置间距4.3 添加伸缩空间4.4 添加控件4.5 设置布局方向4.6 设置拉伸系数05. 垂直布局06. 附录 01. 概述 QBoxLayout可以在水平方向或垂直方向上排列控件，由QHBoxLayout、QVBoxLayout所继承。 QHBoxLayout：水平布局，在水平方向上排列控件，即：左右排列。 QVBoxLayout：垂直布局，在垂直方向上排列控件，即：上
qt水平布局中添加垂直布局
04-13
在Qt中，您可以使用QVBoxLayout将垂直布局添加到水平布局中。具体步骤如下： 1. 创建水平布局对象：QHBoxLayout *hLayout = new QHBoxLayout; 2. 创建垂直布局对象：QVBoxLayout *vLayout = new QVBoxLayout; 3. ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

chenruhan_QAQ_

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值