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. Background color of QToolBox pages inside a QTabWidget in Windows 7

Background color of QToolBox pages inside a QTabWidget in Windows 7

Scheduled Pinned Locked Moved Solved General and Desktop
qtabwidgetqtoolboxwindows 7stylesheet
15 Posts 4 Posters 8.3k 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.
  • K kzarog

    @raven-worx Thanks!

    Well, I don't have a specific stylesheet, as I wish to be close to the platform defaults.

    I just use QtCreator to set the stylesheet for the QToolBox by adding (e.g. for white)

    backgound-color:white

    Is there a better way to do this?

    raven-worxR Offline
    raven-worxR Offline
    raven-worx
    Moderators
    wrote on last edited by
    #6

    @kzarog
    Then try the following stylesheet:

    QToolBox {
    background: transparent;
    }
    

    so it only gets applied to QToolBox instances, and not to the child widgets.

    --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
    If you have a question please use the forum so others can benefit from the solution in the future

    K 1 Reply Last reply
    0
    • raven-worxR raven-worx

      @kzarog
      Then try the following stylesheet:

      QToolBox {
      background: transparent;
      }
      

      so it only gets applied to QToolBox instances, and not to the child widgets.

      K Offline
      K Offline
      kzarog
      wrote on last edited by
      #7

      @raven-worx Hi again and thank you for your suggestion.

      Unfortunately your solution did not work when trying setting the stylesheet for QToolBox (background or background-color to transparent) or just the QWidget objects inside QToolBox.

      I keep getting the same result to the (QToolBox + transparent) portion of my uploaded image.

      raven-worxR 1 Reply Last reply
      0
      • K kzarog

        @raven-worx Hi again and thank you for your suggestion.

        Unfortunately your solution did not work when trying setting the stylesheet for QToolBox (background or background-color to transparent) or just the QWidget objects inside QToolBox.

        I keep getting the same result to the (QToolBox + transparent) portion of my uploaded image.

        raven-worxR Offline
        raven-worxR Offline
        raven-worx
        Moderators
        wrote on last edited by
        #8

        @kzarog
        In your screenshot the buttons also have a transparent background applied.
        When you correctly applied my stylesheet this cant happen for sure.
        Please show some code, especially where you set the stylesheet.

        --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
        If you have a question please use the forum so others can benefit from the solution in the future

        K 1 Reply Last reply
        0
        • raven-worxR raven-worx

          @kzarog
          In your screenshot the buttons also have a transparent background applied.
          When you correctly applied my stylesheet this cant happen for sure.
          Please show some code, especially where you set the stylesheet.

          K Offline
          K Offline
          kzarog
          wrote on last edited by kzarog
          #9

          @raven-worx Hi again,

          I have made a very simple dialog application to demonstrate the issue. The dialog was done in Designer and contains one QTabWidget that contains one QToolbox, whose first page has a QLineEdit and a QPushButton. The code follows:

          #include "dialog.h"
          #include "ui_dialog.h"
          
          Dialog::Dialog(QWidget *parent) :
          	QDialog(parent),
          	ui(new Ui::Dialog)
          {
          	ui->setupUi(this);
          
          	//	Stylesheet settings I have tried that result in the first dialog image
          	//this->setStyleSheet("QToolBox {background:transparent}");
          	//this->setStyleSheet("QToolBox {background-color:transparent}");
          	//ui->toolBox->setStyleSheet("QToolBox {background: transparent}");
          	//ui->toolBox->setStyleSheet("QToolBox {background-color: transparent}");
          
          	//	Stylesheet setting just for the QPushButton that results in the second dialog image
          	ui->toolBox->setStyleSheet("QPushButton {background:transparent}");
          }
          
          Dialog::~Dialog()
          {
          	delete ui;
          }
          

          The result from each of the commented lines (obviously, each line applied individually each time) gave me the first dialog shown in these two uploaded images.

          The uncommented stylesheet application (again, with only that line uncommented) works as intended for QPushButton. Also, using something like

          ui->toolBox->setStyleSheet("QWidget#lineEdit {background:transparent}");
          

          correctly applies a transparent background to just the QLineEdit element.

          QToolbox is just not conforming! Please let me know if I am doing things the wrong way.

          Thanks

          raven-worxR 1 Reply Last reply
          0
          • K kzarog

            @raven-worx Hi again,

            I have made a very simple dialog application to demonstrate the issue. The dialog was done in Designer and contains one QTabWidget that contains one QToolbox, whose first page has a QLineEdit and a QPushButton. The code follows:

            #include "dialog.h"
            #include "ui_dialog.h"
            
            Dialog::Dialog(QWidget *parent) :
            	QDialog(parent),
            	ui(new Ui::Dialog)
            {
            	ui->setupUi(this);
            
            	//	Stylesheet settings I have tried that result in the first dialog image
            	//this->setStyleSheet("QToolBox {background:transparent}");
            	//this->setStyleSheet("QToolBox {background-color:transparent}");
            	//ui->toolBox->setStyleSheet("QToolBox {background: transparent}");
            	//ui->toolBox->setStyleSheet("QToolBox {background-color: transparent}");
            
            	//	Stylesheet setting just for the QPushButton that results in the second dialog image
            	ui->toolBox->setStyleSheet("QPushButton {background:transparent}");
            }
            
            Dialog::~Dialog()
            {
            	delete ui;
            }
            

            The result from each of the commented lines (obviously, each line applied individually each time) gave me the first dialog shown in these two uploaded images.

            The uncommented stylesheet application (again, with only that line uncommented) works as intended for QPushButton. Also, using something like

            ui->toolBox->setStyleSheet("QWidget#lineEdit {background:transparent}");
            

            correctly applies a transparent background to just the QLineEdit element.

            QToolbox is just not conforming! Please let me know if I am doing things the wrong way.

            Thanks

            raven-worxR Offline
            raven-worxR Offline
            raven-worx
            Moderators
            wrote on last edited by
            #10

            @kzarog

            This styles makes the grey areas from your screenshot transparent:

            ui->toolBox->setStyleSheet(
            "QToolBox,"
            "QToolBox > *,"
            "QToolBox > QScrollArea > #qt_scrollarea_viewport > QWidget {"
            "background: transparent;"
             "}"
            );
            

            All the other widgets can then be styled as desired.

            --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
            If you have a question please use the forum so others can benefit from the solution in the future

            K 1 Reply Last reply
            0
            • raven-worxR raven-worx

              @kzarog

              This styles makes the grey areas from your screenshot transparent:

              ui->toolBox->setStyleSheet(
              "QToolBox,"
              "QToolBox > *,"
              "QToolBox > QScrollArea > #qt_scrollarea_viewport > QWidget {"
              "background: transparent;"
               "}"
              );
              

              All the other widgets can then be styled as desired.

              K Offline
              K Offline
              kzarog
              wrote on last edited by
              #11

              @raven-worx Thank you so much! Your suggestion (partially) worked! This is my output. I think I understand what the stylesheet does but as you can see the tab buttons ("Page 1" and "Page 2") also became transparent. I've tried to add something similar to

              QToolBox::tab {background: button;}
              

              to make them take the default normal color but adding something like that resets the whole stylesheet to what I was getting before. Any pointers are greatly appreciated!

              In any case, thank you for your great help! :)

              raven-worxR 1 Reply Last reply
              0
              • K kzarog

                @raven-worx Thank you so much! Your suggestion (partially) worked! This is my output. I think I understand what the stylesheet does but as you can see the tab buttons ("Page 1" and "Page 2") also became transparent. I've tried to add something similar to

                QToolBox::tab {background: button;}
                

                to make them take the default normal color but adding something like that resets the whole stylesheet to what I was getting before. Any pointers are greatly appreciated!

                In any case, thank you for your great help! :)

                raven-worxR Offline
                raven-worxR Offline
                raven-worx
                Moderators
                wrote on last edited by raven-worx
                #12

                @kzarog
                ok, then try this:

                "QToolBox,"
                "QToolBox > QScrollArea,"
                "QToolBox > QScrollArea > #qt_scrollarea_viewport,"
                "QToolBox > QScrollArea > #qt_scrollarea_viewport > QWidget {"
                "background: transparent;"
                 "}"
                

                i am not sure if the selector "QToolBox > QScrollArea > #qt_scrollarea_viewport" is really needed. I can't try it right now.

                --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
                If you have a question please use the forum so others can benefit from the solution in the future

                K 1 Reply Last reply
                0
                • raven-worxR raven-worx

                  @kzarog
                  ok, then try this:

                  "QToolBox,"
                  "QToolBox > QScrollArea,"
                  "QToolBox > QScrollArea > #qt_scrollarea_viewport,"
                  "QToolBox > QScrollArea > #qt_scrollarea_viewport > QWidget {"
                  "background: transparent;"
                   "}"
                  

                  i am not sure if the selector "QToolBox > QScrollArea > #qt_scrollarea_viewport" is really needed. I can't try it right now.

                  K Offline
                  K Offline
                  kzarog
                  wrote on last edited by kzarog
                  #13

                  @raven-worx Your second suggestion solved the problem and gave the desired result.

                  You were correct, the selector "QToolBox > QScrollArea > #qt_scrollarea_viewport" was not needed.

                  Thank you so much for your help!

                  1 Reply Last reply
                  0
                  • FranckynosF Offline
                    FranckynosF Offline
                    Franckynos
                    wrote on last edited by
                    #14

                    Hi, I want change icon of tab when one page is selected (arrow at right) and for the other arrow at bottom.
                    I think it's the same way to do this.

                    I tried :

                    QToolBox > QAbstractButton{
                    	background-image: url(:/icones/deleteRed);
                        image: url(:/icones/deleteRed);
                    }
                    

                    But nothing happend.

                    1 Reply Last reply
                    0
                    • M Offline
                      M Offline
                      MhmRhm
                      wrote on last edited by
                      #15

                      Do this for the widgets inside the ToolBox:

                      widget->setBackgroundRole(QPalette::Base);
                      
                      1 Reply Last reply
                      0

                      • Login

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