Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Change descendant QLabel properties on parent pseudo-state

I've read the documentation thoroughly and searched the familiar domains like google and stackoverflow for quite some time now. Unfortunately all this without any solutions to be found. So I'm hoping that someone out here might be my savior..

The Situation:

What I am using: PyQt4, Python 2.6, Windows 7

I'm trying to style a QLabel (using a CSS file which I import in my program). The QLabel is in a QListWidgetItem.

So the structure I have is as follows:

QListWidget
    +QListWidgetItem
        +QLabel

So according to the documentation the way to access the QLabel would be as follows. No problem here.

QListWidget::item QLabel
{
    background-color:#000
}

The Problem:

However, I would like the QLabel styling to ONLY change when I hover the QListWidgetItem. Using the following code, the pseudo-state just gets ignored for some reason. The background-color thus gets applied to the QLabels, but it isn't respecting the pseudo state.

QListWidget::item:hover QLabel
{
    background-color:#000
}

This situation persists when I run my application stand-alone.

What isn't the solution:

  • Setting the QLabel pseudo-state to hover won't work because the QListWidgetItem is taller than the QLabel.

Main Question:

Is there a way to change the style properties of the QLabel when, and only when, the QListWidgetItem is hovered and how can this be achieved?

The goal here is to do it ONLY through the css (or qss if you prefer), which is a separate file that gets imported into the program.

Sources:

qss documentation: http://doc.qt.digia.com/4.6/stylesheet-syntax.html

like image 625
NicoKNL Avatar asked Nov 11 '22 22:11

NicoKNL


1 Answers

You can't do this at least in Qt 4.7 (did not tested Qt5) here is good explanation: How to set color of child QLabels while hover parent QFrame with QSS?

it seems that Qt css does not support pseudo-states for descendant elements but original CSS does: http://codepen.io/anon/pen/olwHs

You should write some code to support such style. Use Enter/LeaveEvent to handle hover and then set style in your code via setStyleSheet()

You may also use dynamic property for that to leave styles in .ui QLabel[hover="true"] {} and then set and reset this value in code

Also you may use dynamic property for main widget [hover="true"] QLabel {}

like image 79
Brun Avatar answered Nov 15 '22 12:11

Brun