Stylesheet problem with transparent background

Gazi

@Tink
Could you quickly suggest how the code should look like according to your best practice?
Thx

Tink

@Gazi well i think you just need to look at this: https://doc.qt.io/qt-6/stylesheet-examples.html#style-sheet-usage

Although in the documentation they suggest setting stylesheets on many widgets, but it might be hard to keep track of what influences what, Especially if you don't use an an ID Selector. And what if you need to make changes later...

Gazi

@Tink
I am trying different ways to use selectors or dynamic properties, but this whole stylesheet thing looks really really not stable. There are some very strange behaviors.

Is there any other way to style the widgets?

Thx

Ronel_qtmaster

@Gazi i already gave you the reason why you faced black widget.Check my answer above

Gazi

@Ronel_qtmaster

Well, i tried to give selectors for the 'home' and for the 'main_tabs'. The same issue holds.

import sys
from PySide6.QtWidgets import QApplication, QMainWindow, QSplitter, QTabWidget
from PySide6.QtGui import QPainter, QColor
from PySide6.QtCore import Qt

home_stylesheet = '''
        QWidget#home {background-color: red; color: green;}
        '''
main_tabs_stylesheet = '''
        QWidget#main_tabs {background-color: transparent; border: none;}
        QTabWidget#main_tabs {background-color: transparent; border: none;}
        QTabBar#main_tabs {background-color: transparent; border: none;}
        '''
        
# main_tabs widget
class main_tabs(QTabWidget):
    def __init__(self, parent = None):
        super().__init__(parent)
        self.setStyleSheet(main_tabs_stylesheet)
        self.setContentsMargins(0, 0, 0, 0)
        self.setObjectName('main_tabs')


# home widget
class home(QMainWindow):
    def __init__(self):
        super().__init__()
        self.showMaximized()
        self.init_ui()
        self.setStyleSheet(home_stylesheet)
        self.setObjectName('home')

        
    def init_ui(self):        
        splitter = QSplitter(parent = self)
        splitter.setHandleWidth(0)
        self.setCentralWidget(splitter)
        
        # Create a main tabs on the right
        self.tab_widget = main_tabs(parent = splitter)
        
        # Set stretch factors to ensure the drawer widget takes minimum space
        splitter.setStretchFactor(0, 1)  
            

if not QApplication.instance():
    app = QApplication(sys.argv)
else:
    app = QApplication.instance()

window = home()    
window.show()
sys.exit(app.exec())

I believe there is smth else going on here. I think there is some bug.

Ronel_qtmaster

@Gazi no you are doing it wrong.When you are seeting the stylesheet of TabWidget you do not need to add QWidget#main_tabs {background-color: transparent; border: none;} because it is affecting home_stylesheet instead

Gazi

@Ronel_qtmaster
But how to make it affect only main_tabs background?

Gazi

@Gazi said in Stylesheet problem with transparent background:

@Ronel_qtmaster
But how to make it affect only main_tabs background?

Even if i have them like that:

home_stylesheet = '''
        QWidget#home {background-color: green; color: green;}
        '''
main_tabs_stylesheet = '''
        QTabWidget#main_tabs {background-color: transparent; border: none;}
        '''

I still see a black background instead of a green one.

Tink

@Gazi i saw a post mentioning you have to set DocumentMode to true. This works for me.

ui->tabWidget->setDocumentMode(true);

QSplitter {background-color: red}
QTabWidget {background: transparent}

Gazi

@Tink
The documentMode seems to solve quite some issues. So, thanks a lot.

However, i believe there is still a bug somewhere related to the transparent backgrounds.

Thanks.