Problems aligning buttons in widget in pyqt5

Question

I've been trying to create a widget with image background and two buttons (cancel and ok) with image and push down/up effect, using pyqt5 GUI of python language, but I have two problem:

1 – I can't align the buttons in widget center

2 – The buttons events occur twice

Code:

import sys
from PyQt5 import QtGui
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
from PyQt5.QtCore import *

class PicButton(QAbstractButton):
    def __init__(self, pixmap, pixmap_pressed, id_button, parent=None):
        super(PicButton, self).__init__(parent)
        self.pixmap = pixmap
        self.pixmap_pressed = pixmap_pressed
        self.id_buton = id_button

        self.pressed.connect(self.update)
        self.released.connect(self.update)

    def paintEvent(self, event):
        if self.isDown():
            pix = self.pixmap_pressed
            print("botao pressionado: ", self.id_buton)
        else:
            pix = self.pixmap

        painter = QPainter(self)
        painter.drawPixmap(event.rect(), pix)

    def enterEvent(self, event):
        self.update()

    def leaveEvent(self, event):
        self.update()

    def sizeHint(self):
        return QSize(131, 82)


app = QApplication(sys.argv)
window = QWidget()
window.setGeometry(800, 450, 800, 450)

pixmap = QPixmap("background.png")
brush = QBrush(pixmap)
palette = QPalette()
palette.setBrush(QPalette.Background, brush)
window.setPalette(palette)

button1 = PicButton(QtGui.QPixmap("cancel_up.png"), QtGui.QPixmap("cancel_down.png"), "cancel")
button2 = PicButton(QtGui.QPixmap("ok_up.png"), QtGui.QPixmap("ok_down.png"), "ok")

layout = QHBoxLayout()
layout.addStretch(1)
layout.addWidget(button1)
layout.addWidget(button2)
layout.setAlignment(Qt.AlignCenter)

window.setLayout(layout)
window.show()

sys.exit(app.exec_())

Get images in link: https://www.filedropper.com/imagens

Can somebody please tell me what I'm doing wrong?

Answer 1

I can't align the buttons in widget center: If you have applied addStretch() before button1 so that it is symmetrical you must set another addStretch() after button2

The buttons events occur twice: QAbstractButton already calls the update method when you press the button so it is not necessary to connect pressed or released signals to the update() method or call it in the enterEvent() and leaveEvent() methods.

Considering the above the solution is:

import sys
from PyQt5 import QtCore, QtGui, QtWidgets

class PicButton(QtWidgets.QAbstractButton):
    def __init__(self, pixmap, pixmap_pressed, id_button, parent=None):
        super(PicButton, self).__init__(parent)
        self.pixmap = pixmap
        self.pixmap_pressed = pixmap_pressed
        self.id_buton = id_button

    def paintEvent(self, event):
        if self.isDown():
            pix = self.pixmap_pressed
            print("botao pressionado: ", self.id_buton)
        else:
            pix = self.pixmap

        painter = QtGui.QPainter(self)
        painter.drawPixmap(event.rect(), pix)

    def sizeHint(self):
        return QtCore.QSize(131, 82)

if __name__ == '__main__':

    app = QtWidgets.QApplication(sys.argv)
    window =QtWidgets. QWidget()
    window.setGeometry(800, 450, 800, 450)

    pixmap = QtGui.QPixmap("background.png")
    brush = QtGui.QBrush(pixmap)
    palette = QtGui.QPalette()
    palette.setBrush(QtGui.QPalette.Background, brush)
    window.setPalette(palette)

    button1 = PicButton(QtGui.QPixmap("cancel_up.png"), QtGui.QPixmap("cancel_down.png"), "cancel")
    button2 = PicButton(QtGui.QPixmap("ok_up.png"), QtGui.QPixmap("ok_down.png"), "ok")

    layout = QtWidgets.QHBoxLayout(window)
    layout.addStretch()
    layout.addWidget(button1)
    layout.addWidget(button2)
    layout.addStretch()
    window.show()
    sys.exit(app.exec_())