qtwidget窗⼝拉伸_QT中怎样使得控件与界⾯等⽐例变化之前的⼀篇可以算是前置知识的快速介绍。从这篇开始就是正式地编写应⽤了。
为了兼顾举举例⼦和真实性,选了这么⼀个应⽤:PQ笔记。基本的功能如下:
笔记⽀持富⽂本粘贴
按⽂件夹分类笔记
画出⼤概的样⼦
先来⼀个⼤概的设计图。
就是⼀个规规矩矩的三栏布局,左边是笔记本的⽬录树,中间是⽂档列表,右边是⽂档内容。这个只是现阶段的⼤概构思,最终做出来不⼀定是这样的,有可能在⼀些细节上会有所更改,但是整体界⾯⼏乎都可以定下来了。
打开ui_mainwindow.ui,从Containers⾥拉出三个Widget,分别命名为widgetLeft、widgetMiddle和widgetRight。这就是左中右三栏的容器。
在左边栏中拖⼊⼀个pushButton和⼀个treeView,分别对应设计图上的两个控件。注意,如果拖放位置正确(也就是QtDesigner知道你要将控件放进左边栏⾥⾯),你会看到左边栏widgetLeft会变暗了。
对着左边栏空⽩处点击右键,依次选择布局 -> 垂直布局。
可以看到控件⾮常听话地从上到下排列好了。这⾥为widget中的控件快速设定了⼀个布局,相当于告诉widget中的控件该如何显⽰⾃⼰。
注意,这个"布局"并不是widget中的属性,⽽是独⽴的另⼀个类QLayout及其⼦类的实例。在对象查看器中点选widgetLeft后在下⾯的属性编辑器中可以看到有⼀栏Layout,这个才是控件们服服帖帖的原因。只不过,当为⼀个widget选择了布局之后,QtDesigner⾃动给这个widget增加了⼀个布局,然后将widget⾥⾯的⼦控件加⼊到布局中,于是⼦控件们都知道应该如何显⽰了。
同理,在中间控件widgetMiddle中放⼊⼀个LineEdit和⼀个ListView,在右边控件widgetRight中放⼊TextEdit,并且设置好布局。
现在使⽤快捷键Ctrl + r预览,发现拉伸窗⼝的时候,⾥⾯的三栏控件没有任何反应,这可不是想要的效果。
注意整个窗⼝其实也是⼀个widget,同样需要为其设置布局。
再预览,出现⼀个新问题:三个栏不能各⾃调整⼤⼩。
要实现这个功能需要另外⼀种布局管理,分裂器(QSplitter)。分裂器允许元素调整各⾃的⼤⼩。
先打破布局。
按着ctrl选择三个分栏widget,注意是分栏widget,再在其中⼀个widget的空⽩处点击右键,在布局中可以看到有使⽤分裂器⽔平布局。
最后为窗⼝应⽤垂直布局就可以了。预览的时候当⿏标移动到分栏控件之间会发现可以调整⼤⼩了,同时调整窗⼝也能影响到三个分栏的⼤⼩。
从实际来说,调整窗⼝的⼤⼩的时候,更多是希望调整右边栏即⽂档显⽰栏的⼤⼩。
QSplitter还能设置⼀些细节。
到QSplitter的属性:
orientation,控件排列⽅向,⽔平还是垂直
opaqueResize,是否实时显⽰调整
handleWidth,调整条的宽度
childrenCollapsible,控件调整成过⼩时是否会隐藏
似乎没有什么可以⽤的。
然⽽,问题的解决⽅法却不在QSplitter上,⽽在其⼦组件上。
实际上,⼏乎所有的widget,都有⼀个sizePolicy的属性,⽽在此属性中,有⼦属性Horizontal Stretch和Vertical Stretch,对应中⽂⽔平伸展和垂直伸展,决定⽔平和垂直的缩放⽐例。
在属性编辑器中,可以看到⽔平伸展的值默认为0,也就是左栏:中栏:右栏 = 0:0:0,现在将右栏的⽔平伸展值设为1,也就是左栏:中栏:右栏 = 0:0:1。
预览⼀下,效果就出来了。
原理应该是这样的,在窗⼝缩放的时候,默认的配置是 0:0:0,表⽰变化被平均分配到两个组件上了。⽽修改后⼦组件们根据已经设定好的⽐例 0:0:1,所有的因窗⼝缩放⽽引起的⼤⼩变化全部被分配到⽂档编辑组件上了。
布局管理(Layout Management)
布局可以在Widget Box⾥⾯看到,提供的有四个布局:
Vertical Layout
Horizontal Layout
Grid Layout
一个单元格怎么分两栏Form Layout
分别是垂直布局、⽔平布局、⽹格布局和表单布局。当然还有另外的⾃动布局,但是这四个基本能满⾜普通需要。
垂直/⽔平布局不⽤解释了。⽹格布局是类似表格,⼀个控件占据⼀个单元格位置;表单布局是类似平常表单,从上到下排成多⾏,每⾏分两栏,左边放标签控件,右边放输⼊框控件。
菜单
在新建⼀个窗体的时候,QtDesigner就已经为窗体添加上了QMenuBar,在窗体的标题栏下⾯可以看到⼀个经典的菜单栏,上⾯有在这⾥输⼊字样。只要双击并填上你希望显⽰的菜单名字,QtDesigner
会⾃动⽣成⼀个菜单,在下拉列表上继续双击在这⾥输⼊将会⾃动⽣成QAction。QAction才是真正代表着菜单⾥的某个动作。
在下拉菜单⾥⾯,还能看到⼀个添加分隔符,是添加⼀个分割线的意思。当⽣成了⼀个QAction之后,可以看到右边有⼀个类似加号的图标,是将当前QAction转化为QMenu的意思,换句话说可以⽣成⼦级菜单。⼦级菜单的操作跟上⾯描述的菜单操作⼀模⼀样。
另外给各个action对象修改好名字,以供⽇后调⽤。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论