Button component width

[Aurélien Gâteau]

Le mercredi 3 octobre 2012 16:54:53 Marco Martin a écrit :
> On Wednesday 03 October 2012, Aurélien Gâteau wrote:
> > Le mercredi 3 octobre 2012 14:35:22 Marco Martin a écrit :
> > > On Wednesday 03 October 2012, Aleix Pol wrote:
> > > it's a reasonable size espressed in characters (policy i unfortunately
> > > still didn't make clear enough there is that pixel sizes should be
> > > avoided as much as possible).
> > > ideally, width and height of buttons or similar elements should never be
> > > specified by the code that uses them, but alwas stay the default, that
> > > is
> > > implicitWidth/height.
> > > 
> > > 12 characters is a reasonable default width for a button (and the sane
> > > length a button text should have), what should be done is to gather all
> > > those sizes in a single private file so they are consistent among
> > > different widgets
> > 
> > Was about to write about minimum width. I have bumped into that a few
> > times
> > already and I would like to suggest two changes:
> > 
> > 1. A way to disable the minimum width if needed
> 
> it could have a minimum width hit (too bad there is no standard in QML for
> that)
> so if needed to take as little space as possible would just do
> Button {
>     width: minimumWidth
> }

Sounds good to me.

> > 2. Switch to always centering text in buttons: fixed-width buttons do not
> > look good when text is left-aligned. Look This is what currently happen
> > with the new lock screen for example.
> > 
> > I am happy to provide patches if we agree on these changes.
> 
> text is centered if there are no icons.
> 
> however, if there is an icon, 3 things may happen:
> 1) text and icon are aligned to the left
> 2) icon is aligned on the left, text is centered
> 3) both text and icon are centered
> 
> over the many revisions all 3 were tried, and both 2 and 3 looked quite
> awful (and in general, more cluttered), especially if buttons are in a
> column.

Right now if you have 3 buttons in a column and one of them has an icon, it 
looks really broken because the button with an icon has left-aligned text 
while the others have centered text.
Using 2) would be better for this case I think. It would also look better in 
an horizontal row of buttons as well (like in lock screen).

I agree with you there is no perfect solution for icon + text + fixed-width 
buttons, no matter if fixed-width is enforced by the component or by the user 
aligning buttons in a column. I believe however changing alignment based on 
the use of the icon makes it even worse.
The only good-looking solution might be to say one can have either icon or 
text but not both. Or even not supporting icons at all in Button, leaving 
icons for ToolButton, which do not have a fixed width.

Aurélien