Issue with QPushButton text horizontal clipping

JonB

@ajaxcrypto
Assuming your button is just wide enough to show the text at 9pt, what are you expecting to happen if you hover and it changes to 10pt? Are you expecting the button to resize to accommodate?

ajaxcrypto

I do not know what to expect, should the button auto resize to fit contents? But note that if I have a single button inside a layout, it does resize and the text is visible, the problem only happens with multiple buttons in a Layout.

mrjj

Hi
Button MUST be big enough for the Hover text size.
It will not ever resize to fit the text.

The buttons will use the width allowed by the layout.

Solution is to make the QFrame bigger. :)

ajaxcrypto

So how do I make sure that they are big enough? The texts displayed in the button are not necessarily static. Do I every time calculate width using QFontMetrics and set it to bigger one? Also then it is not as flexible anymore i.e. the font size on hover can be anything specified by the user through a stylesheet. So do I have to write my own CSS parser to figure it out?

mrjj

@ajaxcrypto
Well you can start with a size for window that can hold longer texts.

When using style sheet , there is no way to know what font settings are put in there. (sadly)

So if you really need to allow user total freedom then yes you must write some code
to check the texts with a given font to see if it will fit.

You might be able to subclass QPushButton and make it a bit more automatic that way but
im not sure how much it would help.

ajaxcrypto

So for an auto resize-able button, I have to write a QSS parser to figure out the font size on various selectors, then use this to change the button dimension based on that and the current text set for the button? (Because the user can specify this:

QPushButton { font-size: 10pt; }
QPushButton:hover { font-size: 11pt; }
QPushButton:pressed { font-weight: bold; }
// numerous other such combinations with properties/selectors...

That seems like an awful amount of work for something seemingly simple. Also, when should I parse the stylesheet if I override a QPushButton ?

When it is created with a text and parent, get parent style sheet and parse
When setStyleSheet is called
When setText is called
Probably at resize event as well ?
When setObjectName is called

Note: The stylesheet can be set anywhere, either the button itself, or any parent or application wide.

Edit: Also, I need to combine multiple such style blocks when they are set at multiple levels and match the QPushButton and figure out which has the highest specificity and then calculate the dimension based on that...

mrjj

@ajaxcrypto
Hi
I would not try to parse the stylesheet as that would just be so involved.

What i imagine is something like ( using the QStyleOption for push button)

 void CustomWidget::paintEvent(QPaintEvent *)
 {
     QStyleOption opt;
     opt.init(this); // any font set by style sheet should be reflected here
    // calculate text size using QFontMetrics
   // set minimumWidth based on that.
     QPainter p(this);
     style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this); // would use the  style()->drawButton or what ever is used for pushbuttons

I have not checked that QStyleOptionXXX does in fact reflect the font but since the above code
lets me use custom widgets with stylesheet so I assume it will be same for a QPushButton child.

ajaxcrypto

Here is the paint event implementation from QPushButton:

void QPushButton::paintEvent(QPaintEvent *)
{
    QStylePainter p(this);
    QStyleOptionButton option;
    initStyleOption(&option);
    p.drawControl(QStyle::CE_PushButton, option);
}

It already uses the QStyleOptionButton ...

mrjj

@ajaxcrypto
Yes ofc. ( i just showed the concept with QWidget and not the style used for button)
So if u subclass it and add some size checking, it might fly ?

ajaxcrypto

But how do I figure out the required max height/width? For that the logic is

Parse and resolve all stylesheet
Figure out the largest dimensions based on font-size and font-weight
Resize the button accordingly.

Step 2 would require like looping through all the selector/combinators applied to the button and figuring out the largest font size and weight

mrjj

@ajaxcrypto
QStyle respect stylesheets.
So i would not look at the stylesheet as text but when its been processed by Qt.
At the moment of painting.
That would be in the QStyleOptionButton.
So with a little luck, you can make button check the actual text size and
adjust if needed.

ajaxcrypto

This fiddle nicely demonstrates what I wanted to acheive with QPushButton

https://jsfiddle.net/h7fkj5ow/

ajaxcrypto

Tried fiddling with style option, does not work, in most cases, even the intial text gets clipped horizontally, on hover, clips even more... So basically an auto expanding button which fits to its content is simply not possible without writing a complete QSS parsing system?

Why doesn't Qt expose the parser API ? It would have saved me days worth of work... Like maybe changing a single property for :hover selector based on some condition for a QPushButton i.e.

button->setStyleProperty("hover", "background-color", Qt::white);

mrjj

@ajaxcrypto
Hi
I understand it. but none of the widgets will grow to fit text.

Sadly, it seems the QStyleOptionButton do not reflect the new
font size set by hover. It reports width as same so my idea was not as straight as i had hoped.
It should be in there some where.

mrjj

@ajaxcrypto
Hi
They consider the parser private.
I also dreamed of an API so colors etc could be read from stylesheet alone.

ajaxcrypto

So basically I have to roll my own QSS parser, keep track of all relevant styles and then paint widgets accordingly for auto-resizing widgets based on current properties... Sigh
Might as well write my own GUI library at this stage using primitives + signal/slots...

Note: I could not find any documentation as to where selector specific style information is stored, neither are there public/protected member functions to get them.

mrjj

@ajaxcrypto
Parsing stylesheet would be my last attempt.
QStyle, QProxyStyle and friends provides many ways to alter
how stylesheets are used.

My idea with QStyleOptionButton almost worked except I cant find where the
hover font size is stored. Not even the font for painter seems to change which i find a bit odd.
(update: my idea with QStyleOptionButton cannot be used. not reflected. sorry)

Before you go down the long and evil road, give it some days and see if someone has a good idea
on how to do it without parsing the actual stylesheet.

SGaist

What about using the QEvent::HoverEnter and QEvent::HoverLeave events to modify the font ?
You could also use QFontMetrics to calculate the minimum size needed to fit the text in the button.

ajaxcrypto

There are other selectors as well like :pressed, so I have to do this for all of them and their combinations when set with property value i.e.

QPushButton[prop="value"]:hover { ... }
QPushButton[prop="other"]:hover { ... }

I wanted a generic solution which works for all kinds of stylesheet, not a particular stylesheet.

JonB

@ajaxcrypto

[ASIDE: All this stuff about parsing stylesheets, that's what I was talking about in https://forum.qt.io/topic/85184/undoing-an-added-setstylesheet-property, wanting individual properties to be accessible. But that's how it is at present. You cannot access specific selectors.]

You probably won't thank me for this comment. I don't know what your application is all about. But do you really have a requirement to support anyone making any arbitrary changes they fancy to buttons in the stylesheet and then having to ensure that whatever fits in the button? Then it seems likely you'll want to allow arbitrary styling of any element, so sorting out the dynamic sizing of a button will only be the start of what you'll face? Is the amount of effort required worth it for the return? My 2 cents.