PyQt5中如何动态排布QWidget：实现带删除按钮的股票标签自动换行滚动布局

方案整体结论 #

纯拖拽操作的Qt Designer无法直接实现自动适配宽度换行、超限自动滚动的标签排布效果，但外围界面（输入框、添加按钮等常规控件）完全可以在Qt Designer中快速搭建，仅需要补充少量自定义布局代码，就能完全匹配Stack Overflow风格的标签选择交互。

组件选型优化 #

不建议使用QFrame作为标签的承载容器，优先选用QScrollArea作为外层滚动容器：该控件原生支持内容超出可视范围时自动显示滚动条，无需额外编写滚动逻辑，刚好匹配多标签场景的交互需求，自定义排布逻辑的业务控件直接放置在QScrollArea的内部内容区即可。

核心实现逻辑 #

• 自定义流布局类替代默认的垂直/水平布局
  编写继承自QLayout的Flow Layout类，核心实现三个能力：
  • 固定所有标签组件的尺寸，排布过程中不对标签做缩放
  • 逐标签计算排布位置，当标签总宽度超出容器可用右边界时，自动换行开启新行
  • 实时计算所有标签占据的总高度，供外层QScrollArea判断是否需要触发垂直滚动
• 交互逻辑对接
  • 用户点击添加按钮时，直接实例化提前写好的带X删除按钮的标签组件，调用布局自带的addItem()方法加入容器即可，不需要手动计算组件位置
  • 标签上的X删除按钮触发点击时，直接调用布局的removeItem()方法移除对应组件，布局会自动重排剩余标签的位置
• 窗口尺寸适配
  在流布局中重写关联控件的resizeEvent事件，当窗口、容器宽度变化时自动触发全量重排，保证标签始终贴合当前容器宽度换行。

实现注意事项 #

• 不需要手动控制滚动条的显隐，QScrollArea会根据内部布局返回的总高度，自动判断是否需要显示垂直滚动条
• 标签之间的横向、纵向间距可在流布局初始化时配置，轻松对齐Stack Overflow标签选择器的间距视觉效果
• 除核心流布局类外，其余常规界面元素全部可以在Qt Designer中拖拽搭建，不需要全量手写UI代码

内容的提问来源于stack exchange，提问作者danbuza