Tech-uno.com - Flex SDK で Web アプリを作成する

Flex SDK を使用して Web アプリケーションを作成します。比較のため MXML と ActionScript の両方を例として挙げています。

【開発環境】

・Windows XP Professional
・JRE Version 6 Update 15
・Flex SDK 3.4
・Flash Player 9

【インストール・設定】

① Flex SDK のダウンロード・インストール
　　⇒ http://www.adobe.com/cfusion/entitlement/index.cfm?e=flex3sdk
　　⇒ ダウンロードしたファイルを解凍するだけ
② パスの設定
　　⇒ [Flex SDK のホーム・ディレクトリ]/bin を環境変数の Path に追加

【開発手順】

① ソースファイルを作成
　　⇒ 下記（MxmlTest.mxml または ActionScriptTest.mxml）参照。
② コンパイル
　　⇒ mxmlc --strict=true --file-specs MXMLTest.mxml
　　⇒ 下記（コンパイル時出力例）参照。
③ 作成された SWF ファイルをダブルクリックして実行
　　⇒ Flash Player が起動し、ボタンが表示されればOK。

※ ソースを見ればお分かりのように、 GUI に関しては ActionScript よりも MXML を使用した方が断然簡単です。

【MXMLTest.mxml】

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml";
horizontalAlign="center" verticalAlign="center">

<mx:Button id="myButton" label="I'm a button!" />
</mx:Application>

【ActionScriptTest.mxml】

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml";
viewSourceURL="src/GettingStartedActionScript/index.html"

creationComplete="creationCompleteHandler();"
width="300" height="80"
>

<mx:Script>

<![CDATA[
import mx.controls.Button;
import mx.events.FlexEvent;

private var myButton:Button;

private function creationCompleteHandler():void

{
// Create a Button instance and set its label
myButton = new Button();
myButton.label = "I'm a button!";

// Get notified once button component has been created and processed for layout

myButton.addEventListener (FlexEvent.CREATION_COMPLETE, buttonCreationCompleteHandler);

// Add the Button instance to the DisplayList
addChild (myButton);
}

private function buttonCreationCompleteHandler ( evt:FlexEvent ):void

{
// Center the button
myButton.x = parent.width/2 - myButton.width/2;
myButton.y = parent.height/2 - myButton.height/2;
}

]]>
</mx:Script>
</mx:Application>

【コンパイル時出力例】

> mxmlc --strict=true --file-specs MXMLTest.mxml
設定ファイル "[Flex SDK のホームディレクトリ]/frameworks/flex-config.xml" をロードしています

[ソースファイルがあるディレクトリ]/MXMLTest.swf (174124 bytes)

Topics

ログイン

Older Stories

月曜日12- 7月

水曜日30- 6月

日曜日13- 6月

火曜日01- 6月

日曜日30- 5月

月曜日24- 5月

日曜日23- 5月

木曜日29- 4月

Flex SDK で Web アプリを作成する

関連情報

記事のオプション

トラックバック