SQLの窓

2011年02月13日


コマンドラインで始める Flex4 のすすめ

▼ 開発者ツールのテスト用です。各ブラウザでコンソールを開いてクリックして下さい


Flex と出逢ったのは、Flex2 の時ですが、時代も変わってブラウザに「開発者ツ
ール」という便利なものが実装されて、全てのブラウザで console.log が実行で
きます。



Flex3 では、Firebug lite の力を借りていましたが、その時の資産がそのまま
使えます。ただ、ビルド時のコマンドラインオプションで以下が必要になります。
-compatibility-version=3.0 

Flex4 のダウンロードは、Adobe - Adobe Flex: Download Adobe Flex 4 SDK か
ら、「コマンドライン用」を選択してダウンロードします。実際内容がどう変わ
るのかは解りませんが、大差無いとは思います。開発中の最新のものをは Downl
oad Flex 4 - Flex SDK - Adobe Open Source からできますが、現在安定版は無
いようです。

さらに、Java が必要ですが、Oracle になってから日本語ページが出来ていない
ようなので、Java SE 6 Downloads ( Oracle ) からダウンロードしてインスト
ールする必要がありますが、既に 1.5 以上が入っていれば使えるとは思います。

Flex4 は、C ドライブのルートにダウンロードして解凍しておけばいいです。こ
のページでダウンロードできるビルダーでパスを指定するので、バージョン管理
するのに、ドライブのルートが解りやすいです。

ビルダーは、MKEditor でプロジェクトを作成しているので MKEditor をインス
トールしておくと、開発が楽になります。
( 【MKEditor】 WEB WSH インストーラ (※ 上級者用) )

詳細は、ファイルの内容を確認していただくといいですが、http 経由でなくと
も動作可能なように、Flash Player の FlashPlayerTrust に設定するようにし
ています。リンクはそのフォルダを開くスクリプトなので、常に許可したいディ
レクトリは自分で設定して下さい。

コンソールになにも表示されない場合は、全ての実行中のブラウザを
いったん終了させてみて下さい

http 経由の場合は普通に動くはずです。


各ブラウザの開発者ツールのコンソール

★ IE の場合は、F12 で開発者ツールを表示させてから最表示して下さい
( スクリプトタブを選択して、コンソールを表示させる必要があります )
また、ローカル環境でスムーズにテストするには、設定の詳細で、
「マイコンピュータのファイルでのアクティブコンテンツの実行を許可する」ようにチェックします

★ Firefox では、Firebug を表示してコンソールを表示して下さい。
★ Google Chrome では、CTRL+SHIFT+I で開発者ツールを表示して、Console タブを表示します。
★ Safari では、CTRL+ALT+I で開発者ツールを表示して、コンソールタブを表示します。
★ Opera では、CTRL+SHIFT+I でDragonflyを表示して、スクリプトタブ内の REPL を表示します。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
	xmlns:mx="http://www.adobe.com/2006/mxml"
	initialize="initData();"
	mouseDown="Mouse_Down()"
	mouseUp="Mouse_Up(event)"
	click="Mouse_Click()"
>

<mx:Script>
<![CDATA[

	import mx.formatters.*;

	// *********************************************************
	// ログ表示
	// *********************************************************
	public function log(data:Object):void {

		// 日付編集用
		var fmt:DateFormatter = new DateFormatter();

		fmt.formatString = "YYYY/MM/DD HH:NN:SS";
		var logdt:String = fmt.format( new Date );

		// JavaScript の呼び出し
		ExternalInterface.call(
			"console.log", logdt,
			" "+data
		);

	}

	// *********************************************************
	// アプリケーションの初期化
	// *********************************************************
	public function initData():void {

		// メッセージ
		log("initData() が実行されました" );

	}

	// *********************************************************
	// Mouse_Down ( 引数無しの定義です )
	// *********************************************************
	public function Mouse_Down():void {

		// メッセージ
		log("マウスが押されました" );

	}
	// *********************************************************
	// Mouse_Click ( 引数無しの定義です )
	// *********************************************************
	public function Mouse_Click():void {

		// メッセージ
		log("マウスが押して離されましたされました" );

	}

	// *********************************************************
	// Mouse_Down ( 引数を正しく定義しています )
	// *********************************************************
	public function Mouse_Up(ev:flash.events.MouseEvent):void {

		// メッセージ
		log("マウスが離されました" );
		log( "id : " + ev.currentTarget.id );
		log( "localX,localY : " + ev.localX + "," + ev.localY );
		log( "stageX,stageY : " + ev.stageX + "," + ev.stageY );
		log( "ctrlKey : " + ev.ctrlKey );

	}



]]>
</mx:Script>

<!-- ここは何もありません。コメントです -->

</mx:Application>


Firefox + Firebug



Google Chrome




posted by at 19:01 | Flex4 | このブログの読者になる | 更新情報をチェックする