代码之家  ›  专栏  ›  技术社区  ›  titusjan

使用CSS更改QDocketWidget悬停标题栏的颜色

  •  9
  • titusjan  · 技术社区  · 7 年前

    我有一个GUI和一个 QDockwidget 我希望如果用户用鼠标光标悬停在dock窗口小部件的标题栏上,标题栏的颜色会改变。我在下面有一个小测试程序,当光标位于标题栏上方时,标题栏会改变颜色。但是,如果光标位于dock小部件的其余部分上方,它也会更改颜色。有办法解决这个问题吗?

    CSS = """
    
        QDockWidget::title {
            background-color: lightblue; 
            border: 1px solid black;
        }
    
        QDockWidget::title:hover {
            background: yellow;
        }
    
        QMainWindow::separator {
            background: palette(Midlight);
        }
    
        QMainWindow::separator:hover {
            background: palette(Mid);
        }
    """
    
    from PyQt5 import QtWidgets
    from PyQt5.QtCore import Qt, QSize
    
    class CenteredLabel(QtWidgets.QWidget):
    
        def __init__(self, text, parent=None):
            super().__init__(parent=parent)
            self.verLayout = QtWidgets.QVBoxLayout()
            self.setLayout(self.verLayout)
            self.horLayout = QtWidgets.QHBoxLayout()
            self.verLayout.addLayout(self.horLayout)
            self.label = QtWidgets.QLabel(text)
            self.horLayout.addWidget(self.label)
    
        def sizeHint(self):
            return QSize(300, 400)
    
    
    class MyWindow(QtWidgets.QMainWindow):
    
        def __init__(self, parent=None):
            super().__init__(parent=parent)
            self.setCentralWidget(CenteredLabel("Central Widget"))
            self.dockWidget = QtWidgets.QDockWidget("Dock Title", parent=self)
            self.dockWidget.setWidget(CenteredLabel("Dock Widget"))
            self.addDockWidget(Qt.LeftDockWidgetArea, self.dockWidget)
    
    
    def main():
        app = QtWidgets.QApplication([])
    
        # Fusion style is the default style on Linux
        app.setStyle(QtWidgets.QStyleFactory.create("fusion"))
        app.setStyleSheet(CSS)
    
        win = MyWindow()
        win.show()
        win.raise_()
        app.exec_()
    
    if __name__ == "__main__":
        main()
    

    fusion ,完全可通过选项板进行配置(不同于 macintosh 风格)。我更喜欢使用所有QT样式的解决方案,但是如果这是不可能的,我可以考虑将我的应用程序样式设置为 融合

    1 回复  |  直到 7 年前
        1
  •  2
  •   Isma    7 年前

    我尝试了你的代码,我可以重现同样的问题,对我来说这似乎是一个bug。

    以下是使用自定义小部件作为标题的可能解决方法:

    from PyQt5.QtWidgets import QLabel
    
    CSS = """
        #CustomTitle {
            background-color: lightblue; 
            border: 1px solid black;
        }
    
        #CustomTitle:hover {
            background: red;
        }
    
        QMainWindow::separator {
            background: palette(Midlight);
        }
    
        QMainWindow::separator:hover {
            background: palette(Mid);
        }
    """
    
    from PyQt5 import QtWidgets
    from PyQt5.QtCore import Qt, QSize
    
    class CenteredLabel(QtWidgets.QWidget):
    
        def __init__(self, text, parent=None):
            super().__init__(parent=parent)
            self.verLayout = QtWidgets.QVBoxLayout()
            self.setLayout(self.verLayout)
            self.horLayout = QtWidgets.QHBoxLayout()
            self.verLayout.addLayout(self.horLayout)
            self.label = QtWidgets.QLabel(text)
            self.horLayout.addWidget(self.label)
    
        def sizeHint(self):
            return QSize(300, 400)
    
    
    class MyWindow(QtWidgets.QMainWindow):
    
        def __init__(self, parent=None):
            super().__init__(parent=parent)
            self.setCentralWidget(CenteredLabel("Central Widget"))
            self.dockWidget = QtWidgets.QDockWidget(parent=self)
            self.dockWidget.setWidget(CenteredLabel("Dock Widget"))
            self.customTitle = QLabel("Dock Title", parent=self.dockWidget)
            self.customTitle.setObjectName("CustomTitle")
            self.dockWidget.setTitleBarWidget(self.customTitle)
            self.addDockWidget(Qt.LeftDockWidgetArea, self.dockWidget)
    
    
    def main():
        app = QtWidgets.QApplication([])
    
        # Fusion style is the default style on Linux
        app.setStyle(QtWidgets.QStyleFactory.create("fusion"))
        app.setStyleSheet(CSS)
    
        win = MyWindow()
        win.show()
        win.raise_()