Python在pyqt5中创建一个真正的圆形按钮

时间:2018-01-16 22:15:22

标签: python pyqt pyqt5 qtoolbutton

我尝试创建一个圆形按钮,但实际上pyqt仍然会创建一个方形按钮。所有示例都只是创建方形按钮并在其中放置一个圆形图像但仍然当我尝试隐藏按钮的背景时它失败了。我也尝试添加一些悬停功能,但这应该在后面使用,所以你可以跳过它。我的代码在这里:

from PyQt5 import QtCore, QtGui, QtWidgets
from PyQt5.QtWidgets import QAction
from PyQt5.QtGui import QPalette
# from video import VideoWindow
import sys

class HoverButton(QtWidgets.QToolButton):

    def __init__(self, parent=None):
        super(HoverButton, self).__init__(parent)
        self.setMouseTracking(True)

    def enterEvent(self,event):
        # print("Enter")
        self.setStyleSheet('''   
                                 border-image: url("images/exit.jpg") 10 10 2 2;
                                 border-top: 10px transparent;
                                 border-bottom: 10px transparent;
                                 border-right: 2px transparent;
                                 border-left: 2px transparent''')
        self.setGeometry(QtCore.QRect(1100, 550, 160, 161))

    def leaveEvent(self,event):
        self.setStyleSheet('''  
                                 border-image: url("images/exit.jpg") 10 10 2 2;
                                 border-top: 10px transparent;
                                 border-bottom: 10px transparent;
                                 border-right: 2px transparent;
                                 border-left: 2px transparent''')
        self.setGeometry(QtCore.QRect(1100, 550, 140, 141))

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(1371, 924)
        MainWindow.setAcceptDrops(True)
        self.button =  HoverButton(self)
        self.button.setGeometry(QtCore.QRect(1100, 550, 140, 141)) 
        self.button.setStyleSheet('''background: transparent;
                                 border-image: url("images/exit.jpg") 3 10 3 10;
                                 border-top: 3px transparent;
                                 border-bottom: 3px transparent;
                                 border-right: 10px transparent;
                                 border-left: 10px transparent;
                                 ''')
        self.button.setObjectName('button')
if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()
    sys.exit(app.exec_())

输出: enter image description here

1 个答案:

答案 0 :(得分:2)

一种可能的解决方案是使用setMask(),此实现的优点是click事件仅适用于区域内的点。:

class HoverButton(QtWidgets.QToolButton):
    def __init__(self, parent=None):
        super(HoverButton, self).__init__(parent)
        self.setStyleSheet('''border-image: url("imagen.jpg")''')

    def resizeEvent(self, event):
        self.setMask(QtGui.QRegion(self.rect(), QtGui.QRegion.Ellipse))
        QtWidgets.QToolButton.resizeEvent(self, event)

在:

enter image description here

后:

enter image description here

在您的情况下,传递给QRect()的{​​{1}}必须根据图片的大小进行调整,因为圆形元素比图片小,因此更容易编辑图像制作方式这个圆圈完美地刻在你的图像中,就像我的形象一样。