视觉图像界面设计【QT-creator高级编程 - 01】图像显如何保证跟随主窗口变化,且保留必要的设定窗口
前言:
问题,显示图像的时候,按最大窗口,图片窗口不跟着变大,还有,右边那些设置控件都没有动
解决:
步骤1:
1️⃣ 让
graphicsView
自动占满在 Qt Creator 中选中 graphicsView_7 / 12 / …
→ 属性面板 → Layout
→ 勾选:
✅
horizontalSizePolicy: Expanding
✅
verticalSizePolicy: Expanding
✅
sizeAdjustPolicy: AdjustToContents
步骤2:
让右侧控件区域自动收缩/拉伸
选中右侧 GroupBox(或整体布局)
→ 属性面板 → Layout
✅
horizontalSizePolicy: MinimumExpanding
✅
maximumSize
:宽度留空(或设大值)✅
layoutStretch
:左 1,右 0(左侧优先拉伸)
步骤3:
3.1 采用栅格布局配置
这种配置方式在窗体上我们采取右键去选择。然后这里面用栅格的方式。这种方式会自动将窗体上的控件拉伸到一个全屏的状态。这样就不会最大化的窗口控件变小的情况。这种方式比较适合于图形采样的界面。因为图形控件会自动的拉伸到最大,并且会和窗口的拉伸。而其他的一些配置控件,例如bottom则会保持原来的大小,这样的话就会将图形窗口最大化,并且随着主窗口的变化而变化。
不同拉伸的效果情况。
我们看到途径窗口被设置为最大的尺寸,并且随着窗口的变化而变化而巴特呢这些小的控件因为它本身不大,所以它的变化率会变小,这样的话有利于我们最大化图形窗口显示。
【案,这种方式比较简洁一点,大部分是系统自动调整大小,然后,比例大的控件,自然大一点,当然,如果要最大化图像显示,那么,可以用下面手动的方式进行约束】
【案,注意我的按键设定选择了固定大小】
3.1 采用手动配置布局的方式
全选所有控件(Ctrl+A)
右键 → Lay out → Lay out Vertically in Splitter(或 Lay out Horizontally in Splitter)
自动生成
QSplitter
,两边可拖动,比例自动保存。保存 → Ctrl+S →
.ui
文件立即更新。
【案,当然左侧也可设置为Fixed大小,就是不变化,这样就固定在左侧】
总体规划如下:
控件 | 属性 | 值 |
---|---|---|
graphicsView | sizePolicy | Expanding / Expanding |
graphicsView | minimumSize | 可留空(或设 100×100) |
右侧 GroupBox | sizePolicy | MinimumExpanding / Preferred |
右侧 GroupBox | maximumWidth | 留空(或设 400) |
整体 | layoutStretch | 1, 0 (左拉伸,右固定) |
配置GUI布局的应用:
在QT creator里面主要会生成下面两个文件,一个是form.ui的GUI界面布局文件,一个是由这个界面布局生成的GUI的控件的命名和位置的python的表达文件。ui_form.py
form.ui
ui_form.py (部分代码)
# -*- coding: utf-8 -*-################################################################################
## Form generated from reading UI file 'form.ui'
##
## Created by: Qt User Interface Compiler version 6.7.3
##
## WARNING! All changes made in this file will be lost when recompiling UI file!
################################################################################from PySide6.QtCore import (QCoreApplication, QDate, QDateTime, QLocale,QMetaObject, QObject, QPoint, QRect,QSize, QTime, QUrl, Qt)
from PySide6.QtGui import (QBrush, QColor, QConicalGradient, QCursor,QFont, QFontDatabase, QGradient, QIcon,QImage, QKeySequence, QLinearGradient, QPainter,QPalette, QPixmap, QRadialGradient, QTransform)
from PySide6.QtWidgets import (QAbstractItemView, QAbstractScrollArea, QApplication, QCheckBox,QFormLayout, QGraphicsView, QGridLayout, QGroupBox,QHBoxLayout, QLabel, QLineEdit, QListView,QListWidget, QListWidgetItem, QPushButton, QScrollBar,QSizePolicy, QSlider, QTabWidget, QVBoxLayout,QWidget)class Ui_Widget(object):def setupUi(self, Widget):if not Widget.objectName():Widget.setObjectName(u"Widget")Widget.setWindowModality(Qt.WindowModality.ApplicationModal)Widget.resize(1460, 1004)sizePolicy = QSizePolicy(QSizePolicy.Policy.Expanding, QSizePolicy.Policy.Expanding)sizePolicy.setHorizontalStretch(0)sizePolicy.setVerticalStretch(0)sizePolicy.setHeightForWidth(Widget.sizePolicy().hasHeightForWidth())Widget.setSizePolicy(sizePolicy)self.gridLayout_2 = QGridLayout(Widget)self.gridLayout_2.setObjectName(u"gridLayout_2")self.tabWidget = QTabWidget(Widget)self.tabWidget.setObjectName(u"tabWidget")self.tabWidget.setEnabled(True)self.tabWidget.setAutoFillBackground(False)self.tabWidget.setTabShape(QTabWidget.TabShape.Rounded)self.tabWidget.setElideMode(Qt.TextElideMode.ElideLeft)self.tabWidget.setUsesScrollButtons(True)self.tabWidget.setTabBarAutoHide(True)self.tab_7 = QWidget()self.tab_7.setObjectName(u"tab_7")sizePolicy.setHeightForWidth(self.tab_7.sizePolicy().hasHeightForWidth())self.tab_7.setSizePolicy(sizePolicy)self.formLayout_2 = QFormLayout(self.tab_7)self.formLayout_2.setObjectName(u"formLayout_2")self.groupBox_11 = QGroupBox(self.tab_7)self.groupBox_11.setObjectName(u"groupBox_11")sizePolicy1 = QSizePolicy(QSizePolicy.Policy.MinimumExpanding, QSizePolicy.Policy.MinimumExpanding)sizePolicy1.setHorizontalStretch(0)sizePolicy1.setVerticalStretch(0)sizePolicy1.setHeightForWidth(self.groupBox_11.sizePolicy().hasHeightForWidth())self.groupBox_11.setSizePolicy(sizePolicy1)self.gridLayout_4 = QGridLayout(self.groupBox_11)self.gridLayout_4.setObjectName(u"gridLayout_4")self.pushButton_22 = QPushButton(self.groupBox_11)self.pushButton_22.setObjectName(u"pushButton_22")font = QFont()font.setPointSize(12)self.pushButton_22.setFont(font)self.gridLayout_4.addWidget(self.pushButton_22, 0, 0, 1, 1)self.listWidget_2 = QListWidget(self.groupBox_11)self.listWidget_2.setObjectName(u"listWidget_2")self.gridLayout_4.addWidget(self.listWidget_2, 1, 0, 1, 3)self.pushButton_7 = QPushButton(self.groupBox_11)self.pushButton_7.setObjectName(u"pushButton_7")self.pushButton_7.setFont(font)self.gridLayout_4.addWidget(self.pushButton_7, 2, 0, 1, 1)self.pushButton_21 = QPushButton(self.groupBox_11)self.pushButton_21.setObjectName(u"pushButton_21")self.pushButton_21.setFont(font)self.gridLayout_4.addWidget(self.pushButton_21, 2, 1, 1, 2)self.pushButton_18 = QPushButton(self.groupBox_11)self.pushButton_18.setObjectName(u"pushButton_18")font1 = QFont()font1.setPointSize(16)self.pushButton_18.setFont(font1)self.gridLayout_4.addWidget(self.pushButton_18, 3, 0, 1, 1)self.pushButton_19 = QPushButton(self.groupBox_11)self.pushButton_19.setObjectName(u"pushButton_19")self.pushButton_19.setFont(font1)self.gridLayout_4.addWidget(self.pushButton_19, 3, 1, 1, 2)self.slider_expoTime = QSlider(self.groupBox_11)self.slider_expoTime.setObjectName(u"slider_expoTime")self.slider_expoTime.setValue(50)self.slider_expoTime.setOrientation(Qt.Orientation.Horizontal)self.gridLayout_4.addWidget(self.slider_expoTime, 4, 0, 1, 2)self.lab_expoTime = QLabel(self.groupBox_11)self.lab_expoTime.setObjectName(u"lab_expoTime")self.gridLayout_4.addWidget(self.lab_expoTime, 4, 2, 1, 1)self.horizontalSlider_6 = QSlider(self.groupBox_11)self.horizontalSlider_6.setObjectName(u"horizontalSlider_6")self.horizontalSlider_6.setValue(50)self.horizontalSlider_6.setOrientation(Qt.Orientation.Horizontal)self.gridLayout_4.addWidget(self.horizontalSlider_6, 5, 0, 1, 2)self.horizontalSlider_7 = QSlider(self.groupBox_11)self.horizontalSlider_7.setObjectName(u"horizontalSlider_7")self.horizontalSlider_7.setValue(50)self.horizontalSlider_7.setOrientation(Qt.Orientation.Horizontal)self.gridLayout_4.addWidget(self.horizontalSlider_7, 6, 0, 1, 2)self.horizontalSlider_8 = QSlider(self.groupBox_11)self.horizontalSlider_8.setObjectName(u"horizontalSlider_8")self.horizontalSlider_8.setValue(50)self.horizontalSlider_8.setOrientation(Qt.Orientation.Horizontal)self.gridLayout_4.addWidget(self.horizontalSlider_8, 7, 0, 1, 2)self.pushButton_20 = QPushButton(self.groupBox_11)self.pushButton_20.setObjectName(u"pushButton_20")self.pushButton_20.setFont(font1)self.gridLayout_4.addWidget(self.pushButton_20, 8, 0, 1, 3)self.pushButton_17 = QPushButton(self.groupBox_11)self.pushButton_17.setObjectName(u"pushButton_17")self.pushButton_17.setFont(font1)self.gridLayout_4.addWidget(self.pushButton_17, 9, 0, 1, 3)self.graphicsView_7 = QGraphicsView(self.groupBox_11)self.graphicsView_7.setObjectName(u"graphicsView_7")sizePolicy.setHeightForWidth(self.graphicsView_7.sizePolicy().hasHeightForWidth())self.graphicsView_7.setSizePolicy(sizePolicy)
ui_form.py 的生成方式,可以在QT Creator里面
当然,也可以,用一有的form.ui到pycharm里面去生成