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. How to use stylesheet colors in a custom QPushButton

How to use stylesheet colors in a custom QPushButton

Scheduled Pinned Locked Moved Solved General and Desktop
painteventqpushbuttonstyesheet
11 Posts 4 Posters 10.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.
  • V Offline
    V Offline
    VRonin
    wrote on 28 Apr 2016, 09:55 last edited by
    #2

    The paint event is always painful.
    Have you considered just using 4 QLabels child of the pushbutton layed out in a grid to achieve your goal?

    "La mort n'est rien, mais vivre vaincu et sans gloire, c'est mourir tous les jours"
    ~Napoleon Bonaparte

    On a crusade to banish setIndexWidget() from the holy land of Qt

    1 Reply Last reply
    0
    • _ Offline
      _ Offline
      _M_H_
      wrote on 28 Apr 2016, 11:21 last edited by
      #3

      Thanks for your answer.
      To use 4 QLabels could help, I will give it a try.
      Is there a posibility to read out the colors and other styles from a button to witch a stylesheet is asigned?

      QPushButton::setStyleSheet(QString("background-color: red ..."));
      

      To set the styles is very easy. But how can I read back the background-color in hovered state for example?
      QPushButton::getStyle(???);

      M 1 Reply Last reply 28 Apr 2016, 11:32
      0
      • _ _M_H_
        28 Apr 2016, 11:21

        Thanks for your answer.
        To use 4 QLabels could help, I will give it a try.
        Is there a posibility to read out the colors and other styles from a button to witch a stylesheet is asigned?

        QPushButton::setStyleSheet(QString("background-color: red ..."));
        

        To set the styles is very easy. But how can I read back the background-color in hovered state for example?
        QPushButton::getStyle(???);

        M Offline
        M Offline
        mrjj
        Lifetime Qt Champion
        wrote on 28 Apr 2016, 11:32 last edited by
        #4

        @_M_H_
        Hi
        there is styleSheet() which returns the stylesheet string.

        _ 1 Reply Last reply 28 Apr 2016, 11:37
        0
        • M mrjj
          28 Apr 2016, 11:32

          @_M_H_
          Hi
          there is styleSheet() which returns the stylesheet string.

          _ Offline
          _ Offline
          _M_H_
          wrote on 28 Apr 2016, 11:37 last edited by
          #5

          @mrjj
          You're right, but then I have to analyse the complete QString by hand. I'm looking for something like this:
          color = QPushButton.hover.background;

          M 1 Reply Last reply 28 Apr 2016, 11:42
          0
          • _ _M_H_
            28 Apr 2016, 11:37

            @mrjj
            You're right, but then I have to analyse the complete QString by hand. I'm looking for something like this:
            color = QPushButton.hover.background;

            M Offline
            M Offline
            mrjj
            Lifetime Qt Champion
            wrote on 28 Apr 2016, 11:42 last edited by mrjj
            #6

            @_M_H_
            as far as I know you cannot access the
            colors etc of the parsed Stylesheet.
            There is no API for it. (sadly)

            1 Reply Last reply
            0
            • _ Offline
              _ Offline
              _M_H_
              wrote on 28 Apr 2016, 11:49 last edited by
              #7

              Ok. Then I've also no chance to get the colors of the stylesheet inside the paintEvent. Am I right?
              If it does not work automatically, I've to search for an alternate solution.

              M 1 Reply Last reply 28 Apr 2016, 11:54
              0
              • _ _M_H_
                28 Apr 2016, 11:49

                Ok. Then I've also no chance to get the colors of the stylesheet inside the paintEvent. Am I right?
                If it does not work automatically, I've to search for an alternate solution.

                M Offline
                M Offline
                mrjj
                Lifetime Qt Champion
                wrote on 28 Apr 2016, 11:54 last edited by
                #8

                @_M_H_
                Af far as I know, no.
                It been ask on forum from time to time.
                I never saw a solution.

                1 Reply Last reply
                0
                • S Offline
                  S Offline
                  SGaist
                  Lifetime Qt Champion
                  wrote on 28 Apr 2016, 21:29 last edited by
                  #9

                  Hi,

                  Are you planning to let somebody change the style of that button ?

                  Interested in AI ? www.idiap.ch
                  Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

                  _ 1 Reply Last reply 29 Apr 2016, 05:46
                  0
                  • S SGaist
                    28 Apr 2016, 21:29

                    Hi,

                    Are you planning to let somebody change the style of that button ?

                    _ Offline
                    _ Offline
                    _M_H_
                    wrote on 29 Apr 2016, 05:46 last edited by
                    #10

                    @SGaist
                    Yes, I want to change the colors für hover, focus, pressed with a style sheet. This would be the prefered solution. If I didn't get it work I catch the mouse events and draw the colors as wanted. Changes are a little bit more complicated and not an easy exchange of the stylesheet. Do you have another idea how to solve this problem?
                    @VRonin
                    I tried your proposal with the 4 Labels in a grid. It is the same behaviour. The text color of the label has always the color specified in QLabel { color: blue; ...}. The Pseudo-States :hover, :focus, :pressed are ignored. The background-color of the state :hover is correct.

                    1 Reply Last reply
                    0
                    • _ _M_H_
                      28 Apr 2016, 07:36

                      Hi,
                      I want to create a custom style button. This button should have two lines of text with different font styles and alignments. The button should look like the following example:

                      |------------------------------------------------------|
                      | ICON | firstText bold left aligned                   |
                      | ICON |                      secondText right aligned |
                      |------------------------------------------------------|
                      

                      I've created a subclass of QPushButton and wanted to override the paintEvent. The problem is that not all colors defined in the stylesheet are used. (For details please refer to the comments in the code)
                      How can I draw the text for the differnt states (hover, focus, pressed) in the color stated in the stylesheet?

                      class SettingsButton : public QPushButton
                      {
                      	Q_OBJECT
                      public:
                      	explicit SettingsButton(QWidget *parent = 0);
                          void setText2(const QString &text1, const QString &text2);
                      	QString getText1();
                      	QString getText2();
                      
                      signals:
                      
                      public slots:
                      
                      protected:
                      	virtual void paintEvent(QPaintEvent *event) Q_DECL_OVERRIDE {
                      		QRect rect1(55,0,356,25);
                      		QRect rect2(55,25,356,25);
                      		QFont font;
                      
                      //        QPushButton::paintEvent(event); //If I use only this function, everything is displayed
                                                              //as in the normal paintEvent of the base class.
                                                              //The colors of the stylesheet are used for the normal button text,
                                                              //but not for my additional text.
                      
                              //Without the next 4 lines, no stylesheet colors are used.
                              //With these 4 lines, only some colors of the stylesheet are used.
                              //The background-colors of the following states are correct: Normal, Focus, Hover
                              //For the pressed state the background-color of the hover state is used.
                              //Text is always displayed in the color of the normal state.
                              QStyleOption opt;
                              opt.init(this);
                              QPainter p(this);
                              style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
                      
                      		QColor color;
                      		QPalette palette;
                      		palette = this->palette();
                              color = palette.color(QPalette::Normal, QPalette::ButtonText);
                      
                              //displays the correct stylesheet of the button
                              qDebug() << "Stylesheet " << this->styleSheet();
                              //Stylesheet
                              //"QPushButton {image: url(:/Resources/icon.svg); image-position: left; padding: 5px 5px; border: 0px; background-color: darkblue; color: yellow;}
                              //QPushButton:focus {image: url(:/Resources/icon.svg); border: 0px;  background-color: red; color: green;}
                              //QPushButton:hover {image: url(:/Resources/icon.svg); border: 0px;  background-color: blue; color: red;}
                              //QPushButton:pressed {image: url(:/Resources/icon.svg); border: 0px;  background-color: yellow; color: black;}"
                      
                              qDebug() << "Color " << color.red() << color.green() << color.blue();
                              //Color  255 255 0  --> yellow
                      
                              //Display additional text
                              //This text is only displayed in the color of the normal state (yellow)
                      		QPainter painter(this);
                      		painter.setRenderHint(QPainter::Antialiasing, true);
                      		font = painter.font();
                      		painter.setFont(QFont(font.family(), font.pointSize(), QFont::Bold));
                      		painter.drawText(rect1, Qt::AlignLeft|Qt::AlignVCenter, firstText);
                      		painter.setFont(QFont(font.family(), font.pointSize(), QFont::Normal));
                      		painter.drawText(rect2, Qt::AlignRight|Qt::AlignVCenter, secondText);
                      	}
                      
                      private:
                      	QString firstText;
                      	QString secondText;
                      };
                      

                      The *.cpp file:

                      SettingsButton::SettingsButton(QWidget *parent) :
                      	QPushButton(parent)
                      {
                      
                      }
                      
                      void SettingsButton::setText2(const QString &text1, const QString &text2) {
                      	firstText = text1;
                      	secondText = text2;
                      	update();	//Update the button
                      }
                      
                      QString SettingsButton::getText1() {
                      	return firstText;
                      }
                      
                      QString SettingsButton::getText2() {
                      	return secondText;
                      }
                      

                      Thanks in advance for your help.
                      Regards,
                      Michael

                      _ Offline
                      _ Offline
                      _M_H_
                      wrote on 29 Apr 2016, 09:52 last edited by
                      #11

                      Thanks to all for your help.
                      I didn't get it solved with stylesheets, but I found a solution which works for me:

                      class SettingsButton : public QPushButton
                      {
                          Q_OBJECT
                      public:
                          explicit SettingsButton(QWidget *parent = 0);
                          void setText2(const QString &text1, const QString &text2);
                          QString getText1();
                          QString getText2();
                      
                      signals:
                      
                      public slots:
                      
                      protected:
                          virtual void paintEvent(QPaintEvent *event) Q_DECL_OVERRIDE {
                              QRect rect1(55,0,356,25);
                              QRect rect2(55,25,356,25);
                              QFont font;
                      
                              QPushButton::paintEvent(event); //To draw everything of a normal QPushButton
                      
                              m_color = QColor(Qt::white);   //same as in stylesheet QPushButton (normal)
                              if( QWidget::hasFocus() ) {
                                  m_color = QColor(Qt::red);   //same as in stylesheet QPushButton:focus
                              }
                              if( QWidget::underMouse() ) {
                                  m_color = QColor(Qt::blue);    //same as in stylesheet QPushButton:hover
                              }
                              if( QPushButton::isDown() ) {
                                  m_color = QColor(Qt::green);   //same as in stylesheet QPushButton:pressed
                              }
                      
                              //Display additional text
                              QPainter painter(this);
                              painter.setRenderHint(QPainter::Antialiasing, true);
                              painter.setPen(m_color);
                              font = painter.font();
                              painter.setFont(QFont(font.family(), font.pointSize(), QFont::Bold));
                              painter.drawText(rect1, Qt::AlignLeft|Qt::AlignVCenter, firstText);
                              painter.setFont(QFont(font.family(), font.pointSize(), QFont::Normal));
                              painter.drawText(rect2, Qt::AlignRight|Qt::AlignVCenter, secondText);
                          }
                      
                      private:
                          QString firstText;
                          QString secondText;
                          QColor m_color;
                      };
                      
                      1 Reply Last reply
                      2

                      11/11

                      29 Apr 2016, 09:52

                      • Login

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