If you are a Flex developer, you would have come across this issue several times. If you are using the <mx:Label> control and the size of your text is bigger than the size of the container, you will see a cut off version of the text because by default, the Label control does not allow multiline text.
So, here is what I wrote quickly to achieve this functionality.
[xml]
package components
{
import mx.core.UITextField;
import flash.text.TextFieldAutoSize;
import mx.controls.Label;
import flash.display.DisplayObject;
public class MultiLineLabel extends Label
{
override protected function createChildren() : void
{
// Create a UITextField to display the label.
if (!textField)
{
textField = new UITextField();
textField.styleName = this;
addChild(DisplayObject(textField));
}
super.createChildren();
textField.multiline = true;
textField.wordWrap = true;
textField.autoSize = TextFieldAutoSize.LEFT;
}
}
}
[/xml]
The code overrides the createChildren() method and creates a new instance of UITextField which has multiline and wordwrap turned on.
I was messing around with this last night. Thanks for the example, I am going to give your version a try.
Hey,
mx:Label doesn’t work for multiline but mx:Text works fine for multiline text (with a fixed width), give it a try 🙂
Fabien
http://www.flex-tutorial.fr
Hey Fabien, you are right. You can always use <mx:Text> instead of <mx:Label> but I wanted to see why the Label wouldnt work? Hence, this post. 🙂
Let’s say you use the mx.Text with a fixed width… and there is a label and mx.Text component directly below the first one. Now the displayed data will overlap. How can this overlap be avoided?
@Tim, as long as the whole thing is in a VBox, the height should be adjusted automatically.
All the methods given above will failed in datagrid.
Instead of all these things best thing is to use
spark text area with contentbackgroundalpha = “0″
for more solutions mail me.!!!
hey i have one question..if i m using tag for my UI form, now i want like this……….
First
Name:Apurv khadamkar
i.e multiline in left hand side names(first name)……how would i achieve this functionality in ……tag….thanx in advance
hey i have one question that if i m using tag for my UI form, now i want like this……….
First
Name:Apurv
i.e multiline in left hand side names(first name)……how would i achieve this functionality in ……tag
earlier post contains (mx:Form)(mx:FormItem) tag which couldn’t be visible in post……..
Hi,
Thanks this saved my time.
I’ve been having trouble with my code, but it’s also older than yours. I gave yours a try and it worked..
Thank you very much for your time and code.
James Bennit
Dental Services in IL
(Dental Implants Bloomington IL)
All the methods given above will failed in datagrid.
Instead of all these things best thing is to use
spark text area with contentbackgroundalpha = “0”
for more solutions mail me.!!!
mayank.maestro@gmail.com