[Qt-interest] custom shaped buttons

[Tibo W]

Thanks for your reply Carlos !



________________________________
 From: Carlos Smith <CSmith at stonewedge.net>
To: Tibo W <tibo_wcc at yahoo.com> 
Sent: Thursday, February 2, 2012 1:53 PM
Subject: RE: [Qt-interest] custom shaped buttons
 

 
Welcome to the Qt Style system.
 
Rather than having a style system that can be queried for values (such as “in the current draw context for this widget, what is the pressed state text color?”), they must be extracted and inferred from the elements, and there is a lot of guesswork and experimentation required.
 
We have some very customized rendered buttons.  This is the best I have been able to figure out of how to get at them.  Too many of the functions we’d want to call are private, so you have to work around it.  Some attributes that are able to be styled do not seem to be available to us implementers in our derived classes (Trolltech loves “private:” members).
 
I assume you have derived from QPushButton.  So the base styles you will use are QStyleOptionButton.  We set up our initial state as such (this function is called from :
 
voidPictureButton::paintEvent(QPaintEvent *event)
{
       QStylePainter p(this);
       QStyleOptionButton opt;
       initStyleOption(&opt);            //  this sets the style variables for the current button in context into the style option
       QFontMetrics fm = fontMetrics();  //  pick up the font specifications in the style
       QSize labelsSize;
 
 
       //  this gets us the area of our overall geometry that the button will draw its contents into.
       QRect rect = style()->subElementRect ( QStyle::SE_PushButtonContents, &opt, this );
 
       //  figure out how big our label will be so we can position it properly within our contents
       if (!text().isEmpty())
       {
              label1Size = fm.size(0, text());
       }
 
                //  we can derive what our padding must have been by the difference between our overall rectangle and the contents rect.
       int topPadding = rect.top() - opt.rect.top();
       int bottomPadding = opt.rect.bottom() - rect.bottom();
       int leftPadding = rect.left() - opt.rect.left();
       int rightPadding = opt.rect.right() - rect.right();
 
       //  here we figure out how to get Qt to draw our button bevel wrapped just around the text
       //  To do it, we must get Qt to think it is rendering the bevel normally, we just tweak the rectangle from what
       //  it thought it was.  If we had the border-radius property available to us we could do the rounded rect 
       //  ourselves, but I can’t find how to get it.
       originalOptRect = opt.rect;
 
       //  center the label in the rect
       opt.rect.setLeft(opt.rect.left() + ((opt.rect.width() – label1Size.width()) >> 1) - leftPadding);
       opt.rect.setWidth(label1Size.width() + leftPadding + rightPadding);
 
       //  don’t let our text end up larger than the original rect
       if (opt.rect.width() > originalOptRect.width())
       {
              opt.rect.setLeft(originalOptRect.left());
              opt.rect.setWidth(originalOptRect.width());
       }
 
       opt.rect.setTop(opt.rect.bottom() - bottomPadding - topPadding - labelsSize.height());
 
       //  Trick Qt into drawing what we want for us
       p.drawControl(QStyle::CE_PushButtonBevel, opt);
 
So that draws the button bevel that will be wrapped tightly around the actual text, rather than drawing text centered in a large button.
       
So from here we can figure out our geometry within the button.  Not knowing how your buttons look what we do from here isn’t really relevant.
 
To get the button text to draw in the styled color:
 
              QPalette palette = opt.palette;
              p.drawItemText ( rect, alignFlags, palette, isEnabled(), textToDraw, QPalette::ButtonText );
 
Unfortunately, there doesn’t seem to be any way to extract the style for the button “pressed” state from the palette, it simply doesn’t seem to be there, though it is magically available in Qt’s own pushbutton renderer.  We use a custom property and style name to work around that.  If you never set that style, you won’t need to worry about that.
 
This is one of our stylesheet entries using these buttons:
       PictureButton { background-color: rgb(86, 115, 140);
              border-radius: 12;
              padding-left: 15;
              padding-right: 15;
              padding-bottom: 6;
              padding-top: 6;
              color: black;
              font: 10pt ""Arial""; }
 
 
I hope this helps
 
Carlos
 
From:qt-interest-bounces+csmith=stonewedge.net at qt.nokia.com [mailto:qt-interest-bounces+csmith=stonewedge.net at qt.nokia.com] On Behalf Of Tibo W
Sent: Tuesday, January 24, 2012 8:42 PM
To: qt-interest at qt.nokia.com
Subject: [Qt-interest] custom shaped buttons
 
Hi,
 
I'm trying to draw push button with custom shapes.
I created a class inheriting from QPushButton, and draw a polygon in paintEvent. But I don't know how to apply the same colour and style than the current buttons.
Is there any way to do it ?
 
thanks in advance.
 

________________________________
 
This electronic message is intended only for the use of the individual or entity named above and may contain information which is privileged and/or confidential. If you are not the intended recipient, be aware that any disclosure, copying, distribution, dissemination or use of the contents of this message is prohibited. If you have received this message in error, please notify the sender immediately.
________________________________
 This electronic message is intended only for the use of the individual or entity named above and may contain information which is privileged and/or confidential. If you are not the intended recipient, be aware that any disclosure, copying, distribution, dissemination or use of the contents of this message is prohibited. If you have received this message in error, please notify the sender immediately.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.qt-project.org/pipermail/qt-interest-old/attachments/20120206/9d98bb12/attachment.html