[pyqt5] Custom controls to achieve scaling sub-controls that maintain the aspect ratio

需求

during window scaling,The control is scaled according to a certain aspect ratio

实现思路

1. 继承QFrame类, 重写resizeEvent方法

代码

from PyQt5 import QtCore, QtWidgets, QtGui
from PyQt5.QtWidgets import QFrame

class KeepRatioFrame(QFrame):
    def __init__(self, parent, flags=QtCore.Qt.WindowType.Widget) -> None:
        super().__init__(parent, flags)
        self.resize_init = False
        self.childWidget = None
        self.wh_ratio = 1

    def resizeEvent(self, event: QtGui.QResizeEvent) -> None:
        if not self.resize_init:
            self.resize_init = True
            # 获取子控件
            self.childWidget: QtWidgets.QLabel = self.findChild(QtWidgets.QLabel)
            # 计算uiInitial aspect ratio
            self.wh_ratio = self.childWidget.width() / self.childWidget.height()
        # 获取当前frame的宽和长
        frame_w, frame_h = event.size().width(), event.size().height()
        # frame宽度不够 以此来计算child的高度
        if frame_w / frame_h <= self.wh_ratio:
            child_w, child_h = frame_w, round(frame_w / self.wh_ratio)
            child_x, child_y = 0, round(frame_h/2 - child_h/2)
        # frame高度不够 以此来计算child的宽度 
        else:
            child_w, child_h = round(frame_h * self.wh_ratio), frame_h
            child_x, child_y = round(frame_w/2 - child_w/2), 0
        # Update child control position size
        self.childWidget.setGeometry(child_x, child_y, child_w, child_h)

2. 在qt designer里设计ui时使用framePromoted to the above custom class
The control that will maintain the aspect ratio（The initial length and width need to be set）Put that custom oneframe中（Don't add layouts）

小节

1. QResizeEventincoming event,可以通过event访问resieze前后的widget的size
   
2. findChildChild controls can be found
3. Pay attention to the controlgeometry属性的x,yis relative to the parent control
4. Mobile controls are availablesetGeometry(x, y, w, h)或者move(x, y)和resize(w, h)
5. 关于控件的geometry

包含Window Title的

• widget.x()、widget.y()
• widget.pos().x() 、widget.pos().y()
• widget.frameGeometry().width()、widget.frameGeometry().height()

不包含Window Title的(Client Area)

• widget.geometry()、
  -widget.geometry().x() 、widget.geometry().y()、widget.geometry().width()、widget.geometry().height()
• widget.width()、widget.height()