kei3.jp | head -n 10 diary

Fireworks CS3でFlex用のmxmlの書き出しが出来ると言うことは知っていたのですが、実際に試したことがなかったので、試してみました。

手順としては、新規ドキュメントを作成して、共有ライブラリのFlex componentsからパーツをキャンバスへドラッグして配置します。後は書き出し。

書き出しの種類選択の一番下に「MXMLとイメージ」という項目が有るので、それを選択して書き出しを行うだけ。簡単です。

書き出した後は、Flex SDKをインストールしている場合は、

mxmlc test.mxml

こんな感じでコンパイルすれば、test.swfが出来ます。簡単です。実際にFlash Playerでtest.swf再生してみるとちゃんとパーツが動きます。単なるmxmlファイルとjpgファイルを書き出しているだけなのに動くモノが出来るんですね。mxmlの仕組みを分かってないのでちょっと不思議な感じです。

Fireworks CS3から書き出したファイルはこの様になります。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http:
//www.adobe.com/2006/mxml" width="320" height="240" layout="absolute" backgroundGradientColors="[#FFFFFF, #FFFFFF]">
<mx:Style>
Button {
textSelectedColor:#000000;
textRollOverColor:#2B333C;
disabledColor:#AAB3B3;
color:#0B333C;
}
CheckBox {
textSelectedColor:#000000;
textRollOverColor:#2B333C;
disabledColor:#AAB3B3;
color:#0B333C;
}
TextInput {
disabledColor:#AAB3B3;
color:#0B333C;
}
ComboBox {
textSelectedColor:#2B333C;
textRollOverColor:#2B333C;
disabledColor:#AAB3B3;
color:#0B333C;
}
</mx:Style>
<mx:Button id="button" x="9" y="11" width="82" height="22" label="Button" enabled="true"/>
<mx:CheckBox id="checkBox" x="9" y="43" height="14" selected="false" label="Checkbox" enabled="true"/>
<mx:TextInput id="textInput" x="9" y="67" width="160" height="22" enabled="true" text="Text"/>
<mx:ComboBox id="comboBox" x="9" y="95" width="88" height="22" enabled="true" editable="false">
<mx:dataProvider>
<mx:Array>
<mx:String>Text</mx:String>
</mx:Array>
</mx:dataProvider>
</mx:ComboBox>
</mx:Application>

ちなみに、複数のページがあるドキュメントを書き出しする場合、「現在のページのみ」というチェックボックスを外せば、全てのページが出力されます。但し、デフォルトのままだとファイル名がページ 1.mxml、ページ 2.mxmlというようなファイル名になります。日本語だと具合悪いので、ページ名はpage1とかpage2に変更しておいた方が良いかもしれません。

Flex Builderを使うメリットの一つがこれらのパーツの配置にあると思うのですが、Fireworks CS3を持っていたら要らないかもしれないですね。もしかすると設定を上手く行えば、Xcodeと連携してFlex Builderの様なことが出来るかも。

Adobe - Adobe Flex 2: Flex Builder 2
>>関連リンク

アマゾンでMac版のFlex Builder 2がWindows版よりも高いのは何故？同じソフトで値段が違うとは。