Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/07/16/disabling-keyboard-navigation-on-the-combobox-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        xmlns:comps="comps.*"
        layout="vertical"
        verticalAlign="top"
        backgroundColor="white" >

    <mx:Array id="arr">
        <mx:Object label="One" />
        <mx:Object label="Two" />
        <mx:Object label="Three" />
        <mx:Object label="Four" />
        <mx:Object label="Five" />
        <mx:Object label="Six" />
        <mx:Object label="Seven" />
        <mx:Object label="Eight" />
        <mx:Object label="Nine" />
        <mx:Object label="Ten" />
    </mx:Array>

    <mx:Form>
        <mx:FormItem label="MXML:">
            <comps:MyComboBoxMXML id="comboBoxMXML"
                    dataProvider="{arr}" />
        </mx:FormItem>
        <mx:FormItem label="ActionScript:">
            <comps:MyComboBoxAS id="comboBoxAS"
                    dataProvider="{arr}" />
        </mx:FormItem>
    </mx:Form>

</mx:Application>

comps/MyComboBoxMXML.mxml

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/07/16/disabling-keyboard-navigation-on-the-combobox-control-in-flex/ -->
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[
            override protected function keyDownHandler(event:KeyboardEvent):void {
                // ignore
            }
        ]]>
    </mx:Script>

</mx:ComboBox>

comps/MyComboBoxAS.as

/**
 * http://blog.flexexamples.com/2008/07/16/disabling-keyboard-navigation-on-the-combobox-control-in-flex/
 */
package comps {
    import flash.events.KeyboardEvent;
    import mx.controls.ComboBox;

    public class MyComboBoxAS extends ComboBox {
        public function MyComboBoxAS() {
            super();
        }

        override protected function keyDownHandler(event:KeyboardEvent):void {
            // ignore
        }
    }
}

View source is enabled in the following example.

Due to popular demand, here is the “same” example in a more ActionScript friendly format:

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/07/16/disabling-keyboard-navigation-on-the-combobox-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="top"
        backgroundColor="white"
        initialize="init();">

    <mx:Script>
        <![CDATA[
            import mx.containers.Form;
            import mx.containers.FormItem;
            import comps.*;

            private var arr:Array;
            private var myComboBoxMXML:MyComboBoxMXML;
            private var myComboBoxAS:MyComboBoxAS;

            private function init():void {
                arr = [];
                arr.push({label:"One"});
                arr.push({label:"Two"});
                arr.push({label:"Three"});
                arr.push({label:"Four"});
                arr.push({label:"Five"});
                arr.push({label:"Six"});
                arr.push({label:"Seven"});
                arr.push({label:"Eight"});
                arr.push({label:"Nine"});
                arr.push({label:"Ten"});

                myComboBoxMXML = new MyComboBoxMXML();
                myComboBoxMXML.dataProvider = arr;

                var formItem1:FormItem = new FormItem();
                formItem1.label = "MXML:";
                formItem1.addChild(myComboBoxMXML);

                myComboBoxAS = new MyComboBoxAS();
                myComboBoxAS.dataProvider = arr;

                var formItem2:FormItem = new FormItem();
                formItem2.label = "ActionScript:";
                formItem2.addChild(myComboBoxAS);

                var form:Form = new Form();
                form.addChild(formItem1);
                form.addChild(formItem2);
                addChild(form);
            }
        ]]>
    </mx:Script>

</mx:Application>

 

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/23/disabling-keyboard-navigation-on-the-radiobutton-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        xmlns:comps="comps.*"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:RadioButtonGroup id="radioGroup1" />
    <mx:RadioButtonGroup id="radioGroup2" />

    <mx:Form>
        <mx:FormItem label="keyboard enabled:"
                direction="horizontal">
            <mx:RadioButton id="radioButton1"
                    label="Red"
                    group="{radioGroup1}" />
            <mx:RadioButton id="radioButton2"
                    label="Orange"
                    group="{radioGroup1}" />
            <mx:RadioButton id="radioButton3"
                    label="Yellow"
                    group="{radioGroup1}" />
            <mx:RadioButton id="radioButton4"
                    label="Green"
                    group="{radioGroup1}" />
            <mx:RadioButton id="radioButton5"
                    label="Blue"
                    group="{radioGroup1}" />
        </mx:FormItem>
        <mx:FormItem label="keyboard disabled:"
                direction="horizontal">
            <comps:MyRadioButton id="radioButton6"
                    label="Red"
                    group="{radioGroup2}" />
            <comps:MyRadioButton id="radioButton7"
                    label="Orange"
                    group="{radioGroup2}" />
            <comps:MyRadioButton id="radioButton8"
                    label="Yellow"
                    group="{radioGroup2}" />
            <comps:MyRadioButton id="radioButton9"
                    label="Green"
                    group="{radioGroup2}" />
            <comps:MyRadioButton id="radioButton0"
                    label="Blue"
                    group="{radioGroup2}" />
        </mx:FormItem>
    </mx:Form>

