We're having issues with the width of our fieldlabels. We're trying to coax them into taking up a certain amount of space in the container by adding them to VerticalLayoutContainers and giving them 100% width (new VerticalLayoutData(1, -1) but they tend to wrap without reaching it. I've used set LabelWidth to increase the space but this is fixed pixels. Is there a better way to handle dynamic sizing fieldlabels?
We have the same problem whether the FieldLabel contains a widget or not. It's really a problem when people resize windows or have varying resolutions. What's the best approach to sizing the label?
Thanks
Each FieldLabel gets its own width set - it doesn't measure all other local* FieldLabels to ensure they are consistent - it relies on you to give it reasonable defaults. One could perhaps build a widget like FieldLabel which takes text and a field and just lines them up, but doesn't try to get the widget aligned from one row to the next. This would probably be a CssFloatLayoutContainer - first add a Label, with width of -1 (i.e. measure it), then add the field itself with width of 1.0 (i.e. use all remaining unallocated space).
*How local should it be? In that same parent container? Somehow in the same column, across several containers? Across the app?
If you want to pre-measure your label strings before you try to draw, consider the GXT class TextMetrics. This will allow you to ask questions about how big a particular line of text will be. It may be necessary to first bind(Element) to a visible element that has the right font/size/decoration/weight as label in question - you'll need to test to see how it applies in your use case.
Instead of measuring each string within a specific area and taking the max to get them to all line up, join all strings with line breaks between them (i.e. the <br> tag), and measure the width all at once. This will perform only one measurement operation - these aren't exactly cheap, since they require the browser to render and lay out your text in the dom.
Each FieldLabel gets its own width set - it doesn't measure all other local* FieldLabels to ensure they are consistent - it relies on you to give it reasonable defaults. One could perhaps build a widget like FieldLabel which takes text and a field and just lines them up, but doesn't try to get the widget aligned from one row to the next. This would probably be a CssFloatLayoutContainer - first add a Label, with width of -1 (i.e. measure it), then add the field itself with width of 1.0 (i.e. use all remaining unallocated space).
*How local should it be? In that same parent container? Somehow in the same column, across several containers? Across the app?
If you want to pre-measure your label strings before you try to draw, consider the GXT class TextMetrics. This will allow you to ask questions about how big a particular line of text will be. It may be necessary to first bind(Element) to a visible element that has the right font/size/decoration/weight as label in question - you'll need to test to see how it applies in your use case.
Instead of measuring each string within a specific area and taking the max to get them to all line up, join all strings with line breaks between them (i.e. the <br> tag), and measure the width all at once. This will perform only one measurement operation - these aren't exactly cheap, since they require the browser to render and lay out your text in the dom.
Answered: FieldLabel Width
Reply With Quote