Flex × Flash でコンテンツ制作。
海賊王をめざす男 マツです。こんにちは。
Flex × Flash でコンテンツ制作についてメモ。
Flex Builder コンテンツ制作
MXML でまず基本レイアウトを設計します。
Box などの箱モノは、基本 widrh="100%" height="100%" でフレキシブルにします。
後で固定したい widrh height を指定します。
Header, Footer, Sidebar などのレイアウトをコンポーネント化しておく。
レイアウトのコンポーネントができたら次はよく使う機能ごとにコンポーネントをつくります。
便利なコンポーネントを生産していくには、ActionScript で細かな設計が必要になります。
ちょっとしたテストは、.mxml ファイルに ActionScript をかいてしまいますが、きちんと後で機能ごとに .as ファイルにまとめます。
素材は、画像だったり自分で Flash でつくった swf を使います。
複数の人が Flash で開発するとき、各々の制作物との連結が色々めんどうだったり、きちんとしたルールとなる仕様書が必要になったりします。
スピードを要求される案件の場合、なかなかちゃんとした仕様書を用意できないことがあります。
そこで、Flex を使用します。
メインフレームは、Flex で制作して、各コンテンツを Flasher につくってもらいます。
このとき基本的なルールはすでにつくっておくことは前提ですが、かなり楽です。
各コンテンツの移動(シーン移動)などのコントロールを Flex で行います。
また、Flex の生産性の高いコンポーネントも使用できるのも重要です。
Flash でつくったコンポーネントを Flex で使う。
Test_001.mxml
<?xml version="1.0" encoding="utf-8"?><br>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundColor="#ffffff" creationComplete="init();">
<mx:Script>
<![CDATA[
[Embed(source = 'Profile.swf')]
private var Profile: Class;
private function init():void
{
var swf:MovieClip = new Profile();
profileImage.addChild(swf);
Loader(swf.getChildAt(0)).contentLoaderInfo.addEventListener(Event.INIT, initProfile);
}
public var profileSWF:MovieClip;
private function initProfile(evt:Event): void
{
// swf の root を参照します。
profileSWF = evt.target.content;
// swf に Flex の root を参照させます。(swf に base を宣言しておきます。)
profileSWF.base = this;
}
]]>
</mx:Script>
<mx:Image id="profileImage"/>
</mx:Application>
これで、Flex から各コンテンツの swf へ、逆に swf から Flex へのやりとりを行います。
スピードを要求される案件の場合、各コンテンツの swf の動作確認をしながらできます。
自分以外のひとがつくったコンテンツを結合するときはひとつふたつ問題がでますが、そういったものを回避するひとつの策として有効です。
汎用的なコンポーネントは、SWCファイルにしておくのも手ですね。
ダウンロード
サンプルはこちらからダウンロードしてお使いください。