如何在PyQt6的QGridLayout中实现组件拖拽重排并修复消失问题

我已在QHBoxLayout中实现了拖拽重排组件的功能，代码如下：

from PyQt6.QtCore import QMimeData, Qt
from PyQt6.QtGui import QDrag, QPixmap
from PyQt6.QtWidgets import QApplication, QHBoxLayout, QToolButton, QWidget, QGridLayout


class DragButton(QToolButton):
    def mouseMoveEvent(self, e):
        if e.buttons() == Qt.MouseButton.LeftButton:
            drag = QDrag(self)
            mime = QMimeData()
            drag.setMimeData(mime)

            pixmap = QPixmap(self.size())
            self.render(pixmap)
            drag.setPixmap(pixmap)

            drag.exec(Qt.DropAction.MoveAction)


class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setAcceptDrops(True)

        self.blayout = QHBoxLayout()
        for l in ["A", "B", "C", "D"]:
            btn = DragButton(parent=self, text=l)
            self.blayout.addWidget(btn)

        self.setLayout(self.blayout)

    def dragEnterEvent(self, e):
        e.accept()


    def dropEvent(self, e):
        pos = e.position()
        widget = e.source()

        self.blayout.removeWidget(widget)


        for n in range(self.blayout.count()):
            # Get the widget at each index in turn.
            w = self.blayout.itemAt(n).widget()
        
            if pos.x() < w.x() + w.size().height() // 2:
                # We didn't drag past this widget.
                # insert to the top of it.
                break
        else:
            # We aren't on the left hand side of any widget,
            # so we're at the end. Increment 1 to insert after.
            n += 1

        self.blayout.insertWidget(n, widget)

        e.accept()

app = QApplication([])
w = Window()
w.show()

app.exec()

由于需要将组件的重排结果保存到字典中，我认为使用QGridLayout会更便于获取和更新组件的位置，因此尝试实现了QGridLayout版本的代码：

from PyQt6.QtCore import QMimeData, Qt
from PyQt6.QtGui import QDrag, QPixmap
from PyQt6.QtWidgets import QApplication, QGridLayout, QToolButton, QWidget

class DragButton(QToolButton):
    def mouseMoveEvent(self, e):
        if e.buttons() == Qt.MouseButton.LeftButton:
            drag = QDrag(self)
            mime = QMimeData()
            drag.setMimeData(mime)

            pixmap = QPixmap(self.size())
            self.render(pixmap)
            drag.setPixmap(pixmap)

            drag.exec(Qt.DropAction.MoveAction)

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setAcceptDrops(True)

        self.glayout = QGridLayout()
        for i, l in enumerate(["A", "B", "C", "D"]):
            btn = DragButton(parent=self, text=l)
            self.glayout.addWidget(btn, i, 0)  # Add buttons to column 0, different rows

        self.setLayout(self.glayout)

    def dragEnterEvent(self, e):
        e.accept()

    def dropEvent(self, e):
        pos = e.position().toPoint()  # Convert the position to a QPoint
        widget = e.source()

        # Get the original position
        for i in range(self.glayout.count()):
            w = self.glayout.itemAt(i).widget()
            if w == widget:
                original_row = i
                break

        self.glayout.removeWidget(widget)

        # Determine the new row based on drop position
        for n in range(self.glayout.count()):
            w = self.glayout.itemAt(n).widget()
            if pos.y() < w.y() + w.size().height() // 2:
                break
        else:
            n += 1

        # Shift widgets if necessary
        if n > original_row:
            for i in range(original_row, n):
                self.glayout.addWidget(self.glayout.itemAt(i).widget(), i, 0)
        else:
            for i in range(n, original_row):
                self.glayout.addWidget(self.glayout.itemAt(i).widget(), i + 1, 0)

        self.glayout.addWidget(widget, n, 0)

        e.accept()

app = QApplication([])
w = Window()
w.show()

app.exec()

该代码虽能部分运行，但组件经常会从网格中消失。请问该如何正确实现这一功能？或者我是否应该继续使用QHBoxLayout？

一、QGridLayout版本的问题分析与修复 #

你当前的QGridLayout代码存在几个核心问题：

• itemAt(i)索引与实际行号不匹配：itemAt()返回的是布局内项目的顺序索引，和网格的行号无直接关联，移除组件后索引会混乱，导致移位逻辑出错。
• 原始行号获取错误：用itemAt(i)的索引当作行号是完全错误的，需通过getItemPosition()获取组件在网格中的真实行号。
• 移位逻辑混乱：手动移动组件时未正确处理布局项目的实际位置，容易导致组件被覆盖或布局索引冲突。

