MultiLined Label for a Button

I found this task very tough when I started it. But Mr. Alex Hauri’s blog made me beleive that it is not that difficult. I published it mainly for my reference even though it is a kind of repition of that blog. I hope that this will definitely help someone.

You can find Alex Hauri’s blog here http://blogs.adobe.com/aharui/

This is how it is done. You need to create a customized button by extending the Button class. The button class overrides the createChildren method and creates a UI textfield to display the label.

These are somethings which you need to know before you start with the task

1. Button uses an instance of UITextField to render its label, so we need to create an instance of UITextField for the label on our customized button.
2. Lable by default accommadates only a single line of text. In order to make it multiline, you need to override the createChildren() method of the Button class and give multiline and wordwrap behaviour to the instance of the textField and add it as a child of the button.

Please find the createChildren() as below.

override protected function createChildren():void
{
// Create a UITextField to display the label.
if (!textField)
{
textField = new UITextField();
textField.styleName = this;
addChild(textField);
}
super.createChildren();
textField.multiline = true;
textField.wordwrap = true;
}

My task wasnt that simple. I had to add multiline label to the Tab in the TabNavigator. And that label should display every word of the text in a different line. I took almost four days to figure this out as I am new to Flex development. But I have learnt a lot in those four days.

---

Possibly related posts: (automatically generated)

• SoC :: Ribbons :: Summary
• Resizing button component on the fly
• Student Management