Qt Widgets seen half transparent when using stylesheets

[codeslicer]

Hi,

I'm in a weird situation, which I'm not sure is a bug or not. Basically, I have a QMainWindow with a QTabWidget. The style sheet for the QMainWindow is:

QLabel {
color: rgb(227, 227, 227);
font: 75 10pt "Lucida Sans";
}
 
QMainWindow, QWidget#mywidgetWidget, QTabWidget, QWidget#tabGeneral, QWidget#tabPlugins {
	background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(43, 43, 43, 141), stop:0.497175 rgba(0, 0, 0, 147), stop:0.497326 rgba(0, 0, 0, 147), stop:1 rgba(90, 90, 90, 147));
}

QLabel {
color: rgb(227, 227, 227);
font: 75 10pt "Lucida Sans";
}

QMainWindow, QWidget#mywidgetWidget, QTabWidget, QWidget#tabGeneral, QWidget#tabPlugins {
	background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(43, 43, 43, 141), stop:0.497175 rgba(0, 0, 0, 147), stop:0.497326 rgba(0, 0, 0, 147), stop:1 rgba(90, 90, 90, 147));
}

To copy to clipboard, switch view to plain text mode 

While the style sheet for the QTabWidget is basically the example from the docs:

QTabWidget::pane { /* The tab widget frame */
	border-top: 2px solid #C2C7CB;
}
 
QTabWidget::tab-bar {
	left: 5px; /* move to the right by 5px */
}
 
/* Style the tab using the tab sub-control. Note that
it reads QTabBar _not_ QTabWidget */
QTabBar::tab {
	background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
							 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
							 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
	border: 2px solid #C4C4C3;
	border-bottom-color: #C2C7CB; /* same as the pane color */
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	min-width: 8ex;
	padding: 2px;
}
 
QTabBar::tab:selected, QTabBar::tab:hover {
	background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
							 stop: 0 #fafafa, stop: 0.4 #f4f4f4,
							 stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);
}
 
QTabBar::tab:selected {
	border-color: #9B9B9B;
	border-bottom-color: #C2C7CB; /* same as pane color */
}
 
QTabBar::tab:!selected {
	margin-top: 2px; /* make non-selected tabs look smaller */
}
 
/* make use of negative margins for overlapping tabs */
QTabBar::tab:selected {
	/* expand/overlap to the left and right by 4px */
	margin-left: -4px;
	margin-right: -4px;
}
 
QTabBar::tab:first:selected {
	margin-left: 0; /* the first selected tab has nothing to overlap with on the left */
}
 
QTabBar::tab:last:selected {
	margin-right: 0; /* the last selected tab has nothing to overlap with on the right */
}
 
QTabBar::tab:only-one {
	margin: 0; /* if there is only one tab, we don't want overlapping margins */
}

QTabWidget::pane { /* The tab widget frame */
	border-top: 2px solid #C2C7CB;
}

QTabWidget::tab-bar {
	left: 5px; /* move to the right by 5px */
}

/* Style the tab using the tab sub-control. Note that
it reads QTabBar _not_ QTabWidget */
QTabBar::tab {
	background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
							 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
							 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
	border: 2px solid #C4C4C3;
	border-bottom-color: #C2C7CB; /* same as the pane color */
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	min-width: 8ex;
	padding: 2px;
}

QTabBar::tab:selected, QTabBar::tab:hover {
	background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
							 stop: 0 #fafafa, stop: 0.4 #f4f4f4,
							 stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);
}

QTabBar::tab:selected {
	border-color: #9B9B9B;
	border-bottom-color: #C2C7CB; /* same as pane color */
}

QTabBar::tab:!selected {
	margin-top: 2px; /* make non-selected tabs look smaller */
}

/* make use of negative margins for overlapping tabs */
QTabBar::tab:selected {
	/* expand/overlap to the left and right by 4px */
	margin-left: -4px;
	margin-right: -4px;
}

QTabBar::tab:first:selected {
	margin-left: 0; /* the first selected tab has nothing to overlap with on the left */
}

QTabBar::tab:last:selected {
	margin-right: 0; /* the last selected tab has nothing to overlap with on the right */
}

QTabBar::tab:only-one {
	margin: 0; /* if there is only one tab, we don't want overlapping margins */
}

To copy to clipboard, switch view to plain text mode 

Basically, when I switch tabs, you can see a "ghost" of the old widgets very faintly. These ghosts disappear. This issue doesn't happen when I remove the stylesheet from the QTabWidget. Any feedback is appreciated.


Before.pngmywidget.uiAfter.png

[high_flyer]

Interesting.
In your style sheet you are using the alpha channel in your gradient, which you don't really need.
What happens if you remove the alpha channel, or sett it to 255?

[pan]

When you remove the stylesheet, it isn't white on black?
I wouldn't rule out the hardware. Looks like a little pixel burning, especially cause it is going away.
Have you got a LED screen to test it on? does is happen on all monitors? You might want to check it out, to rule out that possibility.

[stampede]

As high_flyer mentioned above, I would blame the alpha channel from this stylesheet:

QMainWindow, QWidget#mywidgetWidget, QTabWidget, QWidget#tabGeneral, QWidget#tabPlugins {
	background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(43, 43, 43, 141), stop:0.497175 rgba(0, 0, 0, 147), stop:0.497326 rgba(0, 0, 0, 147), stop:1 rgba(90, 90, 90, 147));
}

QMainWindow, QWidget#mywidgetWidget, QTabWidget, QWidget#tabGeneral, QWidget#tabPlugins {
	background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(43, 43, 43, 141), stop:0.497175 rgba(0, 0, 0, 147), stop:0.497326 rgba(0, 0, 0, 147), stop:1 rgba(90, 90, 90, 147));
}

To copy to clipboard, switch view to plain text mode 

Try replacing rgba with rgb ( and remove the fourth value in brackets as well ).

[SixDegrees]

Pixel burning wouldn't show up in a screen shot.

[pan]

Pixel burning wouldn't show up in a screen shot.

Very true.