修复后的QGridLayout版本代码：

from PyQt6.QtCore import QMimeData, Qt, QPoint
from PyQt6.QtGui import QDrag, QPixmap
from PyQt6.QtWidgets import QApplication, QGridLayout, QToolButton, QWidget

class DragButton(QToolButton):
    def mouseMoveEvent(self, e):
        if e.buttons() == Qt.MouseButton.LeftButton:
            drag = QDrag(self)
            mime = QMimeData()
            drag.setMimeData(mime)

            pixmap = QPixmap(self.size())
            self.render(pixmap)
            drag.setPixmap(pixmap)

            drag.exec(Qt.DropAction.MoveAction)

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setAcceptDrops(True)

        self.glayout = QGridLayout()
        self.buttons = []  # 用列表维护按钮顺序，避免依赖布局索引
        for i, l in enumerate(["A", "B", "C", "D"]):
            btn = DragButton(parent=self, text=l)
            self.buttons.append(btn)
            self.glayout.addWidget(btn, i, 0)

        self.setLayout(self.glayout)

    def dragEnterEvent(self, e):
        if e.source() in self.buttons:
            e.acceptProposedAction()

    def dropEvent(self, e):
        pos = e.position().toPoint()
        source_btn = e.source()
        if source_btn not in self.buttons:
            return

        # 获取原始行号
        original_row = -1
        for i in range(self.glayout.count()):
            item = self.glayout.itemAt(i)
            if item.widget() == source_btn:
                original_row, _, _, _ = self.glayout.getItemPosition(i)
                break

        # 从布局中移除按钮（不会删除组件）
        self.glayout.removeWidget(source_btn)

        # 确定目标行号
        target_row = len(self.buttons) - 1  # 默认放最后
        for btn in self.buttons:
            if btn == source_btn:
                continue
            btn_rect = btn.geometry()
            if pos.y() < btn_rect.top() + btn_rect.height() // 2:
                # 找到目标按钮对应的行号
                for i in range(self.glayout.count()):
                    item = self.glayout.itemAt(i)
                    if item.widget() == btn:
                        target_row, _, _, _ = self.glayout.getItemPosition(i)
                        break
                break

        # 重新排列按钮列表并更新布局
        self.buttons.remove(source_btn)
        self.buttons.insert(target_row, source_btn)

        # 清空布局后重新添加所有按钮，确保行号与列表索引匹配
        for i in reversed(range(self.glayout.count())):
            item = self.glayout.itemAt(i)
            if item.widget():
                self.glayout.removeWidget(item.widget())
        
        for idx, btn in enumerate(self.buttons):
            self.glayout.addWidget(btn, idx, 0)

        e.acceptProposedAction()

    def save_layout(self):
        # 将布局保存为{按钮文本: 行号}的字典
        return {btn.text(): idx for idx, btn in enumerate(self.buttons)}

app = QApplication([])
w = Window()
w.show()

# 示例：打印保存的布局
# print(w.save_layout())

app.exec()

修复要点： #

• 用独立列表self.buttons维护组件顺序，避免依赖布局的itemAt()索引
• 通过getItemPosition()获取组件的真实行号
• 重新排列时先清空布局再重新添加，确保布局行号与列表索引完全匹配
• 内置save_layout()方法直接生成位置字典，满足保存需求

二、继续使用QHBoxLayout并实现位置保存 #

其实你完全可以保留已经稳定运行的QHBoxLayout，只需添加一个简单的方法即可实现位置保存，无需改动拖拽逻辑：

# 在你的Window类中添加以下方法
def save_layout(self):
    layout_dict = {}
    for idx in range(self.blayout.count()):
        btn = self.blayout.itemAt(idx).widget()
        layout_dict[btn.text()] = idx
    return layout_dict

# 调用示例：
# print(w.save_layout())

优势： #

• 保留已验证的稳定拖拽逻辑，避免QGridLayout的布局索引问题
• 代码改动极小，维护成本低
• 保存位置的逻辑简单直接

结论 #

如果你的场景只是单列/单行的组件排列，强烈建议继续使用QHBoxLayout/VBoxLayout，这类线性布局的拖拽逻辑更简单稳定，且保存位置的需求完全可以通过遍历布局索引实现，无需更换为QGridLayout。

如果一定要用QGridLayout，务必通过独立列表维护组件顺序，不要依赖布局的itemAt()索引操作行号，避免组件消失或位置混乱的问题。

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