Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. QStyleSheet not effecting some objects correctly
Forum Updated to NodeBB v4.3 + New Features

QStyleSheet not effecting some objects correctly

Scheduled Pinned Locked Moved Solved General and Desktop
5 Posts 2 Posters 1.5k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • NiagarerN Offline
    NiagarerN Offline
    Niagarer
    wrote on last edited by Niagarer
    #1

    Hi! I am surely missing something regular, anyway I can't find the mistake.
    I am doing this in my mainWindow class:

        qDebug().noquote()  << global << endl;
        qDebug().noquote()  << sheet << endl;
    
        centralWidget()->setStyleSheet( sheet );
        this->setStyleSheet( global );
    

    I load the stylesheets from text files.
    This is what the debugs print:

    background: #252525;
    color: #b1b1b1;  
    border-color: #2d8bed; 
    
    background: #252525;
    color: #b1b1b1;  
    border-color: #2d8bed;QGroupBox {                                                          
    	background-color: #303030;                                       
    	border: 0px solid #2d8bed;                                          
    	border-radius: 0px;                                              
    }QLineEdit, QPlainTextEdit{                                                           
    	background-color: #3f3f46;                                       
    	border: 1px solid rgba( 255, 255, 255, .3);                      
    	border-radius: 5px;                                              
    }QPushButton {
    	border: 2px solid #333333;
    	border-radius: 6px;
    	background-color: #161616;
    	min-width: 0px;
    	min-height: 20px;
    }
    
    QPushButton:pressed {
    	background-color: #404040;
    }
    QPushButton:checked {
    	color: #ffffff;
    	border: none;
    }QScrollArea{
    	border: 0px solid transparent;
    }QSplitter::handle {
    	background: qlineargradient(x1:0, y1:0, x2:1, y2:1,
    		stop:0 #3f3f46, stop:1 #3f3f46);
    	border: 1px solid #2d8bed;
    	width: 5px;
    	height: 5px;
    	margin-top: 2px;
    	margin-bottom: 2px;
    	border-radius: 4px;
    }QTabWidget::pane {
    	border: 0px solid black;
    } 
    

    But it doesn't work correctly. My ScrollAreas have a 1px solid gray border. My Groupboxes have a solid 1px white border. My tab widget has on the bottom side and on the right side a (round about) 4px solid white color and so on. My splitter handles are not even visible !?
    What's wrong? Didn't I set all that correctly in the stylesheet?
    Thanks for help!

    JonBJ 1 Reply Last reply
    0
    • NiagarerN Niagarer

      Hi! I am surely missing something regular, anyway I can't find the mistake.
      I am doing this in my mainWindow class:

          qDebug().noquote()  << global << endl;
          qDebug().noquote()  << sheet << endl;
      
          centralWidget()->setStyleSheet( sheet );
          this->setStyleSheet( global );
      

      I load the stylesheets from text files.
      This is what the debugs print:

      background: #252525;
      color: #b1b1b1;  
      border-color: #2d8bed; 
      
      background: #252525;
      color: #b1b1b1;  
      border-color: #2d8bed;QGroupBox {                                                          
      	background-color: #303030;                                       
      	border: 0px solid #2d8bed;                                          
      	border-radius: 0px;                                              
      }QLineEdit, QPlainTextEdit{                                                           
      	background-color: #3f3f46;                                       
      	border: 1px solid rgba( 255, 255, 255, .3);                      
      	border-radius: 5px;                                              
      }QPushButton {
      	border: 2px solid #333333;
      	border-radius: 6px;
      	background-color: #161616;
      	min-width: 0px;
      	min-height: 20px;
      }
      
      QPushButton:pressed {
      	background-color: #404040;
      }
      QPushButton:checked {
      	color: #ffffff;
      	border: none;
      }QScrollArea{
      	border: 0px solid transparent;
      }QSplitter::handle {
      	background: qlineargradient(x1:0, y1:0, x2:1, y2:1,
      		stop:0 #3f3f46, stop:1 #3f3f46);
      	border: 1px solid #2d8bed;
      	width: 5px;
      	height: 5px;
      	margin-top: 2px;
      	margin-bottom: 2px;
      	border-radius: 4px;
      }QTabWidget::pane {
      	border: 0px solid black;
      } 
      

      But it doesn't work correctly. My ScrollAreas have a 1px solid gray border. My Groupboxes have a solid 1px white border. My tab widget has on the bottom side and on the right side a (round about) 4px solid white color and so on. My splitter handles are not even visible !?
      What's wrong? Didn't I set all that correctly in the stylesheet?
      Thanks for help!

      JonBJ Online
      JonBJ Online
      JonB
      wrote on last edited by
      #2

      @Niagarer
      I don't know: would what you see be explained if neither stylesheet is being included/works? Or only if the sheet one is being included/works?

      It's not something I'm familiar with: are your 3 initial lines allows to be outside any rule, not enclosed in any {}s?

      NiagarerN 1 Reply Last reply
      1
      • JonBJ JonB

        @Niagarer
        I don't know: would what you see be explained if neither stylesheet is being included/works? Or only if the sheet one is being included/works?

        It's not something I'm familiar with: are your 3 initial lines allows to be outside any rule, not enclosed in any {}s?

        NiagarerN Offline
        NiagarerN Offline
        Niagarer
        wrote on last edited by Niagarer
        #3

        @JonB
        Uhm, those are just some mistakes, but (almost) everything else works and I get no errors, so the stylesheet is valid and being parsed correctly.
        Only these borders and stuff don't want to. Only using the sheet also doesn't solve the problem unfortunately...
        And from my experience: yes, writing stylesheet outside of {}s is legitim, then it just applies to everything lower in the hirarchy except it is set differently for specific widgets (with {}s)

        JonBJ 1 Reply Last reply
        1
        • NiagarerN Niagarer

          @JonB
          Uhm, those are just some mistakes, but (almost) everything else works and I get no errors, so the stylesheet is valid and being parsed correctly.
          Only these borders and stuff don't want to. Only using the sheet also doesn't solve the problem unfortunately...
          And from my experience: yes, writing stylesheet outside of {}s is legitim, then it just applies to everything lower in the hirarchy except it is set differently for specific widgets (with {}s)

          JonBJ Online
          JonBJ Online
          JonB
          wrote on last edited by
          #4

          @Niagarer
          Sorry, don't know then, but thanks for letting me know:

          And from my experience: yes, writing stylesheet outside of {}s is legitim, then it just applies to everything lower in the hirarchy except it is set differently for specific widgets (with {}s)

          NiagarerN 1 Reply Last reply
          0
          • JonBJ JonB

            @Niagarer
            Sorry, don't know then, but thanks for letting me know:

            And from my experience: yes, writing stylesheet outside of {}s is legitim, then it just applies to everything lower in the hirarchy except it is set differently for specific widgets (with {}s)

            NiagarerN Offline
            NiagarerN Offline
            Niagarer
            wrote on last edited by Niagarer
            #5

            @JonB
            Oh wait, I just figured out, you were actually right!!
            I took a look into the docs http://doc.qt.io/qt-5/stylesheet-syntax.html
            Universal Selector * Matches all widgets
            ...
            well... :D
            thanks man!
            making stuff outside of {}s is possile, I guess, but when I have all these others {}s, Qt seems to get problems with deciding what to use and then it uses nothing (f.ex. the border-color)
            So the following works perfectly well now:

            *{
            	background-color: #111111;
            	color: #9aacd1;  
            	border: 0px solid transparent;
            }
            QGroupBox {
            	background-color: #202020;
            	border: 0px solid #2d8bed;
            	border-radius: 0px;
            }
            QLineEdit, QPlainTextEdit{                                                           
            	background-color: transparent /*#3f3f46*/;                                       
            	border: 1px solid rgba( 255, 255, 255, .3);                      
            	border-radius: 5px;                                              
            }
            QPushButton {
            	border: 2px solid #333333;
            	border-radius: 6px;
            	background-color: #161616;
            	min-width: 0px;
            	min-height: 20px;
            }
            
            QPushButton:pressed {
            	background-color: #404040;
            }
            QPushButton:checked {
            	color: #ffffff;
            	border: none;
            }
            QScrollArea {
            	background-color: #202020;
            	border: 0px solid #2d8bed;
            	border-radius: 0px;
            }
            QScrollArea > QWidget > QWidget { background: transparent; } 
            /* because the QScrollArea has a content widget and I want the 
            background of also this contentwidget to be that background set. 
            so I tell the contentwidget to be transparent*/
            QSplitter::handle {
            	background-color: rgba(45, 139, 237, 200);
            	border: 1px solid #2d8bed;
            	width: 5px;
            	height: 5px;
            	margin-top: 2px;
            	margin-bottom: 2px;
            	border-radius: 4px;
            }
            QTabWidget::pane {
            	border: 0px solid black;
            	background-color: #202020;
            }
            QTabWidget {
            	border: 0px solid black;
            	background-color: #202020;
            }
            

            It also made a difference weather putting the global stuff (without {}s) at the beginning or at the end ot the qss. Can't say why, but it changed the result partially

            1 Reply Last reply
            1

            • Login

            • Login or register to search.
            • First post
              Last post
            0
            • Categories
            • Recent
            • Tags
            • Popular
            • Users
            • Groups
            • Search
            • Get Qt Extensions
            • Unsolved