In a nutshell what you are saying is that it's perfectly OK for any other
control to adjust the size of the container, except for a label. I'm sorry,
but all controls have the same rules and restrictions. I'm sorry that you
don't see that. Labels have just as much importance as tabviews. And with
any container, if you don't set a min or max width, it will stretch to allow
the contents to fit. And you are misunderstanding what the property 'wrap'
does. If the content makes the control wider then it's restricted width,
then it will wrap. But it does not have any width restrictions so it
continues to grow. In your example, you are using a VBox layout. In that
layout, all controls are stacked vertically, one on top of the other. And
all controls take up the full width of the container if they don't have a
maxWidth set. You obviously didn't even notice that in your Playground
example, your GroupBox is the full width of the container even though you
gave it a width of 200. You didn't give it a maxWidth so it grew. It
followed the rules.
At design time you have to have some idea of what your max size is for the
container. The width of the screen, the width of the tabview (I'm sure
whoever created them gave them a width), the width of it's parent container
or something? Set the containers maxWidth to that value and all your issues
will be solved. It really is that simple.
"My point is that because the label can wrap that implies that it does
*not*have a minimum width because it can wrap to avoid the width." -
minimum
width isn't the issue here, it's the maxWidth. Since the label doesn't have
one you have implicitly told it to grow as big as it needs to be. Heck, you
don't even need a maxWidth, as a normal setWidth will to the trick as well.
But if you don't give it some sort of rule to go by, remember that
programming is simply a set of rules, it will do what it needs to do. The
same is true of the container.
" but the textfield does not have any width set so it does not force the
container to grow" - wrong. Whatever width it is, regardless of if it was an
explicet width or not, the container will grow to hold it. The container
will not limit it's size (assuming that there is no limits set on the
container which there are not).
" Unless a minWidth is set, every widget *except* Label reacts to the size
of the container" - true IF the container has a size restriction! If there
is no size limit set to the container then the controls are not going to
know what to do, and the container is going to grow to fit all controls.
You really need to learn the rules of the layout engine. This page will give
you all that you need to know about the layout system:
http://qooxdoo.org/documentation/1.1/ui_layouting?s=layout%20system
Once you understand the rules the rest comes naturally.
Jim
On Thu, Oct 7, 2010 at 5:25 AM, John Spackman <[email protected]>wrote:
> Hi Jim
>
> Yes, if the textfield has a width of 300 pixels then the container will
> expand to fit – but the textfield does not have any width set so it does not
> force the container to grow; if the container has a second field which has
> minWidth=400 then the container and both fields become 400 wide, IE the size
> is dictated by the one and only field that has a width restriction.
>
> My point is that because the label can wrap that implies that it does *not
> * have a minimum width because it can wrap to avoid the width.
>
> Also, in terms of usability if you add a couple of words to your label (or
> a translation is longer than the original) then either the display widens by
> a couple of inches or it wraps and the height grows by only a few pixels –
> and growing vertically by a small amount is usually preferable to growing
> horizontally by a lot more. If you fix the width and later on more space
> becomes available (because another control *must* be bigger), you have to
> revisit all your labels to correct the sizing.
>
> In our case, we have lots of tabview pages developed for varying purposes
> and it would be next to impossible to know the exact size of all tab pages
> in advance (not all tabs are used in all applications); some widgets have
> min/max sizes but most use flex etc to take up a proportion of the available
> space. Unless a minWidth is set, every widget *except* Label reacts to
> the size of the container, and the size of the tabview is dictated by
> various minimum restrictions of the pages.
>
> I could set a maxWidth etc on a container, but I would only be doing it to
> constrain the width of all the Labels and that stops other controls causing
> the container to resize.
>
> John
>
> From: Jim Hunter <[email protected]>
> Reply-To: qooxdoo Development <[email protected]>
> Date: Wed, 6 Oct 2010 23:50:30 -0700
>
> To: qooxdoo Development <[email protected]>
> Subject: Re: [qooxdoo-devel] qx.ui.basic.Label sizing problem
>
> In your example, your outer container does not have any width set and it
> doesn't have a maxWidth set, so, all internal controls can expand it to
> accommodate. And since the label needs more room to show all content the
> container is more then happy to expend to let it all show. If you don't want
> that to happen then you need to set a maxWidth on the container or the
> label. So, if you are relying on your designer to make the page look
> correct, then your designer need to know all the rules or you are going to
> end up with this type of thing more often. In general, the web is fluid
> unless you tell it not to be. And since you didn't tell it to stop
> expanding, it just kept going. Your example does exactly what I would expect
> it to do, and there is no reason to expect it to do any different.
>
> "For example, if you add a TextField in exactly the same way, it does not
> cause the composite to grow." - this is not correct. If you add a TextField
> to the container, and it has a width of 300 pixels, your container
> absolutely will expand to fit because there is nothing telling it not to,
> does that make sense? You have placed no restrictions on the container. You
> simply created it and asked it to hold a few controls, and it did.
>
> Jim
>
>
> On Wed, Oct 6, 2010 at 1:52 AM, John Spackman <[email protected]>wrote:
>
>> Hi Jim
>>
>> Isn't that inconsistent with other controls such as a text field which
>> expand to fill the available space? For example, if you add a TextField in
>> exactly the same way, it does not cause the composite to grow.
>>
>> Here's another example that demonstrates this:
>> http://tinyurl.com/32l7ums
>>
>> The size of the outer composite is a factor of the user interface that you
>> design, eg a list must be big enough (height & width) to be readable, a
>> toolbar big enough to hold the buttons each of which is big enough for text
>> and image etc – and if a label cannot wrap then it must be high enough
>> and wide enough to display the text, but the ability to wrap means only
>> that the label needs only to be high enough because the width is
>> negotiable.
>>
>> This becomes an issue for me because I combine tabview pages from various
>> sources – generally speaking, each page is roughly the same size but there
>> is always some variation and all the other controls expand to fit the
>> available space without leaving odd gaps at the side. Having a label at a
>> fixed width disaffects the autosizing of the entire app and undoes the good
>> work of the layout classes.
>>
>> John
>>
>>
> ------------------------------------------------------------------------------
> Beautiful is writing same markup. Internet Explorer 9 supports standards for
> HTML5, CSS3, SVG 1.1, ECMAScript5, and DOM L2 & L3. Spend less time writing
> and rewriting code and more time creating great experiences on the web. Be a
> part of the beta today.
> http://p.sf.net/sfu/beautyoftheweb_______________________________________________qooxdoo-devel
> mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
> ------------------------------------------------------------------------------
> Beautiful is writing same markup. Internet Explorer 9 supports
> standards for HTML5, CSS3, SVG 1.1, ECMAScript5, and DOM L2 & L3.
> Spend less time writing and rewriting code and more time creating great
> experiences on the web. Be a part of the beta today.
> http://p.sf.net/sfu/beautyoftheweb
> _______________________________________________
> qooxdoo-devel mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
------------------------------------------------------------------------------
Beautiful is writing same markup. Internet Explorer 9 supports
standards for HTML5, CSS3, SVG 1.1, ECMAScript5, and DOM L2 & L3.
Spend less time writing and rewriting code and more time creating great
experiences on the web. Be a part of the beta today.
http://p.sf.net/sfu/beautyoftheweb
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
