如何将pyqt5中的后退按钮和前进按钮添加到我的QGridLayout答案

【问题标题】：How do I add a back button and a forward button in pyqt5 to my QGridLayout如何将pyqt5中的后退按钮和前进按钮添加到我的QGridLayout
【发布时间】：2023-03-18 20:50:01
【问题描述】：

我在pyqt5中做了一个浏览器。它有一个搜索栏和一个按钮。我想添加一个后退按钮和一个前进按钮，就像普通浏览器中的按钮一样。你能不能也解释一下你是怎么加的，如果你加了，我以后可以加我自己的小部件：）这是我浏览器的图片

所以我想要搜索栏左侧的后退按钮和前进按钮。代码如下：

class StealthBrowser(QMainWindow):
    def __init__(self):
        super(StealthBrowser, self).__init__()
        self.setGeometry(200, 200, 1000, 700)
        self.setWindowTitle("StealthBrowser")
        self.search = QtWidgets.QPushButton("Search")
        self.textbox = QLineEdit()
        self.browser = QWebEngineView()
        self.backbutton = QtWidgets.QPushButton("Back")
        self.forwardbutton = QtWidgets.QPushButton("Front")
        self.initUI()

    def initUI(self):
        central_widget = QWidget()
        self.setCentralWidget(central_widget)
        lay = QGridLayout(central_widget)
        lay.addWidget(self.textbox, 0, 0)
        lay.addWidget(self.search, 0, 1)
        lay.addWidget(self.browser, 1, 0, 1, 2)
        self.search.clicked.connect(self.search_button_clicked)

【问题讨论】：

考虑到您实际上发布的代码与您的previous question 的答案中的代码相同，我建议您仔细阅读该代码，查找有关这些类的文档和functions它使用并耐心地研究它们。我们通常很乐意解释事情，但 StackOverflow 不是一个教程网站：首先，做你的本分并研究文档，然后自己做一些实验，最后来这里问任何问题你不明白。

标签： python pyqt5

【解决方案1】：

在这种情况下，您必须使用布局（在 SO 中，除了https://doc.qt.io/qt-5/layout.html 等官方示例外，还有数百个示例）。

您还必须使用 QWebEnginePage 的triggerAction() 方法来执行前进和后退操作。

class StealthBrowser(QMainWindow):
    def __init__(self):
        super(StealthBrowser, self).__init__()
        self.setGeometry(200, 200, 1000, 700)
        self.setWindowTitle("StealthBrowser")
        self.search = QtWidgets.QPushButton("Search")
        self.textbox = QLineEdit()
        self.browser = QWebEngineView()
        self.backbutton = QtWidgets.QPushButton("Back")
        self.forwardbutton = QtWidgets.QPushButton("Front")
        self.initUI()

    def initUI(self):
        central_widget = QWidget()
        self.setCentralWidget(central_widget)
        lay = QGridLayout(central_widget)
        lay.addWidget(self.backbutton, 0, 0)
        lay.addWidget(self.forwardbutton, 0, 1)
        lay.addWidget(self.textbox, 0, 2)
        lay.addWidget(self.search, 0, 3)
        lay.addWidget(self.browser, 1, 0, 1, 4)
        self.search.clicked.connect(self.search_button_clicked)
        self.backbutton.clicked.connect(self.backward)
        self.forwardbutton.clicked.connect(self.forward)

    def backward(self):
        self.browser.page().triggerAction(QWebEnginePage.Back)

    def forward(self):
        self.browser.page().triggerAction(QWebEnginePage.Forward)

注意：已经存在使用 Qt 的浏览器实现，因此您应该查看它作为示例：https://doc.qt.io/qt-5/qtwebengine-webenginewidgets-simplebrowser-example.html，它也是为 PySide2 编写的，因此转换为 PyQt5 很简单：https://code.qt.io/cgit/pyside/pyside-setup.git/tree/examples/webenginewidgets/simplebrowser/simplebrowser.py

【讨论】：

【解决方案2】：

您需要分别在 (0,0) 和 (0,1) 位置添加 self.backbutton 和 self.forwardbutton，并将所有其他小部件移到上方：

def initUI(self):
    central_widget = QWidget()
    self.setCentralWidget(central_widget)
    lay = QGridLayout(central_widget)
    lay.addWidget(self.backbutton, 0, 0)
    lay.addWidget(self.forwardbutton, 0, 1)
    lay.addWidget(self.textbox, 0, 2)
    lay.addWidget(self.search, 0, 3)
    # gridlayout is now 4 widgets wide, so the span of self.browser needs to be increased to 4
    lay.addWidget(self.browser, 1, 0, 1, 4)
    self.search.clicked.connect(self.search_button_clicked)

或者，您可以选择 QHBoxLayout 和 QVBoxLayout 的组合，这样您就可以添加小部件而无需指定它们在布局中的位置：

def initUI2(self):
    central_widget = QWidget()
    self.setCentralWidget(central_widget)

    # create horizontal layout and add buttons and line edit
    hlayout = QHBoxLayout()
    hlayout.setContentsMargins(0,0,0,0)
    hlayout.addWidget(self.backbutton)
    hlayout.addWidget(self.forwardbutton)
    hlayout.addWidget(self.textbox)
    hlayout.addWidget(self.search)

    # create vertical layout for central widget and add horizontal layout with buttons and the web engine view
    vlayout = QVBoxLayout(central_widget)
    vlayout.addLayout(hlayout)
    vlayout.addWidget(self.browser)
    self.search.clicked.connect(self.search_button_clicked)

【讨论】：