Flash IDE 上でのアルファを変えるだけの簡単なボタンの作成

今回は、Flashの勘所を友人に教わりつつ、簡単なボタンのコンポーネントを作成してみました。

概要
任意のSpriteを継承したオブジェクトに対して、マウスのロールオーバー時に alpha の値を変更する振る舞いを付加するコンポーネントおよびライブラリです。

仕様
AlphaTransitiveButtonクラス

• 概要
• ロールオーバー時に alpha が変化する Sprite です。
• ボタンモードはオンになります。
• メリット
• Flash IDE 上のシンボルからリンクするだけで、シンボルに対してロールオーバー時に alpha が 0.5 に変化する振る舞いを与えることができます。
• 自前の ActionScript を作成する必要がありません。
• 備考
  以下の場合、AlphaTransitiveButton クラスを使用せずに ButtonUtils の addXxxBehavior() 系のメソッドを利用の検討を推奨します。
• 既に継承を使用しているために継承が使えない場合。
• Alpha を独自に設定したい場合。
• 継承を使いたくない場合。（例：10種類の振る舞いを追加するために10回継承するということを避けたい場合）

ButtonUtilsクラス

• 概要
• 指定された Sprite クラス(もしくは Sprite を継承したクラス)にロールオーバー時に alpha が変化する振る舞いを付加します。
• ボタンモードはオンになります。
• 備考
• Flash IDE 上のシンボルに対して本メソッドのデフォルトの振る舞いを追加する場合は AlphaTransitiveButton クラスの利用も検討してみてください。

サンプル

• 上のボタンは AlphaTransitiveButton クラスにリンクしています。
• 下のボタンは、ボタンのシンボルの1フレーム目で ButtonUtils#addAlphaTransitiveButtonBehavior(target, rollOverAlpha) を呼び出し、rollOverAlpha を0.8に設定しています。

ソース

AlphaTransitiveButtonクラス

package {
    
    import flash.display.Sprite;
    import flash.events.MouseEvent;
    
    /**
     * ロールオーバー時に alpha が変化する Sprite です。
     * ボタンモードはオンになります。
     * 
     * メリット
     * 　・　Flash IDE 上のシンボルからリンクするだけで、シンボルに対してロールオーバー時に alpha が 0.5 に変化する振る舞いを与えることができます。
     * 　・　自前の ActionScript を作成する必要がありません。
     * 
     * 備考
     * 　・　以下の場合、AlphaTransitiveButton クラスを使用せずに ButtonUtils の addXxxBehavior() 系のメソッドを利用の検討を推奨します。
     * 　　　・　既に継承を使用しているために継承が使えない場合。
     * 　　　・　Alpha を独自に設定したい場合。
     * 　　　・　継承を使いたくない場合。（例：10種類の振る舞いを追加するために10回継承するということを避けたい場合）
     * 
     * @see ButtonUtils#addAlphaTransitiveButtonBehavior(Sprite, Number)
     */
    public class AlphaTransitiveButton extends Sprite {
        
        public function AlphaTransitiveButton() {
            ButtonUtils.addAlphaTransitiveButtonBehavior(this);
        }
    }
}

ButtonUtilsクラス

package {
    
    import flash.display.Sprite;
    import flash.events.MouseEvent;
    
    /**
     * ボタン関連のユーティリティクラスです。
     */
    public class ButtonUtils extends Sprite {
        
        /**
         * 指定された Sprite クラス(もしくは Sprite を継承したクラス)にロールオーバー時に alpha が変化する振る舞いを付加します。
         * ボタンモードはオンになります。
         * Flash IDE 上のシンボルに対して本メソッドのデフォルトの振る舞いを追加する場合は AlphaTransitiveButton クラスの利用も検討してみてください。
         * 
         * 注： target が Dynamic Text の TextArea の場合など、特定の条件下でマウスオーバー時にマウスカーソルの形状が変化しない場合があります。(flash側の問題)
         * 
         * @param target 対象となる Sprite
         * @param rollOverAlpha ロールオーバー時の alpha の値
         * @see AlphaTransitiveButton
         */
        public static function addAlphaTransitiveButtonBehavior(target:Sprite, rollOverAlpha:Number = 0.5) {
            target.buttonMode = true;
            target.addEventListener(MouseEvent.ROLL_OVER, function(e:MouseEvent):void {
                e.currentTarget.alpha = rollOverAlpha;
            });
            target.addEventListener(MouseEvent.ROLL_OUT, function(e:MouseEvent):void {
                e.currentTarget.alpha = 1;
            });
        }
    }
}

アーカイブ