ボタンコンポーネントの祖先を尋ねる

サンプル作りをやってみよう

　めっちゃお久しぶりです。

　Σc ' _' )　　< 久しぶりテクスだぜっ!

　$ σ_σ$　　< ティオです、お久しぶりね

　さて閑話休題。
　そのユーザインタフェースコーナーのサンプルとしてFlashを活用していこうという事で、まずは一通りのUIコンポーネントを使ってみる事からリハビリを始めて行こうかと思います。

fl.controls.Button

　リハビリだし、fl.controls.Button使ってみる。
　MainTimeline.asに以下のコードを書いて、実行。

//!-- UTF8
package {
	import flash.display.MovieClip;
	import fl.controls.Button;
	import flash.events.MouseEvent;

	public class MainTimeline extends MovieClip {
		function MainTimeline() {
			var btn:Button = new Button();
			btn.label = "くりっくみー";
			btn.addEventListener( MouseEvent.CLICK, clickHandler );
			addChild( btn );
		}

		private function clickHandler( e:MouseEvent ) {
			trace( "くりっくどみー" );
		}
	}
}

　…動かん、なんで?
　悩む事しばし、原因は簡単な事だった。flaファイルのライブラリにButtonコンポーネントが無いからだ。
　Buttonコンポーネントを使うのだったら、まだそのものなのでライブラリに入ってないといけないと気付くかもしれないが、実はこれfl.controls.LabelButtonでも、ライブラリにコンポーネントが無いとnewできない。

　LabelButtonなんか抽象(abstract)クラスだから、ますます必要なさそうな気もするが、ライブラリにLabelButtonを継承したButtonオブジェクトを入れておかないと、newできない。
　LabelButtonの実体はライブラリのComponent Assets/_private/ComponentShimコンパイル済みクリップにあるようだ。

　このへんFlexとまた微妙に流儀が違う。
　FlexのコンポーネントをFlashオーサリングツールでも使えるようにできなかった理由はなんなんだろう?
　あと、リファレンスで継承関係を追っていってもButtonはMovieClipの継承をしていないのだが、ライブラリのButtonのプロパティを見るとしっかり"flash.display.MovieClip"が入っているのも気持ち悪い。

fl.controls.LabelButton

　そんな訳で、問題のLabelButtonも使ってみよう。Buttonとのスクリプトの違いは、クラス名を変えた事とsetSize()で大きさを指定しているところだけ。

//!-- UTF8
package {
	import flash.display.MovieClip;
	import fl.controls.LabelButton;
	import flash.events.MouseEvent;

	public class MainTimeline extends MovieClip {
		function MainTimeline() {
			var btn:LabelButton = new LabelButton();
			btn.label = "くりっくみー";
			btn.setSize( 100, 20 );
			btn.addEventListener( MouseEvent.CLICK, clickHandler );
			addChild( btn );
		}

		private function clickHandler( e:MouseEvent ) {
			trace( "くりっくどみー" );
		}
	}
}

　これが何故か動くのだ。動いていいだろうって思う方もいるかもしれないが、リファレンスにはしっかり「LabelButton クラスは、(中略)抽象クラスです。」と書いてあるのだ。
　私の理解が間違っていないならば、抽象クラスってインスタンス化できないクラスだと思っていたんだが…Flash良く判らんなー。

　なおLabelButtonは、ほぼButtonと同じ機能を持っていてemphasizedが増えてるだけ。

fl.controls.BaseButton

　さらに継承を遡ってfl.controls.BaseButtonを使ってみる。
　LabelButtonと違うのはクラス名を変えた事とlabelの指定が無いだけ。

//!-- UTF8
package {
	import flash.display.MovieClip;
	import fl.controls.BaseButton;
	import flash.events.MouseEvent;

	public class MainTimeline extends MovieClip {
		function MainTimeline() {
			var btn:BaseButton = new BaseButton();
			btn.setSize(100, 20 );
			btn.addEventListener( MouseEvent.CLICK, clickHandler );
			addChild( btn );
		}

		private function clickHandler( e:MouseEvent ) {
			trace( "くりっくどみー" );
		}
	}
}

　動く。
　こっちはリファレンスに抽象クラスとは書いてないので、動いても何も不思議は無いのだが、何をもって抽象クラスと言ったり言わなかったりしているのか、ますます良く判らない。

fl.core.UIComponent

　さらにさらに継承を遡ってfl.core.UIComponentを使ってみる。
　スキンの設定が無いので、Graphicで円を描いてみた。

//!-- UTF8
package {
	import flash.display.MovieClip;
	import fl.core.UIComponent;
	import flash.events.MouseEvent;
	import flash.display.Graphics

	public class MainTimeline extends MovieClip {
		function MainTimeline() {
			var btn:UIComponent = new UIComponent();
			var g:Graphics = btn.graphics;
			g.beginFill( 0x999999 );
			g.drawCircle( 0, 0, 20 );
			g.endFill();
			btn.addEventListener( MouseEvent.CLICK, clickHandler );
			addChild( btn );
		}

		private function clickHandler( e:MouseEvent ) {
			trace( "くりっくどみー" );
		}
	}
}

　動いた。
　なお、こいつもライブラリに適当なコンポーネントが追加されていないと、パブリッシュ時にエラーが出る。

flash.display.Sprite

　またさらにさらに継承を遡ってflash.display.Spriteを使ってみる。
　ここでやっとコンポーネントではなくなり、ライブラリが空でも動作するようになる。

//!-- UTF8
package {
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import flash.display.Graphics

	public class MainTimeline extends MovieClip {
		function MainTimeline() {
			var btn:Sprite = new Sprite();
			var g:Graphics = btn.graphics;
			g.beginFill( 0x999999 );
			g.drawCircle( 0, 0, 20 );
			g.endFill();
			btn.addEventListener( MouseEvent.CLICK, clickHandler );
			addChild( btn );
		}

		private function clickHandler( e:MouseEvent ) {
			trace( "くりっくどみー" );
		}
	}
}

　という訳で、鳶嶋工房 / User Interface / Terms / ボタンのサンプルなんか作ってみた訳です。

　今日はここまで。

2011-02-10