Creating a multiline CheckBox component in Flash using ActionScript 3.0

by Peter deHaan on December 1, 2008

in CheckBox

The following example shows how you can create a multiline CheckBox control in Flash by setting the wordWrap property on the CheckBox component’s internal textField property.

Full code after the jump.

// ActionScript 3.0
/* Requires:
 * - A CheckBox control in your Flash library.
 */
import fl.controls.CheckBox;
 
var checkBox:CheckBox = new CheckBox();
checkBox.label = "The quick brown fox jumps over the lazy dog.";
checkBox.textField.wordWrap = true;
checkBox.move(10, 20);
checkBox.width = 200;
addChild(checkBox);

{ 5 comments… read them below or add one }

1 Nice 12.11.08 at 8:57 am

Need to submit an enhancement request to Adobe to have this ability added to Flash/Flex..

2 Peter deHaan 12.11.08 at 9:57 am

Nice,

Flash enhancement requests/bug reports can be filed using the “Feature Request/Bug Report Form” at http://www.adobe.com/go/wish (select “Flash” from the Product name drop down menu)
Flex enhancement requests/bug reports can be filed using the public bug base at http://bugs.adobe.com/flex/

Peter

3 andjules 12.08.09 at 8:50 am

Interesting side effect:
the actual check-box (the box element itself, not including the label) is vertically centered to the height of the checkbox’s textfield.
I can’t find any documentation (or undocumented stuff on the net) about how to reference the actual check-box (so I can control its relative position).

Any thoughts?

4 Craig Belcherr 01.13.10 at 11:17 am

I am also curious about how to change the relative position of the actual checkbox and its label. I think it would look much better if they were aligned along the top. I messed around with CSS styles, but I have not been able to find anything that affects the control in this way.

–Craig

5 Craig Belcherr 01.13.10 at 12:55 pm

After searching Google and doing some of my own investigation into Flex, I found the following solution:

package packageName
{
import flash.text.TextFieldAutoSize;
import mx.controls.CheckBox;

public class MultilineCheckBox extends CheckBox
{
public function MultilineCheckBox()
{
super();
}

override protected function createChildren():void
{
super.createChildren();

textField.wordWrap = true;
textField.autoSize = TextFieldAutoSize.LEFT;
}
}
}

Let me know what you think :)

–Craig

Leave a Comment

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Previous post:

Next post: