Flex コンポーネントは、自身のイベントを送出し、他からのイベントを受け取ります。他のオブジェクトのイベントに関する情報を必要とするオブジェクトは、対象のオブジェクトにリスナーとして登録します。イベントが発生すると、対象のオブジェクトは、登録されたリスナーすべてにイベントを送出します。

Flex アーキテクチャのコアクラスである mx.core.UIComponent が、updateComplete、resize、move、creationComplete などのすべてのコンポーネントにとって基本となるコアイベントを定義します。サブクラスでも、そうしたコアクラスのイベントを継承し、送出します。

スーパークラスのすべてのイベントは、Flex の既存のクラスを拡張するカスタムコンポーネントによって継承されます。次の例に示すように、Button クラスを拡張して MyButton クラスを作成する場合は、mouseOver や creationComplete など、Button クラスから継承されたイベントを使用できます。

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:MyComp="myComponents.*"> 

    <mx:Script>
        <![CDATA[

            import flash.events.Event;

            private function handleClick(eventObj:Event):void {
                // Define event listener.
            }

            private function handleCreationComplete(eventObj:Event):void {
                // Define event listener.
            }

        ]]>
    </mx:Script>

    <MyComp:MyButton 
        click="handleClick(event);"
        creationComplete="handleCreationComplete(event);"/>

</mx:Application>

カスタムコンポーネントは、コンポーネントの要件に応じて、新しいイベントを定義することもできます。例えば、カスタムプロパティでのデータバインディングの使用では、コンポーネントのプロパティが Flex データバインディングのメカニズムで動作するようにカスタムイベントを定義する方法を示しました。

カスタムコンポーネント内での定義済みイベントの処理

前の例で、2 つのイベントを送出する MyButton というカスタムコンポーネントについて説明しました。その例では、メインアプリケーションファイル内でイベントリスナーを定義しました。

また、カスタムコンポーネントは、イベントを内部で処理するように、コンポーネント内でイベントリスナーを定義することもできます。例えば、変数としてのパブリックプロパティの定義では、コンポーネント本体内で keyDown と creationComplete イベントのイベントリスナーを定義しました。これにより、コンポーネントはイベントを内部で処理できるようになります。

この例では、creationComplete イベントを使用して、コンポーネントのデフォルトの fontSize プロパティにアクセスしています。Flex はコンポーネントが作成されるまでは定義できないので、コンストラクタ内では、このプロパティにアクセスできません。コンポーネントの初期化の順序について詳しくは、ActionScript を使用した高度なビジュアルコンポーネントを参照してください。

カスタムイベントの送出

ActionScript コンポーネントは、カスタムイベントを定義したり、定義済みのイベントを使用したりできます。カスタムイベントを使用して、データバインディングのサポート、ユーザーのやり取りへの応答、コンポーネントによる操作のトリガを実行できます。データバインディングをサポートするイベントの使用例については、カスタムプロパティでのデータバインディングの使用を参照してください。

コンポーネントで送出する各カスタムイベントについては、次の手順を実行する必要があります。

1. イベントを記述した Event オブジェクトを作成します。
2. （オプション）[Event] メタデータタグを使用して、イベントをパブリックにし、他のコンポーネントが受け取れるようにします。
3. dispatchEvent() メソッドを使用して、イベントを送出します。

イベントオブジェクトに情報を追加するには、そのイベントオブジェクトを表す flash.events.Event クラスのサブクラスを定義してください。カスタムイベントクラスの作成方法について詳しくは、カスタムイベントを参照してください。

コンポーネントの内部で使用するだけで、他のコンポーネントで認識する必要のないカスタムイベントを定義するとします。例えば、次のコンポーネントは、コンポーネント内部で、カスタムイベントの定義、送出、処理のすべてを行います。

package myComponents
{
    import mx.controls.TextArea;
    import flash.events.Event;

    public class ModalText extends TextArea {

        public function ModalText() {
            super();
        
            // Register event listener. 
            addEventListener("enableChanged", enableChangedListener);
        }

        public function enableInput(value:Boolean):void {
            // Method body.
    
            // Dispatch event.
            dispatchEvent(new Event("enableChanged"));
        }

        private function enableChangedListener(eventObj:Event):void {
            // Handle event.
        }
    }
}

この例では、パブリックメソッド enableInput() で、ユーザーのコントロールへの入力の有効／無効を設定します。enableInput() メソッドを呼び出すと、コンポーネントは dispatchEvent() メソッドを使用して、enableChanged イベントを送出します。dispatchEvent() メソッドのシグネチャは次のとおりです。

dispatchEvent(eventObj)

eventObj パラメータは、イベントを記述するイベントオブジェクトです。

MXML コンポーネントがイベントのリスナーを登録できるようにするには、[Event] メタデータタグを使用して、Flex コンパイラがイベントを認識できるようにする必要があります。次の例に示すように、カスタムコンポーネントが送出する各パブリックイベントに対して、イベントを定義するクラス定義の前に [Event] メタデータキーワードを追加します。

[Event(name="enableChanged", type="flash.events.Event")]
public class ModalText extends TextArea {
    ...
}

[Event] メタデータタグを使用してクラスファイルにイベントを指定しない場合、MXML コンポーネントがそのイベントのリスナーを登録しようとすると、コンパイラによりエラーが発生します。[Event] メタデータタグを省略した場合でも、addEventListener() メソッドを使用すれば、コンポーネントは ActionScript 内のイベントのイベントリスナーを登録できます。

次の例に示すように、イベントを MXML で処理できます。

<?xml version="1.0"?>
<!-- as/ASMainModalTextEvent.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:MyComps="myComponents.*">

    <mx:Script>
        <![CDATA[

            import flash.events.Event;

            private function handleEnableChanged(event:Event):void {
                myTA.text="Got Event";
            }
        ]]>
    </mx:Script>

    <MyComps:ModalTextEvent id="myMT"
        enableChanged="handleEnableChanged(event);"/> 
    
    <mx:Button click="myMT.enableInput(true);"/>
    <mx:TextArea id="myTA"/>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。