如何移动 QPushButton 中图标内的文本？

Question

我创建了带有 SVG 图标的自定义 PyQt5 按钮。我有可点击的六边形，里面有文字。但是，当我尝试将文本向左移动时，它被六边形隐藏了。

我试过使用填充将文本向左移动，但这只会隐藏文本。

HexButton 代码：

class HexButton(QPushButton):
    def __init__(self, colour, parent=None):
        super(QPushButton, self).__init__(parent)

        # Convert hexagon svg into image
        qimage = QtGui.QImage.fromData(self.svg_hexagon(colour))
        qicon = QtGui.QPixmap(qimage)
        # Set the icon as the hexagon
        self.setIcon(QtGui.QIcon(qicon))
        # Set icon size as the entire thing
        self.setIconSize(QSize(48, 48))
        # Make the button invisible
        self.setStyleSheet("""
        border: none;""")


    def svg_hexagon(self, colour):
        svg_bytes = f'<svg xmlns="http://www.w3.org/2000/svg" width="31" height="31"><path stroke="none" fill="{COLOURS[colour]}" d="M12.5 1.2320508075689a6 6 0 0 1 6 0l7.856406460551 4.5358983848622a6 6 0 0 1 3 5.1961524227066l0 9.0717967697245a6 6 0 0 1 -3 5.1961524227066l-7.856406460551 4.5358983848622a6 6 0 0 1 -6 0l-7.856406460551 -4.5358983848623a6 6 0 0 1 -3 -5.1961524227066l0 -9.0717967697245a6 6 0 0 1 3 -5.1961524227066"></path></svg>'
        return bytearray(svg_bytes, encoding='utf-8')

主应用程序

def main():

    app = QApplication(sys.argv)
    window = QWidget()
    layout = QHBoxLayout(window)

    button = HexButton("blank")
    button.setText("Nice")
    button.move(10, 10)
    layout.addWidget(button)

    window.show()
    sys.exit(app.exec_())

我希望有一个黄色的六边形，里面有文字。

Answer 1

不幸的是，图标和文字绘制在同一层上，图标绘制在文字之后，导致您指出的问题。考虑到上述情况，一个可能的解决方案是在按钮上方创建一个 QLabel：

from PyQt5 import QtCore, QtGui, QtWidgets


class HexButton(QtWidgets.QPushButton):
   def __init__(self, colour, parent=None):
       super(HexButton, self).__init__(parent)

       # Convert hexagon svg into image
       qimage = QtGui.QImage.fromData(self.svg_hexagon(colour))
       qicon = QtGui.QPixmap(qimage)
       # Set the icon as the hexagon
       self.setIcon(QtGui.QIcon(qicon))
       # Set icon size as the entire thing
       self.setIconSize(QtCore.QSize(48, 48))
       # Make the button invisible
       self.setStyleSheet(
           """
       border: none;"""
       )
       self.text_label = QtWidgets.QLabel()
       self.text_label.setContentsMargins(0, 0, 0, 0)
       self.text_label.setStyleSheet("""color : white;""")
       lay = QtWidgets.QVBoxLayout(self)
       lay.addWidget(self.text_label, alignment=QtCore.Qt.AlignCenter)

   def svg_hexagon(self, colour):
       svg_bytes = f'<svg xmlns="http://www.w3.org/2000/svg" width="31" height="31"><path stroke="none" fill="{colour.name()}" d="M12.5 1.2320508075689a6 6 0 0 1 6 0l7.856406460551 4.5358983848622a6 6 0 0 1 3 5.1961524227066l0 9.0717967697245a6 6 0 0 1 -3 5.1961524227066l-7.856406460551 4.5358983848622a6 6 0 0 1 -6 0l-7.856406460551 -4.5358983848623a6 6 0 0 1 -3 -5.1961524227066l0 -9.0717967697245a6 6 0 0 1 3 -5.1961524227066"></path></svg>'
       return bytearray(svg_bytes, encoding="utf-8")

   @property
   def text(self):
       return self.text_label.text()

   @text.setter
   def text(self, t):
       self.text_label.setText(t)


def main():
   import sys

   app = QtWidgets.QApplication(sys.argv)
   window = QtWidgets.QWidget()
   layout = QtWidgets.QHBoxLayout(window)

   button = HexButton(QtGui.QColor("black"))
   button.text = "Nice"
   layout.addWidget(button)

   window.show()
   sys.exit(app.exec_())


if __name__ == "__main__":
   main()

如何移动 QPushButton 中图标内的文本？

How do I move the text inside the icon in a QPushButton?

python

pyqt

python-3.x

qpushbutton

pyqt5