Passing properties to a custom component in Flash Builder 4

Question

I'm trying to pass some properties to a component I've created in Flash Builder 4. In my example below I want to pass the "label" property to update the label property of the Button.

Any help would be greatly appreciated. Thanks in advance.

// MyApp.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                       xmlns:s="library://ns.adobe.com/flex/spark" 
                       xmlns:mx="library://ns.adobe.com/flex/mx"
                       xmlns:local="*">
    <fx:Script>
        <![CDATA[
            protected function buttonText():void
            {
                myButton.label = 'Clicked!';
            }
        ]]>
    </fx:Script>
<local:MyComp id="myButton" label="My Button" click="buttonText()"/>
</s:WindowedApplication>

// MyComp.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"
         width="400" height="300">
    <s:Button/>
</s:Group>

Answer 1

<fx:Script>
    <![CDATA[
        private var _label:String;

        public function get label() : String {
          return _label;
        }
        public function set label(value:String) : void {
          _label = value;
          myButton.label = value;
        }

        protected function buttonText():void
        {
            myButton.label = 'Clicked!';
        }
    ]]>
</fx:Script>

This creates a default bind between the label property of your control and the label property of the myButton.label. You could also use the [Bindable] metatag on the getter of the label property.

Either way, you would just set the label property of your component and the value of the myButton label would reflect the new value.