</mx:Application>

comps/MyRadioButton.as

/**
 * http://blog.flexexamples.com/2008/06/23/disabling-keyboard-navigation-on-the-radiobutton-control-in-flex/
 */
package comps {
    import flash.events.KeyboardEvent;
    import mx.controls.RadioButton;

    public class MyRadioButton extends RadioButton {
        public function MyRadioButton() {
            super();
        }

        override protected function keyDownHandler(event:KeyboardEvent):void {
            // ignore
        }
    }
}

View source is enabled in the following example.

You can also override the keyDownHandler() method using a custom MXML component, as seen in the following example:

comps/MyRadioButton2.mxml

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/23/disabling-keyboard-navigation-on-the-radiobutton-control-in-flex/ -->
<mx:RadioButton xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[
            override protected function keyDownHandler(event:KeyboardEvent):void {
                // ignore
            }
        ]]>
    </mx:Script>

</mx:RadioButton>

Due to popular demand, here is the “same” example in a more ActionScript friendly format:

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/23/disabling-keyboard-navigation-on-the-radiobutton-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white"
        initialize="init();">

    <mx:Script>
        <![CDATA[
            import comps.*;

            import mx.containers.FormItemDirection;
            import mx.containers.FormItem;
            import mx.containers.Form;
            import mx.controls.RadioButton;
            import mx.controls.RadioButtonGroup;

            private var radioGroup1:RadioButtonGroup;
            private var radioGroup2:RadioButtonGroup;

            private var radioButton1:RadioButton;
            private var radioButton2:RadioButton;
            private var radioButton3:RadioButton;
            private var radioButton4:RadioButton;
            private var radioButton5:RadioButton;

            private var radioButton6:MyRadioButton;
            private var radioButton7:MyRadioButton;
            private var radioButton8:MyRadioButton;
            private var radioButton9:MyRadioButton;
            private var radioButton0:MyRadioButton;

            private function init():void {
                radioGroup1 = new RadioButtonGroup();
                radioGroup2 = new RadioButtonGroup();

                // 1
                radioButton1 = new RadioButton();
                radioButton1.label = "Red";
                radioButton1.group = radioGroup1;
                // 2
                radioButton2 = new RadioButton();
                radioButton2.label = "Orange";
                radioButton2.group = radioGroup1;
                // 3
                radioButton3 = new RadioButton();
                radioButton3.label = "Yellow";
                radioButton3.group = radioGroup1;
                // 4
                radioButton4 = new RadioButton();
                radioButton4.label = "Green";
                radioButton4.group = radioGroup1;
                // 5
                radioButton5 = new RadioButton();
                radioButton5.label = "Blue";
                radioButton5.group = radioGroup1;

                // 6
                radioButton6 = new MyRadioButton();
                radioButton6.label = "Red";
                radioButton6.group = radioGroup2;
                // 7
                radioButton7 = new MyRadioButton();
                radioButton7.label = "Orange";
                radioButton7.group = radioGroup2;
                // 8
                radioButton8 = new MyRadioButton();
                radioButton8.label = "Yellow";
                radioButton8.group = radioGroup2;
                // 9
                radioButton9 = new MyRadioButton();
                radioButton9.label = "Green";
                radioButton9.group = radioGroup2;
                // 0
                radioButton0 = new MyRadioButton();
                radioButton0.label = "Blue";
                radioButton0.group = radioGroup2;

                var formItem1:FormItem = new FormItem();
                formItem1.label = "keyboard enabled:";
                formItem1.direction = FormItemDirection.HORIZONTAL;
                formItem1.addChild(radioButton1);
                formItem1.addChild(radioButton2);
                formItem1.addChild(radioButton3);
                formItem1.addChild(radioButton4);
                formItem1.addChild(radioButton5);

                var formItem2:FormItem = new FormItem();
                formItem2.label = "keyboard disabled:";
                formItem2.direction = FormItemDirection.HORIZONTAL;
                formItem2.addChild(radioButton6);
                formItem2.addChild(radioButton7);
                formItem2.addChild(radioButton8);
                formItem2.addChild(radioButton9);
                formItem2.addChild(radioButton0);

                var form:Form = new Form();
                form.addChild(formItem1);
                form.addChild(formItem2);
                addChild(form);
            }
        ]]>
    </mx:Script>

