Truncating the label on a Flex CheckBox control

The following example shows how you can truncate the label on a CheckBox control in Flex by setting the width property.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/06/truncating-the-label-on-a-flex-checkbox-control/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:String id="str">The quick brown fox jumped over the lazy dog.</mx:String>

    <mx:Form>
        <mx:FormItem label="default:">
            <mx:CheckBox id="checkBox1"
                    label="{str}" />
        </mx:FormItem>
        <mx:FormItem label="width = 200:">
            <mx:CheckBox id="checkBox2"
                    label="{str}"
                    width="200" />
        </mx:FormItem>
    </mx:Form>

</mx:Application>

View source is enabled in the following example.

Tagged as: width