C++Qt学习布局管理——margin&padding、QHBoxLayout、QVBoxLayout、QGridLayout、QSplitter、QSpacer

最新推荐文章于 2024-06-23 22:13:14 发布
最新推荐文章于 2024-06-23 22:13:14 发布
阅读量3.9k 收藏 36
点赞数 89
文章标签： qt 学习 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wjl990316fddwjl/article/details/136602070
版权
本文详细介绍了C++Qt中的UI控件概念，包括margin（外边距）和padding（内边距）的设置，以及QHBoxLayout、QVBoxLayout、QGridLayout和QSplitter等布局管理器的使用方法和参数。读者将了解控件间间距、拉伸因子和大小策略如何影响UI设计。
摘要由CSDN通过智能技术生成

这一节主要是关于C++Qt学习的几个UI控件的学习，分别为：margin&padding（外边距&内边距）、QHBoxLayout(水平布局)、QVBoxLayout(垂直布局)、QGridLayout(网格布局)、QSplitter(分裂器）、QSpacer(隔离弹簧)

目录

1、margin&padding（外边距&内边距）

1.1、margin：一个控件的边框到另一个控件的边框的距离，属于容器外部距离。

1.2、padding：自身边框到自身内部另一个容器边框直接按的距离，属于容器内距离

2、QHBoxLayout（水平布局）

2.1、spacing：间隔距离

2.2、stretch：拉伸因子（系数）

2.3、sizePolicy：大小策略

3、QVBoxLayout(垂直布局)

4、GridLayout（网格布局）

4.1、行最小高度

4.2、行最小宽度

4.3、改变控件大小及位置

 5、QSplitter（分裂器）

5.1、opaqueResize

5.2 childrenCollapsible: 为true时，用户可以将子部件的大小调整为0 .

6、QSpacer(隔离弹簧)

1、sizetype

1、margin&padding（外边距&内边距）

A、新建项目，拖入一个Push Button

B、将Push Button的大小设置为800×480，与QWidget的大小一致

1.1、margin：一个控件的边框到另一个控件的边框的距离，属于容器外部距离。

A、选中按键，右键改变样式表，设置margin的值。

QPushButton{
	margin:50px;
}

发现改变的是QPushBUtton与QWidget的距离。

与以下代码表达的意思一致

QPushButton{
	margin-left:50px;
	margin-right:50px;
	margin-top:50px;
	margin-bottom:50px;
}

B、选中按键，右键改变样式表，设置margin的值。

QPushButton{
	margin-left:50px;
}

发现改变的是按键与QWidget左边的距离，同理其他方向

从而验证了：margin其实就是控件与空间之间的距离，外距离

1.2、padding：自身边框到自身内部另一个容器边框直接按的距离，属于容器内距离

A、border（描边距离），设置border的样式

QPushButton{
	margin: 50px;
	background-color: #CDCDB4;
	border-width: 50px;
	border-color: #458B00;
	border-style: solid;
}

B、将PushButton文字大小改成100

C、padding：也就是按钮文字到按钮边框之间的距离，可以发现文字往下移了50 个像素

D、设置成100px

2、QHBoxLayout（水平布局）

关于水平布局，主要有三个参数需要学习

spacing：间隔距离；

stretch：拉伸因子（系数）

sizePolicy：大小策略

A、打开UI，拖入三个控件

B、按住Ctrl，选中这三个控件，再点击水平布局

2.1、spacing：间隔距离

A、这里的LayoutSpacing就是间隔距离，改成20看一下效果

其实也就是控件之间的距离加大了

2.2、stretch：拉伸因子（系数）

改成1：1：5。发现其实也就是控件的大小比例，发生变化

A、运行发现，拖动窗口，控件并不跟着窗口大小变化而变化

解决办法：找到widget.cpp文件。添加以下代码

this->setLayout(ui->horizontalLayout_2);

B、拖动窗口，发现拖到一定程度的时候，控件大小一样，不是Strech设定的值

解决：是因为有缺省值，那么拉伸因子就不起作用了。可以调节这几个Margin

2.3、sizePolicy：大小策略

找到帮助文档，查看这几个的具体含义

A、Ignored，主要看这个，意思就是说缺省值可以忽略

那么，在拖动的时候，可以发现，第一个控件可以被折叠不见

B、看一下expanding

3、QVBoxLayout(垂直布局)

与水平布局，一样，不讲了

4、GridLayout（网格布局）

A、在UI界面拖一个网格布局，并拖动控件

发现格子大小不一样

B、先拖动控件，再点击栅格布局

4.1、行最小高度

4.2、行最小宽度

4.3、改变控件大小及位置

如果只是在UI界面里面拖动控件来改变大小，发现改变不了

A、最小大小

B、将控件放在中间，右键选中，选中居中

C、运行发现，拖动窗口，控件并不跟着窗口大小变化而变化

解决

 5、QSplitter（分裂器）

关于分裂器，主要学习下面这几个参数

orientation：设置方向，可设置水平或垂直方向。

opaqueResize: 为false时，在拖动的时候会显示一条灰色的线条，在拖动到位并释放鼠标后再显示分割线条。默认为true，实时更新子控件大小。

childrenCollapsible: 为true时，用户可以将子部件的大小调整为0 

A、打开UI，拖入两个widget，并且改变样式表

B、选中两个widget，点击使用分裂器水平布局或者垂直布局（主要看水平，垂直性质一样的）

C、发现不见了

将他托大就好了

D、发现可以拖动

E、但是会托不见了

F、将最小宽度改变一下

但是还是可以托不见，看5.2 

5.1、opaqueResize

找到opaqueResizesize为false时，在拖动的时候会显示一条灰色的线条，在拖动到位并释放鼠标后再显示分割线条。默认为true，实时更新子控件大小。

5.2 childrenCollapsible: 为true时，用户可以将子部件的大小调整为0 .

设置成False，就拖不动了

A、handlewidth，也就是中间的线宽

设置颜色

A、运行发现，拖动窗口，控件并不跟着窗口大小变化而变化

找一个水平布局，托进去

6、QSpacer(隔离弹簧)

关于隔离弹簧，主要学习下面这几个参数

orientation: 设置方向，可设置水平或垂直方向

sizeType: 大小类型，可以设置好几种，如固定大小，可扩大的等

sizeHint: 缺省大小，也就是默认大小

A、打开UI，在界面拖入水平布局，在水平布局里面拖入控件，并拖入隔离弹簧

B、设置布局

1、sizetype

A、设置成Fixed，固定大小

B、ignored，忽略缺省值大小

发现没有用，可以直接使用Fixed将宽度设为0，或者直接删掉弹簧即可

垂直弹簧和水平一样，不讲

樊家小丹丹
关注
  • 89
    点赞
  • 踩
  • 36
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
基于Qt/C++的学生成绩管理系统
01-03
使用Qt/C++实现界面化学生信息管理
qt中QVBoxLayout,QHBoxLayout布局中实现控件的动态加载与显示
10-09
在Qt编程中，布局管理是构建用户界面的关键部分，它帮助开发者有效地组织和调整控件在窗口中的位置和大小。本项目重点展示了如何在QVBoxLayout和QHBoxLayout布局中实现控件的动态加载与显示，这对于创建灵活且响应式...
QML 中 padding 和 margin 的区别
m0_60259116的博客
03-28 342
QML 中 padding 和 margin 的区别
Qt 布局 关于 margin padding border
最新发布
q610098308的专栏
06-23 232
Qt padding、margin、border 区别
Qt学习笔记（总）
壁立千仞无欲则刚的博客
02-01 1423
1、添加git版本控制 版本控制忽略清单： .DS_Store *-Debug *.user debug文件夹全部不要，可以运行时生成；.user文件包含用户配置，里面看了下还有绝对路径，这个还是不要把，在另一个地方首次打开只要配置下即可。 即可生成.user文件 2、创建桌面窗口应用的基类选择 基类有3个，那么都有什么区别？ (1)QMainWindow：提...
（QT）内外边距与布局
qq_57594025的博客
03-30 4642
一是一个包含四个整数值的对象，分别表示控件的左、上、右、下边框距离内部元素的距离。
Qt setContentsMargins()函数使用说明
琅嬛福地
02-12 1万+
函数原型： void QLayout::setContentsMargins(intleft， inttop， intright， intbottom) 作用： 设置左侧、顶部、右侧和底部边距，以便在布局周围使用。 如下图： ...
8.[QT | margin]margin的使用
ouhaha的博客
07-19 1970
例子 1 margin:10px 5px 15px 20px; 上外边距是 10px 右外边距是 5px 下外边距是 15px 左外边距是 20px 例子 2 margin:10px 5px 15px; 上外边距是 10px 右外边距和左外边距是 5px 下外边距是 15px 例子 3 margin:10px 5px; 上外边距和下外边距是 10px 右外边距和左外边距是 5px 例子 4 margin:10px; 所有 4 个外边距都是 10px ...
Qt---布局，设置控件边距，拉伸因子
新博客：https://aping-dev.com/
07-09 8871
控件所占空间QGridLayout *LeftLayout =new QGridLayout(this); LeftLayout->addWidget(label1, 0, 0); //label1在第1行第1列 LeftLayout->addWidget(label2, 0, 1); //label2在第1行第2列 LeftLayout->addWidget(btn1, 1
Qt的alignment、margin属性
zhang_ze1234的博客
01-21 3904
alignment介绍 Qt::Alignment alignment() const; // 获取对齐方式 void setAlignment(Qt::Alignment align); // 设置对齐方式 Qt::Alignment 类型取值 1）Qt::AlignLeft:：水平方向靠左。 2）Qt::AlignRight：水平方向靠右。 3）Qt::AlignHCenter：水平方向居中。 4）Qt::AlignJustify：水平方向调整间距两端对齐。
C++课程设计小项目：简易C++图书管理系统qt5.15工程源码，供课程设计，C++编程学习，项目设计学习使用。
03-31
布局管理器如QGridLayout、QVBoxLayout和QHBoxLayout用于排列和调整控件的位置。 9. **事件驱动编程**：Qt中的事件驱动模型使得用户界面能够响应用户的输入，例如点击按钮、输入文本等。通过重载槽函数，可以实现...
C++,QT多个窗体切换，widget 多个页面切换显示
09-11
有多种布局可供选择，如`QVBoxLayout`、`QHBoxLayout`、`QGridLayout`和`QFormLayout`，可以根据需要组合使用以满足不同界面的需求。 控件（`QWidgets`的子类）是构成界面的基本元素，如按钮、文本框、标签等。通过...
使用c++基于Qt框架开发高仿版win10任务管理器.zip
04-26
此外，Qt的布局管理器（如QVBoxLayout、QHBoxLayout和QGridLayout）可以帮助我们排列和对齐小部件，确保界面在不同分辨率的屏幕上都能适配。 在实现功能时，我们还需要用到文件I/O操作，例如保存和加载用户的配置。...
Qt setMargin()和setSpacing() 的含义
sunxiaopengsun的专栏
02-05 3447
mainLayout=newQVBoxLayout(this); mainLayout->setMargin(30); //表示控件与窗体的左右边距 mainLayout->setSpacing(40); //表示各个控件之间的上下间距 setBackgroundRole(QPalette::Dark); setAutoFillBackground(true
Qt布局设置边距
心向阳光，斗志昂扬！
06-15 3815
QWidget *pWgt0 = new QWidget(); QVBoxLayout *pLytV = new QVBoxLayout(); pLytV->setMargin(0);//设置外边距 pLytV->setSpacing(0);//设置内边距 pWgt0->setLayout(pLytV); 注意：默认边距为5。
Qt---Layout，设置控件边距，拉伸因子
u014683488的专栏
03-01 633
https://blog.csdn.net/u012319493/article/details/51866152
Qt布局管理(1)：部件拉伸原理及大小策略(sizePolicy)
热门推荐
黄邦勇帅的博客
10-11 4万+
Qt布局管理(1)：部件拉伸(Stretch)原理及大小策略 若对C++语法不熟悉可参阅《C++语法详解》一书，电子工业出版社 1、部件的大小策略sizePolicy、大小限制、拉伸因子(Stretch Factors)的含义 部件的大小策略、大小限制、拉伸因子从三个方面对布局内的部件怎样进行拉伸以填满布局进行了说明。 拉伸因子描述了各个部件在进行拉伸时，多个部件之间应以怎样的比例进行拉伸，比如把...
QT creator中 QGridlayout如何包含QHBoxlayout，用代码实现
06-08
在 Qt Creator 中，可以使用拖放操作将一个水平布局（QHBoxlayout）添加到网格布局（QGridlayout）中。如果您想使用代码实现此操作，可以参考以下示例代码： ```python import sys from PyQt5.QtWidgets import QApplication, QMainWindow, QGridLayout, QHBoxLayout, QPushButton, QWidget class MyWindow(QMainWindow): def __init__(self): super().__init__() # 创建一个QWidget，将其设置为主窗口的中心部件 centralWidget = QWidget(self) self.setCentralWidget(centralWidget) # 创建一个网格布局 gridLayout = QGridLayout() centralWidget.setLayout(gridLayout) # 创建一个水平布局，将其添加到网格布局中 hboxLayout = QHBoxLayout() gridLayout.addLayout(hboxLayout, 0, 0) # 向水平布局中添加两个按钮 button1 = QPushButton("Button 1") button2 = QPushButton("Button 2") hboxLayout.addWidget(button1) hboxLayout.addWidget(button2) if __name__ == "__main__": app = QApplication(sys.argv) window = MyWindow() window.show() sys.exit(app.exec_()) ``` 在这个示例中，我们创建了一个主窗口，将一个 QWidget 设置为其中心部件，并创建了一个网格布局。接着，我们创建了一个水平布局，将其添加到网格布局的第一行第一列。最后，我们向水平布局中添加了两个按钮。 使用 `addLayout()` 方法将水平布局添加到网格布局中。第一个参数是要添加的布局对象，第二个和第三个参数是布局要放置的网格单元格的行和列。在这个示例中，我们将水平布局放置在第一行第一列。 这样，我们就可以使用代码将一个水平布局添加到网格布局中了。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值