</mx:Application>

 

Full code after the jump.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/10/disabling-keyboard-navigation-on-the-accordion-container-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        xmlns:comps="comps.*"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">
 
    <comps:MyAccordion id="accordion"
            width="100%"
            height="100%">
        <mx:VBox id="v1"
                label="One"
                width="100%"
                height="100%">
            <mx:Label text="One" />
        </mx:VBox>
        <mx:VBox id="v2"
                label="Two"
                width="100%"
                height="100%">
            <mx:Label text="Two" />
        </mx:VBox>
        <mx:VBox id="v3"
                label="Three"
                width="100%"
                height="100%">
            <mx:Label text="Three" />
        </mx:VBox>
        <mx:VBox id="v4"
                label="Four"
                width="100%"
                height="100%">
            <mx:Label text="Four" />
        </mx:VBox>
        <mx:VBox id="v5"
                label="Five"
                width="100%"
                height="100%">
               <mx:Label text="Five" />
        </mx:VBox>
    </comps:MyAccordion>
 
</mx:Application>

comps/MyAccordion.as

/**
 * http://blog.flexexamples.com/2008/06/10/disabling-keyboard-navigation-on-the-accordion-container-in-flex/
 */
package comps {
    import mx.containers.Accordion;
    import flash.events.KeyboardEvent;
 
    public class MyAccordion extends Accordion {
        public function MyAccordion() {
            super();
        }
 
        override protected function keyDownHandler(evt:KeyboardEvent):void {
        }
    }
}

View source is enabled in the following example.

Due to popular demand, here is the “same” example in a more ActionScript friendly format:

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/10/disabling-keyboard-navigation-on-the-accordion-container-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white"
        initialize="init();">
 
    <mx:Script>
        <![CDATA[
            import mx.containers.VBox;
            import mx.controls.Label;
            import comps.*;
 
            private var accordion:MyAccordion;
            private var v1:VBox;
            private var v2:VBox;
            private var v3:VBox;
            private var v4:VBox;
            private var v5:VBox;
            private var l1:Label;
            private var l2:Label;
            private var l3:Label;
            private var l4:Label;
            private var l5:Label;
 
            private function init():void {
                l1 = new Label();
                l1.text = "One";
 
                l2 = new Label();
                l2.text = "Two";
 
                l3 = new Label();
                l3.text = "Three";
 
                l4 = new Label();
                l4.text = "Four";
 
                l5 = new Label();
                l5.text = "Five";
 
                v1 = new VBox();
                v1.label = "One";
                v1.percentWidth = 100;
                v1.percentHeight = 100;
                v1.addChild(l1);
 
                v2 = new VBox();
                v2.label = "Two";
                v2.percentWidth = 100;
                v2.percentHeight = 100;
                v2.addChild(l2);
 
                v3 = new VBox();
                v3.label = "Three";
                v3.percentWidth = 100;
                v3.percentHeight = 100;
                v3.addChild(l3);
 
                v4 = new VBox();
                v4.label = "Four";
                v4.percentWidth = 100;
                v4.percentHeight = 100;
                v4.addChild(l4);
 
                v5 = new VBox();
                v5.label = "Five";
                v5.percentWidth = 100;
                v5.percentHeight = 100;
                v5.addChild(l5);
 
                accordion = new MyAccordion();
                accordion.percentWidth = 100;
                accordion.percentHeight = 100;
                accordion.addChild(v1);
                accordion.addChild(v2);
                accordion.addChild(v3);
                accordion.addChild(v4);
                accordion.addChild(v5);
                addChild(accordion);
            }
        ]]>
    </mx:Script>
 
</mx:Application>