Qt——组件位置随窗口变化

当我们用Qt Designer设计界面时,有时会面临这样一个问题:需要在窗口指定位置放置组件,并且当窗口位置大小改变时,该组件相对其父对象的位置是不变的,如下面两幅图所示

,首先看上面这幅图,注意button的位置,我们想让button一直停留在该位置,我们刚开始做的可能是在designer中将button直接拖到该位置,编译运行后正是我们想要的结果,但是当我们拖动窗口,使窗口尺寸变化后,发现button位置改变了,如下面那副图所示。发生这种情况的原因很简单,直接拖放button到界面中,不加任何布局情况下,button的位置是相对于整个桌面不变的,而当窗口背景图变化时,两者自然而然的就不匹配了。

  解决这种问题的方法是将button加入到布局当中,我们知道布局共有3种方式:水平布局、垂直布局、棋盘布局;这三种布局方式都能够使组件在一定程度上保持其相对于父窗口的位置不变,但对于水平和垂直相对位置都要固定的问题来说,用棋盘布局无疑是相对方便的,棋盘布局即为QGridLayout,添加组件的代码大致如下:

    QGridLayout *layout=new QGridLayout;
    layout->addWidget(button1,0,0,5,10);//这里的参数是随意填写
   其中addwidget函数为void QGridLayout::addWidget (QWidget * widget, int fromRow, int fromColumn, int rowSpan, int columnSpan, Qt::Alignment alignment = 0 )
QGridLayout网上有许多资料,这里就不多介绍了。只说一下
addwidget函数的参数,fromRow为组件起始行,fromColumn为组件起始列,rowSpan为组件的所占行数,columnSpan为组件所占列数,alignment则为组件的对齐方式。
可通过调整addwidget中组件起始行列、所占行列来控制组件在整个窗口中所占的相对大小以及位置,并且能够实现组件的相互重叠。但是这种方式和我们想要的还不是完全相同,因为这样也不能
完全保证组件和背景图的某个位置完全对应,并且窗口布局中某个只存在一个组件时,该组件会占满窗口,这时就要用到按比例设定布局的方法,在designer中,通过改变布局对象中的layoutRowStretch和LayoutColumnStretch属性来设置,其中layoutRowStretch中“0”的个数对应共有几行组件,layoutColumnStretch中“0”的个数对应共有几列组件,“0”为最初的初始值,通过更改该值(百分比),控制不同位置的组件在整个窗口中的大小与位置。  在本文中,为了将button控制在指定位置,我们需要在button周边放置4个spacer,水平、垂直方向各两个,这样就可以将窗口分为3行3列,然后通过之前所说的layoutRowStretch和layoutCColumnStretch中对应值的大小,改变button的位置和大小。  这种方法如果用代码实现,示例:
        gridLayout->setRowStretch(0, 49);
        gridLayout->setRowStretch(1, 4);
        gridLayout->setRowStretch(2, 32);
        gridLayout->setColumnStretch(0, 38);
        gridLayout->setColumnStretch(1, 21);
        gridLayout->setColumnStretch(2, 8);
        gridLayout->setColumnStretch(3, 32);
setRowStretch()与setColumnStretch的使用就不多说了,manual中一看就会了。

时间: 2024-10-02 06:11:25

Qt——组件位置随窗口变化的相关文章

Qt组件中的双缓冲无闪烁绘图

双缓冲绘图在Qt4中,所有的窗口部件默认都使用双缓冲进行绘图.使用双缓冲,可以减轻绘制的闪烁感.在有些情况下,用户要关闭双缓冲,自己管理绘图.下面的语句设置了窗口部件的Qt::WA_PaintOnScreen属性 ,就关闭了窗口部件的双缓冲.mywidget->setAttribute(Qt::WA_PaintOnScreen); 由于Qt4不再提供异或笔,组合模式QPainter::CompostionMode_Xor()并不是异或笔,Qt4只提供了QRubberBand实现矩形和直线的绘图反

Android窗口管理服务WindowManagerService显示Activity组件的启动窗口(Starting Window)的过程分析

文章转载至CSDN社区罗升阳的安卓之旅,原文地址:http://blog.csdn.net/luoshengyang/article/details/8577789 在Android系统中,Activity组件在启动之后,并且在它的窗口显示出来之前,可以显示一个启动窗口.这个启动窗口可以看作是 Activity组件的预览窗口,是由WindowManagerService服务统一管理的,即由WindowManagerService服务负责 启动和结束.在本文中,我们就详细分析WindowManag

窗口变化相关消息 OnSize、OnSizing和OnGetMinMaxInfo

最近用到窗口变化的一些东西,遇到几个相关的消息函数,简要分析,作为备忘. 3个消息分别是:WM_SIZE.WM_SIZING.WM_GETMINMAXINFO:分别对应相应的处理函数:OnSize.OnSizing.OnGetMinMaxInfo. 当窗口大小发生变化时,响应的顺序依次是:WM_GETMINMAXINFO-->WM_SIZING-->WM_SIZE. OnGetMinMaxInfo 这个函数在窗口初始化的时候会被调用一次,当窗口大小发生改变的时候也会被调用.利用这个函数,可以比

CSS3+HTML5特效8 - 顶部和右侧固定,左侧随窗口变化的布局

原文:CSS3+HTML5特效8 - 顶部和右侧固定,左侧随窗口变化的布局 效果演示 实现原理 使用3个div(一个是顶部栏,一个是左侧栏,一个是右侧栏): 使用checkbox作为判断是否显示和隐藏右侧栏,点击显示和隐藏label实现最终效果. 代码说明 css + ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41

CSS布局:div高度随窗口变化而变化(BUG会有滚动条)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS布局:div高度随窗口变化而变化</

div高度随窗口变化而变化

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS布局:div高度随窗口变化而变化</

QT笔记之不规则窗口的实现

QT实现的不规则窗口,是根据图片的形状显示 1.去标题栏 2.设置窗口背景为透明色 3.最后给窗口设置背景色 注:背景图为镂空的 格式为.png 图片资源下载:http://pan.baidu.com/s/1i5JkIot .h 1 #ifndef QANORMALYDLG_H 2 #define QANORMALYDLG_H 3 4 #include <QWidget> 5 #include "ui_qanormalydlg.h" 6 7 class QAnormalyD

echarts使图标能自适应浏览器窗口变化,及经纬度转换

1.echarts使图标能自适应浏览器窗口变化 window.onresize = function () { myChart.resize(); //使第一个图表适应 myChart_pieMain.resize(); // 使第二个图表适应 } 2.map地图中经纬度与平面坐标转换 var arr = [117,36.4]; alert(myChart.chart.map.getPosByGeo("china",arr));  //map经纬度转成平面坐标 版权声明:本文为博主原创

实时监听组件中路由的变化

实时监听组件中路由的变化,通过watch来进行监听,当路由发生变化时,重新赋值,重新执行从后台获取数据的操作 watch: { '$route' (to, from) { this.listQuery.keywords=this.$route.query.keywords this.searchByKeywords() } }, methods: { searchByKeywords() { this.$store.dispatch('updateLoading', true) fetchSea