2021-09-10 QTdesigner 介绍入门 布局

QTdesigner 介绍

Qt Designer，是一个直观可见的全方位 GUI 构造器，它所 设计出来的用户界面能够在多种平台上使用。它是 Qt SDK 的一部分，也是最为重要的开发 工具之一。利用 Qt Designer，我们可以拖放各种 Qt 控件构造图形用户界面，并可预览效 果（Ctrl+R）。
并用pyuic快速转换成py程序（定义主窗口以及其控件代码），进而快速进行界面开发。设计起来也更加方便清晰。
我也使用过HTML+CSS+JAVAScript设计网页的方式布局界面，但是布局是纯代码，程序代码量大。
入门教程：http://shouce.jb51.net/qt-beginning/

1.Widget控件

最左侧，Widget组件，可以从左侧的Widget Box中拖拽出诸如Button、View和Input等组件到中间的窗口中。

2.主窗口

可以预览设计的界面：

file>preview或者ctrl+R,

功能：
1、添加控件：从左侧的widget控件列表中选中需要的部件，拖到右侧的设计窗口上就可以了
2、复制控件：按住ctrl，鼠标点击要复制的控件，按住向外拉，就得到了复制的控件
3、删除控件：鼠标点击要删除的控件，右键删除或按delete键
4、选中多个控件：鼠标向外拉出一个矩形，覆盖要选中的控件，或者按住ctrl，依次点击要选中的控件
控件位置，大小等相关属性：详见属性编辑器和布局

3.对象查看器

右上角，窗口中所使用的组件，都在此处显示

4.属性编辑器

有从父类Widget继承而来的属性，也有自己控件独特的属性，比较方便。
常用的属性介绍：

名称	含义
objectName	控件对象名称
geometry	相应左上角为原点的坐标与宽和高（x,y）,x,y
sizePolicy	控件大小的策略
minimumSize	最小的宽和高
maximumSize	最大的宽和高
font	字体
cursor	光标
……	……

点击主窗口中的组件，可以在属性表中修改属性，名称名会在写py程序时用到。

5.资源浏览器

最右下角的部分，资源浏览器中可以添加相应地如图片素材，作为Label或Button等控件的背景图片等。

设计好界面后，这是主窗口和控件代码，查看代码你会发现，是个类，还需要编写函数来调用这个类

6.调用QT类的函数

通过创建QApplication对象来创建Qt窗口

import sys
from PyQt5.QtWidgets import QApplication, QMainWindow
from mainWindow import *
 
 
class MyWindow(QMainWindow, Ui_MainWindow):
    def __init__(self, parent=None):
        super(MyWindow, self).__init__(parent)
        self.setupUi(self)
 
 
if __name__ == '__main__':
    app = QApplication(sys.argv)
    myWin = MyWindow()
    myWin.show()
    sys.exit(app.exec_())

7 入门教程——布局管理

有从父类Widget继承而来的属性，也有自己控件独特的属性，比较方便。
不同布局方式可以嵌套；比如A是水平布局，B是垂直布局 ，可以选中AB在做一种布局方式；如下图

布局有三种方法：
1、现在左侧空间栏Layouts中的某种布局方式拖动到主窗口；再将组件拖入布局窗中；
2、先将组件拖入主窗中并选中；再点击工具栏中的某种布局方式，如下图。
3、先将组件拖入主窗中并选中；鼠标右键>布局,选择其中一种布局方式。

所有组件的布局完成之后，如下图红色框位置，顶层还未布局；选中顶层，然后对其进行布局。
可以进行水平、垂直、网格的任意一种（效果一样）。至此已经完成了所有布局，按CTRL+R预览的时候拉大窗口，所有组件会随着窗口的变化而变化。

这部分还没开始学，先参考：

PyQt5学习入门-3-Qt Designer布局：https://blog.csdn.net/qq_22238533/article/details/78952706
使用Qt Designer来设计界面：https://blog.csdn.net/a10929/article/details/78114261