界面设计和布局 - 白月黑羽 (byhy.net)https://www.byhy.net/py/qt/qt_03/结果是这样的
1. 打开 designer.exe，创建 Widget
也可以创建Main Window，这个带上面的菜单栏，这里我们不需要
2. 窗口分析
（一）、顶部键入网址发送区
这里我们带入布局，这一行肯定是水平布局 布局在左边栏中
对象：horizontalLayout 类：QHBoxLayout
布局完成后，往该布局内添加选择框、编辑框和按钮： （图中从左至右）
在菜单栏input widgets、与buttons中查找：
选择框：
对象：comboBox 类：QcomboBox
编辑框：
对象：lineEdit 类：QlineEdit
按钮：
对象：PushButton 类：QPushButton
将 **horizontalLayout **** **
**comboBox lineEdit PushButton** 依次拖入并调整大小
双击PushButton修改上面的文本
在图中 或者 在对象查看器中
选中 **horizontalLayout 可以调整 layoutStretch 的比例 ****调整 **选择框、编辑框、按钮的比列（这里明显，我们需要编辑框大一些，所以这里我填写的是1,3,1。默认为 0,0,0）
当然这里也可以调整**layoutSpacing **设置布局中控件之间的间距
亦可以调整布局中的其他属性
layoutBottomMargin属性用于设置布局的底部边距
layoutTopMargin属性用于设置布局的顶部边距
layoutLeftMargin属性用于设置布局的左边距
layoutRightMargin属性用于设置布局的右边距
**
layoutSizeConstraint**属性用于指定布局的大小约束。影响布局中控件的大小调整策略。
**
SetDefaultConstraint**: 默认设置，布局将根据控件的最小大小和最大大小来调整自身大小
**
SetFixedSize**: 布局的大小将被固定为其当前大小，无法自动调整。这通常用于需要精确控制布局大小的情况。
**
SetMinimumSize**: 布局将至少具有其最小大小，但可以根据内容的需要扩展。
**
SetMaximumSize**: 布局将最大限度地扩展到其最大尺寸，可能会限制内容的显示。
（二）、消息头区与消息体区
菜单栏layouts，新加入水平布局horizontalLayout，用来存放消息头和消息体的一大整块：
那么水平布局horizontalLayout_2就是消息头与消息体的整个大布局，拖入两个垂直布局verticalLayout、verticalLayout_2：
这时候有一个问题就是拖入第一个verticalLayout后，第二个垂直布局拖不进入，这时候我们不将其托进图形界面，而是拖入对象查看器的horizontalLayout_2父类下，下图所示
分别再往垂直布局verticalLayout、verticalLayout_2添加水平布局
在左侧垂直布局verticalLayout中拖入 label与两个button以及QtableWidgets
文本框：
对象：label 类：QLabel按钮（两个）：
对象：PushButton 类：QPushButton表格（显示和编辑数据）：
对象：table Widget
类：QTableWidgets
在右侧垂直布局中加入一个label与QtextEdit
文本框：
对象：label 类：QLabel文本编辑控件： 对象：textEdit 类：QTextEdit
这里注意布局！！！直接拖不进去图像界面 ，拖动控件至对象查看器的父类下
在垂直布局verticalLayout、verticalLayout_2之间添加line，line属于水平布局horizontalLayout_2
line ： 右控件栏中 Widget Box -> Display Widget -> Vertical Line
这时双击左侧垂直布局verticalLayout 中 table Widget ，操作如下
这样就大致完成 消息头区与消息体区 ，具体的布局可以调整属性中 大小 比列等
这里注意 添加布局后 是不能拖动改变里面控件大小，只能通过布局 控件 属性改变
（三）、响应区
使用QtextEdit随便拖动设置一个大小摆放好
文本编辑控件： 对象：textEdit 类：QTextEdit
（四）、底部清除按钮区
添加水平布局，在水平布局内加入Push Button
菜单栏layouts，新加入水平布局 horizontalLayout
按钮：
对象：PushButton 类：QPushButton
（五）、顶层全体布局
（这时每一小块布局完成，但整体控件还是不会适应窗口大小变化）
未布局之前 顶层Form 前面有一个红色禁止符号
在顶层Form 右击 选择 布局 -> 垂直布局 并调整大小 即可完成
（六）、修改对象名
在 对象查看器 中 双击 对象名 ，即可修改对象名称 方便其python代码中使用。修改后的如下
3. HTTP接口测试器完整代码
from PySide2.QtWidgets import QApplication
from PySide2.QtUiTools import QUiLoader
from PySide2.QtCore import QObject
from PySide2.QtGui import QIcon
import traceback
import requests
from threading import Thread
class HttpClient(QObject):
def __init__(self):
QObject.__init__(self)
# 从 UI 定义中动态 创建一个相应的窗口对象
self.ui = QUiLoader().load('httpclient.ui')
# 给 boxMethod 添加选项 GET POST PUT DELETE
self.ui.boxMethod.addItems(
['GET', 'POST', 'PUT', 'DELETE' ])
# 让 表格控件宽度随着父窗口的缩放自动缩放
self.ui.headersTable.horizontalHeader().setStretchLastSection(True)
# 设定第1列的宽度为 180像素
self.ui.headersTable.setColumnWidth(0, 180)
# 信号处理：发送请求
self.ui.buttonSend.clicked.connect(self.sendRequest)
# 信号处理：添加消息头
self.ui.buttonAddHeader.clicked.connect(self.addOneHeader)
# 信号处理：删除消息头
self.ui.buttonDelHeader.clicked.connect(self.delOneHeader)
def addOneHeader(self):
# rowCount = self.ui.headersTable.rowCount()
# 要插入的行始终是当前行 的下一行
addRowNumber = self.ui.headersTable.currentRow() + 1
self.ui.headersTable.insertRow(addRowNumber)
def delOneHeader(self):
self.ui.headersTable.removeRow(
self.ui.headersTable.currentRow()
)
def sendRequest(self):
method = self.ui.boxMethod.currentText()
url = self.ui.editUrl.text()
payload = self.ui.editBody.toPlainText()
# 获取消息头
headers = {}
ht = self.ui.headersTable
for row in range(ht.rowCount()):
k = ht.item(row,0).text()
v = ht.item(row,1).text()
if k.strip() == '':
continue
headers[k] = v
req = requests.Request(method,
url,
headers=headers,
data=payload
)
prepared = req.prepare()
self.pretty_print_request(prepared)
s = requests.Session()
# 多线程
thread = Thread(target=self.newThreadFunc,
args=(s, prepared)
)
thread.start()
def newThreadFunc(self,s,prepared):
try:
r = s.send(prepared)
self.pretty_print_response(r)
except:
self.ui.outputWindow.append(
traceback.format_exc())
def pretty_print_request(self,req):
if req.body == None:
msgBody = ''
else:
msgBody = req.body
self.ui.outputWindow.append(
'{}\n{}\n{}\n\n{}'.format(
'\n\n----------- 发送请求 -----------',
req.method + ' ' + req.url,
'\n'.join('{}: {}'.format(k, v) for k, v in req.headers.items()),
msgBody,
))
def pretty_print_response(self,res):
self.ui.outputWindow.append(
'{}\nHTTP/1.1 {}\n{}\n\n{}'.format(
'\n\n----------- 得到响应 -----------',
res.status_code,
'\n'.join('{}: {}'.format(k, v) for k, v in res.headers.items()),
res.text,
))
app = QApplication([])
# 加载 icon
app.setWindowIcon(QIcon('logo.jpg')) # 添加图标
httpClient = HttpClient()
httpClient.ui.show()
app.exec_()
4. 结果演示
5.一些问题
布局问题 ：在消息头窗口中，添加布局后会发现 文本框 和 两个按钮 暂居占据整个水平布局
但不希望按钮那么大，一个操作就是 修改 它们属性 大小 SizePolicy（水平策略 水平伸展等）
另一个操作就是在其中间加入 Spacers -> Horizontal Spacer 再选中布局 调整比例 （）
版权归原作者 Miss小乐 所有， 如有侵权，请联系我们删除。