Flex Examples

The following example shows how you can use the openAlways property on the PopUpButton control to open the PopUpButton control’s pop up menu when the user clicks on the main button. The openAlways property is false by default.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/05/using-the-openalways-property-on-the-flex-popupbutton-control/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="top"
        backgroundColor="white">

    <mx:Style>
        PopUpButton {
            popUpStyleName: myCustomPopUpStyleName;
        }

        .myCustomPopUpStyleName {
            fontWeight: normal;
            textAlign: left;
        }
    </mx:Style>

    <mx:Script>
        <![CDATA[
            import mx.controls.Menu;

            [Bindable]
            private var menu:Menu;

            private function init():void {
                menu = new Menu();
                menu.dataProvider = arr;
            }
        ]]>
    </mx:Script>

    <mx:Array id="arr">
        <mx:Object label="Lorem ipsum dolor sit amet, consectetuer adipiscing elit." />
        <mx:Object label="Donec sit amet dui nec pede aliquam auctor." />
        <mx:Object label="Integer vestibulum sodales dui." />
        <mx:Object label="Sed nonummy ligula et tortor." />
        <mx:Object label="Aenean varius neque vel felis." />
        <mx:Object label="Phasellus venenatis ipsum sit amet nisi." />
        <mx:Object label="Nullam vitae turpis et ipsum cursus venenatis." />
        <mx:Object label="Pellentesque tincidunt pede non arcu." />
        <mx:Object label="Aliquam ut massa quis ante dignissim egestas." />
        <mx:Object label="Curabitur facilisis velit sit amet metus." />
        <mx:Object label="Vivamus ornare massa ac massa." />
        <mx:Object label="Nam accumsan rutrum purus." />
    </mx:Array>

    <mx:ApplicationControlBar dock="true">
        <mx:CheckBox id="checkBox"
                label="openAlways:"
                labelPlacement="left"
                selected="true" />
    </mx:ApplicationControlBar>

    <mx:PopUpButton id="popUpButton"
            label="Please select an item"
            openAlways="{checkBox.selected}"
            popUp="{menu}"
            initialize="init();" />

</mx:Application>

View source is enabled in the following example.