AIRで高度なWindowの表示を行うにはNativeWindowを使うらしい。
var initOptions:NativeWindowInitOptions = new NativeWindowInitOptions(); initOptions.systemChrome = NativeWindowSystemChrome.STANDARD; initOptions.transparent = false; initOptions.type = NativeWindowType.NORMAL; window = new NativeWindow(initOptions); window.visible = true;
でノーマルWindowが表示できた。PanelはNativeWindowType.UTILITYを指定する。NativeWindowType.LIGHTWEIGHTの場合はNativeWindowSystemChrome.NONEを指定する必要があった。
前回Flex4&AIRで単一Windowを表示しました。
今回は複数Windowを作成してみます。
mxmlファイルではWindowedApplicationからApplicationに変更。ActionScriptでWindowを作成するのでスクリプトを読み込み。
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" applicationComplete="init()"> <fx:Script source="MultiWindow.as"/> </s:Application>
MultiWindow.asではinitメソッドとopenWindowメソッドを作成。openWindowではWindowとButtonを作成してButtonをWindowに配置。
import spark.components.Window; import spark.components.Button; import spark.components.Group; private var window:Window = null; private function openWindow(event:MouseEvent):void { window = new Window(); window.width = 300; window.height = 300; window.title = "Test"; var opnBtn:Button = new Button(); opnBtn.x = 10; opnBtn.y = 10; opnBtn.label = "Open"; opnBtn.addEventListener(MouseEvent.CLICK, openWindow); window.addElement(opnBtn); window.open(true); } private function init():void { openWindow(null); }
コンパイルして実行するとはじめにWindowが一つ表示され、そのWindowのOpenボタンをクリックすると新しいWindowが表示されました。
このコードでは一つのwindow変数に次々に新しいWindowインスタンスが代入されるので、Closeボタンを付けてみたら案の定最後に作成したWindowだけしか閉じることができませんでした。
次はMVCのC、コントローラを作ってみるようかな。
Flexは以前すこしいじったことはありますが、完全に忘れました…。たしかバージョンが違うし。
なので、AIR SDKについてきたSampleのAIRアプリ定義XMLを参考にしつつ、Flex 4でWindowにHello Worldを表示してみます。
まずMXML。HelloWorld.mxml
<?xml version="1.0" encoding="utf-8"?> <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> <s:Label text="Hello world!"/> </s:WindowedApplication>
Flex 4なのでSparkを使用。
そしてAIRアプリ定義。HelloWorld-app.xml
<?xml version="1.0" encoding="UTF-8"?> <application xmlns="http://ns.adobe.com/air/application/1.5.3"> <id>samples.flex.HelloWorld</id> <name> <text xml:lang="en">Hello World Application 0.1</text> </name> <version>0.1</version> <filename>HelloWorld</filename> <initialWindow> <content>HelloWorld.swf</content> <title>Hello World Application</title> </initialWindow> </application>
コンパイルしてアプリをデバッグ実行してみます
$ amxmlc HelloWorld.mxml $ adl HelloWorld-app.xml
みごとにWindowが表示され、左上に小さくHello world!と表示されました。…中央に大きく表示したほうがいいですよね。でも疲れたので今日はここまでw。
あるアプリをAdobe AIRで開発してみようと思い立ったので、AIRの研究をすることにしました。
まずは開発環境を整えます。
AIR SDKをAdobe – AIR: Adobe AIR SDKからダウンロードして適当な場所にコピー。
Flex SDKはDownload Flex 4 – Flex SDK – Adobe Open SourceからFlex 4 Betaの最新のものをダウンロードしました。アプリリリースまでにはBetaではなくなっていることでしょう。
Adobe Flex SDKとOpen Source Flex SDKの違いは
Free Adobe Flex SDK と Open Source Flex SDK – てっく煮ブログ
が参考になりました。ということでOpen Source Flex SDKを使いつつ必要になったらAdobe Flex SDKに変更することにしてみます。
Flex SDKもダウンロードしたら適当な場所にコピー。私は~/local/share/に配置しました。
配置したら~/.zshenvに
export PATH=/Users/username/local/share/AIR_SDK/bin:/Users/username/local/share/flex_sdk_4.0.0.10485_mpl/bin:$PATH
と記述しました（実際にはMacPortsのパスなども入ってます。Macのデフォルトはbashなので、普通は.bashrcあたりに記述するんですがzsh使ってるので.zshenvに記述してます）。
bin下の実行ファイルが実行できたのでインストール完了。
ところで、IDEはAptanaを利用しようと思ったんですが、AptanaってHTML+CSS+JSでの開発のみをサポートしてるって事みたいなので…どうしよう。
Komod IDEはActionScriptは公式にはもうサポートしないってことみたいなんで、Komodo使いつつLexerとCIXを自分で作成するしかないかも。