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. qtoolbutton/qpushbutton icon based on button's size
QtWS25 Last Chance

qtoolbutton/qpushbutton icon based on button's size

Scheduled Pinned Locked Moved Solved General and Desktop
21 Posts 2 Posters 8.6k 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.
  • U Offline
    U Offline
    user4592357
    wrote on 22 Dec 2018, 15:33 last edited by user4592357
    #1

    i have a QToolButton, on which i need to draw the patterns of QBrush styles. currently i draw everything on the pixmap, then create an icon from the pixmap, and set the icon to the button. then i add a lot of buttons to a grid layout. the problem with this approach is that when the layout is widened, the buttons stay the same size, so there's a lot of space between the buttons.

    i wanna change that so that buttons will shrink or widen with the changes to the layout.

    i guess the way to do that is with stylesheets. however, qt docs don't have much info with regards to that. this is what i found:

    Often, it is required to set a fill pattern similar to the styles in Qt::BrushStyle. You can use the background-color property for Qt::SolidPattern, Qt::RadialGradientPattern, Qt::LinearGradientPattern and Qt::ConicalGradientPattern. The other patterns are easily achieved by creating a background image that contains the pattern.
    
    Example:
    QLabel {
        background-image: url(dense6pattern.png);
        background-repeat: repeat-xy;
    }
    

    so this means i need to have a picture for every pattern i want to use? is this method how i should do that, or there's a better way i don't know about? thanks in advance.

    1 Reply Last reply
    0
    • M Offline
      M Offline
      mrjj
      Lifetime Qt Champion
      wrote on 22 Dec 2018, 15:56 last edited by
      #2

      @user4592357 said in qtoolbutton/qpushbutton icon based on button's size:

      i wanna change that so that buttons will shrink or widen with the changes to the layout.

      But normally buttons will use all space ?
      alt text

      What are you seeing ?

      Regarding the patterns.
      Do you mean you want to use the build in patterns on a button ?

      1 Reply Last reply
      0
      • U Offline
        U Offline
        user4592357
        wrote on 22 Dec 2018, 16:00 last edited by user4592357
        #3

        sorry, should've mentioned this (it's why my buttons can't use the available space). i use this code:

        setMinimumSize(width, height);
        setIconSize(QSize(width, height));
        

        i want to have the pictures of brush styles on the buttons. here's the current code:

        void PushButton::drawPattern(int width, int height, const QString &color, const QString &fillColor, int lineWidth, int pattern)
        {
            QPixmap pixmap(width, height);
            pixmap.fill(Qt::transparent);
        
            QColor bgColor(color);
        
            QPainter painter(&pixmap);
            painter.setBrush(bgColor);
            painter.setPen(Qt::NoPen);
        
            // Draw the rectangle
            QRect pixmapRect(1, 1, width, height);
            painter.drawRect(pixmapRect);
        
            QBrush patternBrush;
            patternBrush.setColor(fillColor); 
            patternBrush.setTexture(get_pixmap(pattern));
            painter.setBrush(patternBrush);
        
            // Draw the rectangle
            painter.drawRect(pixmapRect);
        
            if (lineWidth)
            {
                QPen patternPen;
                patternPen.setCapStyle(Qt::SquareCap);
                patternPen.setJoinStyle(Qt::MiterJoin);
        
                // Draw the outline
                patternPen.setColor(lineColor);
        
                painter.setBrush(Qt::NoBrush);
                patternPen.setWidth(lineWidth);
        
                painter.setPen(patternPen);
                painter.drawRect(pixmapRect);
            }
        
            QIcon icon(pixmap);
            setIcon(icon);
        }
        
        M 1 Reply Last reply 22 Dec 2018, 16:07
        0
        • U user4592357
          22 Dec 2018, 16:00

          sorry, should've mentioned this (it's why my buttons can't use the available space). i use this code:

          setMinimumSize(width, height);
          setIconSize(QSize(width, height));
          

          i want to have the pictures of brush styles on the buttons. here's the current code:

          void PushButton::drawPattern(int width, int height, const QString &color, const QString &fillColor, int lineWidth, int pattern)
          {
              QPixmap pixmap(width, height);
              pixmap.fill(Qt::transparent);
          
              QColor bgColor(color);
          
              QPainter painter(&pixmap);
              painter.setBrush(bgColor);
              painter.setPen(Qt::NoPen);
          
              // Draw the rectangle
              QRect pixmapRect(1, 1, width, height);
              painter.drawRect(pixmapRect);
          
              QBrush patternBrush;
              patternBrush.setColor(fillColor); 
              patternBrush.setTexture(get_pixmap(pattern));
              painter.setBrush(patternBrush);
          
              // Draw the rectangle
              painter.drawRect(pixmapRect);
          
              if (lineWidth)
              {
                  QPen patternPen;
                  patternPen.setCapStyle(Qt::SquareCap);
                  patternPen.setJoinStyle(Qt::MiterJoin);
          
                  // Draw the outline
                  patternPen.setColor(lineColor);
          
                  painter.setBrush(Qt::NoBrush);
                  patternPen.setWidth(lineWidth);
          
                  painter.setPen(patternPen);
                  painter.drawRect(pixmapRect);
              }
          
              QIcon icon(pixmap);
              setIcon(icon);
          }
          
          M Offline
          M Offline
          mrjj
          Lifetime Qt Champion
          wrote on 22 Dec 2018, 16:07 last edited by
          #4

          @user4592357
          Hi
          That sets only min size, not sure how that prevents from using all of the space?

          Ah so you want entire button to be the icon/pattern and no text and other button-ish features?
          I wonder why not simply draw it directly then ? (in paint event)
          you seems to have a custom, class already ? (PushButton)
          You could use dynamic properties to specify
          color, fillColor, lineWidth, pattern
          (so you can set in Designer if you need)
          and use promotion to use your custom button directly in Designer.

          Maybe i misunderstand the actual issue ?
          Could you show image of what you have ?

          1 Reply Last reply
          0
          • U Offline
            U Offline
            user4592357
            wrote on 22 Dec 2018, 16:30 last edited by
            #5

            @mrjj

            yes i want the whole button to be the pattern, no matter what size the button is.
            this is what i have now: https://ibb.co/FWmbDZX

            M 1 Reply Last reply 22 Dec 2018, 16:35
            0
            • U user4592357
              22 Dec 2018, 16:30

              @mrjj

              yes i want the whole button to be the pattern, no matter what size the button is.
              this is what i have now: https://ibb.co/FWmbDZX

              M Offline
              M Offline
              mrjj
              Lifetime Qt Champion
              wrote on 22 Dec 2018, 16:35 last edited by mrjj
              #6

              @user4592357
              ah, im an idiot :)
              You said tool button.
              They come with fixed SizePoliy
              alt text
              Just change to Preferred and they take all space.

              1 Reply Last reply
              1
              • U Offline
                U Offline
                user4592357
                wrote on 22 Dec 2018, 16:45 last edited by
                #7

                yes, that did. but now the "icons" aren't drawn on the buttons, but rather behind them (i could hardly see them, i saw a part of the icon behind the button).

                M 1 Reply Last reply 22 Dec 2018, 16:49
                0
                • U user4592357
                  22 Dec 2018, 16:45

                  yes, that did. but now the "icons" aren't drawn on the buttons, but rather behind them (i could hardly see them, i saw a part of the icon behind the button).

                  M Offline
                  M Offline
                  mrjj
                  Lifetime Qt Champion
                  wrote on 22 Dec 2018, 16:49 last edited by
                  #8

                  @user4592357
                  Can you show that effect ?
                  It wont scale the icon, but keep the size to IconSize.
                  Why dont just paint it directly ? ( inherit ToolButton and implement paintEvent )

                  1 Reply Last reply
                  0
                  • M Offline
                    M Offline
                    mrjj
                    Lifetime Qt Champion
                    wrote on 22 Dec 2018, 17:06 last edited by mrjj
                    #9

                    Hi
                    Like
                    alt text

                    with a small custom class.
                    Test project
                    https://www.dropbox.com/s/62flul5h8aa5shj/PatternButton.zip?dl=0

                    How do you determine the pattern it should use ?
                    I just used variables inside, but if you generate the buttons you could just give
                    as parameters.

                    1 Reply Last reply
                    2
                    • U Offline
                      U Offline
                      user4592357
                      wrote on 22 Dec 2018, 17:28 last edited by user4592357
                      #10

                      oh, the problem was that i was calling QToolButton::paintEvent(event); in the end.
                      without it the patterns are being drawn.
                      but if i don't call it, well, my button isn't a button and cannot be pressed, etc.

                      M 1 Reply Last reply 22 Dec 2018, 17:41
                      0
                      • U user4592357
                        22 Dec 2018, 17:28

                        oh, the problem was that i was calling QToolButton::paintEvent(event); in the end.
                        without it the patterns are being drawn.
                        but if i don't call it, well, my button isn't a button and cannot be pressed, etc.

                        M Offline
                        M Offline
                        mrjj
                        Lifetime Qt Champion
                        wrote on 22 Dec 2018, 17:41 last edited by mrjj
                        #11

                        @user4592357
                        If you dont call QToolButton::paintEvent(event), the button
                        can still be pressed but it wont draw the effect.
                        But will send signal though.

                        You can just do it revers
                        call QToolButton::paintEvent(event) in top
                        then draw pattern with slightly smaller rect on top of what already drawn.
                        (i assume you need no texts)

                        1 Reply Last reply
                        1
                        • U Offline
                          U Offline
                          user4592357
                          wrote on 22 Dec 2018, 19:22 last edited by
                          #12

                          @mrjj
                          i managed to do that but i want to remove all spaces between buttons.
                          i've set setContentsMargins(0, 0, 0, 0) and setSpacing(0) for the layout.
                          this is what i have now: https://ibb.co/qYCm8vR
                          can't i remove those spaces?

                          M 1 Reply Last reply 22 Dec 2018, 19:42
                          0
                          • U user4592357
                            22 Dec 2018, 19:22

                            @mrjj
                            i managed to do that but i want to remove all spaces between buttons.
                            i've set setContentsMargins(0, 0, 0, 0) and setSpacing(0) for the layout.
                            this is what i have now: https://ibb.co/qYCm8vR
                            can't i remove those spaces?

                            M Offline
                            M Offline
                            mrjj
                            Lifetime Qt Champion
                            wrote on 22 Dec 2018, 19:42 last edited by
                            #13

                            @user4592357
                            Hi
                            The tool buttons seems to reserve some pixels so there will be a small space.
                            alt text

                            The lower ones are Frames and both layouts have same settings so its fair to say
                            its the closest you get with ToolButtons as seen in top.

                            1 Reply Last reply
                            0
                            • U Offline
                              U Offline
                              user4592357
                              wrote on 24 Dec 2018, 14:59 last edited by
                              #14

                              @mrjj
                              hi,
                              when i add the buttons to a layout, they take up more space (just because it's available).
                              how can i make the buttons be in their minimum size in that layout?

                              p.s. this is what i have set for the button:

                              setMinimumSize(...);
                              setSizePolicy(QSizePolicy::Minimum, QSizePolicy::Minimum);
                              
                              M 1 Reply Last reply 24 Dec 2018, 15:02
                              0
                              • U user4592357
                                24 Dec 2018, 14:59

                                @mrjj
                                hi,
                                when i add the buttons to a layout, they take up more space (just because it's available).
                                how can i make the buttons be in their minimum size in that layout?

                                p.s. this is what i have set for the button:

                                setMinimumSize(...);
                                setSizePolicy(QSizePolicy::Minimum, QSizePolicy::Minimum);
                                
                                M Offline
                                M Offline
                                mrjj
                                Lifetime Qt Champion
                                wrote on 24 Dec 2018, 15:02 last edited by
                                #15

                                @user4592357
                                But would would be the minimum ?
                                You can set setMaximumSize of them if you want to limit it to
                                certain size. like 64x64. else layout makes them use the extra space.

                                U 1 Reply Last reply 24 Dec 2018, 15:32
                                0
                                • M mrjj
                                  24 Dec 2018, 15:02

                                  @user4592357
                                  But would would be the minimum ?
                                  You can set setMaximumSize of them if you want to limit it to
                                  certain size. like 64x64. else layout makes them use the extra space.

                                  U Offline
                                  U Offline
                                  user4592357
                                  wrote on 24 Dec 2018, 15:32 last edited by user4592357
                                  #16

                                  @mrjj
                                  no i don't want max size...
                                  i thought i could add a spacer at column 0 and last column, and set stretch factor to those columns

                                  M 1 Reply Last reply 24 Dec 2018, 15:42
                                  0
                                  • U user4592357
                                    24 Dec 2018, 15:32

                                    @mrjj
                                    no i don't want max size...
                                    i thought i could add a spacer at column 0 and last column, and set stretch factor to those columns

                                    M Offline
                                    M Offline
                                    mrjj
                                    Lifetime Qt Champion
                                    wrote on 24 Dec 2018, 15:42 last edited by mrjj
                                    #17

                                    @user4592357
                                    im not sure i understand.
                                    You do not want a max size for widgets but at same time they are not allowed to use
                                    all the space ?
                                    well yes spacers should compress to minimum

                                    1 Reply Last reply
                                    0
                                    • U Offline
                                      U Offline
                                      user4592357
                                      wrote on 24 Dec 2018, 15:51 last edited by
                                      #18

                                      yes maybe that's weird but that's what i need.
                                      when i added the spacer at col 0, and then the rest of the widgets, only the first widget got added.

                                      M 1 Reply Last reply 24 Dec 2018, 15:57
                                      0
                                      • U user4592357
                                        24 Dec 2018, 15:51

                                        yes maybe that's weird but that's what i need.
                                        when i added the spacer at col 0, and then the rest of the widgets, only the first widget got added.

                                        M Offline
                                        M Offline
                                        mrjj
                                        Lifetime Qt Champion
                                        wrote on 24 Dec 2018, 15:57 last edited by
                                        #19

                                        @user4592357
                                        Im not sure what you mean . Adding cant fail due to spacer.
                                        did you set Minimum on the widgets as else they get compressed totally.

                                        alt text

                                        with no Minimum set
                                        alt text

                                        1 Reply Last reply
                                        0
                                        • U Offline
                                          U Offline
                                          user4592357
                                          wrote on 24 Dec 2018, 16:57 last edited by user4592357
                                          #20

                                          i added spacers at both ends of hbox layout, but now the whole container widget gets larger instead of the buttons getting smaller (since there is a spacer around them)...

                                          M 1 Reply Last reply 25 Dec 2018, 00:03
                                          0

                                          5/21

                                          22 Dec 2018, 16:30

                                          topic:navigator.unread, 16
                                          • Login

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