FlashデザイナだってFlex！

Flex？XMLって？

　「Flexって、なんとなく難しそう」というイメージを持っている方に、Flexの説明から、FlashとFlexの違いについて紹介していきます。今回も実際にアプリケーションを作ってみましょう。

　まず、Flexとは「ユーザからのリクエストに応じて、サーバ側でSWFファイルを生成して見せる」というものです。ここで「生成する」というのがポイントで、FlexはMXMLという形式のファイルによってアプリケーションを作成し、ユーザからリクエストを受けると、そのMXMLファイルを解析してSWFに変換します。しかし、ユーザからリクエストを受ける度にMXML→SWFの変換を行っていては効率が悪いので、Flexでは一度変換を行うと、それ以降、MXMLに変更がない限りは変換済みのSWFを再利用します。

　では、Flexでアプリケーションを作成するための「キモ」である「MXML」について説明しましょう。MXMLは、XML形式で書かれたFlex独自のタグ言語です。XMLは<>で囲まれたタグと呼ばれる要素によって構成されるテキストファイルです。一般的なウェブサイトで使われるHTMLもXML言語の一種ということになります。

　MXMLに記述できる内容は以下のように分けることができます。

1.コンポーネントのレイアウト（見た目）
2.ActionScriptで記述するアクション（動作）
3.データ部分（データ）

　これらを作成するFlexアプリケーションに応じて記述していきます。

　「コンポーネントのレイアウト」は、テキストボックスやラベル、Flashで作成したコンポーネント(SWC)の配置を決定します。それぞれのコンポーネントの属性を設定することで表示の変更ができます。また、Flexにデフォルトで用意されているコンポーネントについては、一部CSSが適用可能なものもあります。

　「ActionScriptで記述するアクション」は、コンポーネントに定義したイベントハンドラに対するアクションをActionScriptで記述します。例えばボタンコンポーネントをクリックした場合（イベントハンドラ）にアラートメッセージを表示する（アクション）などです。

　「データ部分」にはアプリケーションで使用する画像やサウンド、外部SWFなどの情報を記述していきます。

FlashとFlex

　さて、FlashとFlexを比べてみると、FlexはMXMLからSWFへ変換するなどの違いはありますが、ユーザからみればどちらもSWFが見られるものということに変わりはありません。では何が違うのか？

　よく「Flashはデザイナ、Flexはプログラマ向けのツール」と言われています。確かにFlexはコンポーネントを配置していってアプリケーションを作成していくため、全体的にアニメーションを使ったものには向かないとは思います。また、XMLベースで書かれているという理由からFlashデザイナから敬遠されるという理由もあるかもしれません。

　しかし、それだけでFlexはプログラマのためのツールと言ってしまうのは寂しいですね。Flexアプリケーションを作成するための開発環境として、Adobe社が提供しているFlex Builderを利用すれば、コンポーネントの配置をGUI上で行うこともできますし、コンポーネントの属性もMXMLを直接操作しなくても行うことができます。

　確かにオブジェクト指向やらデザインパターンやらと、Flexはプログラマから入りやすいように設計されているツールではあります。しかし、コンポーネントを配置してアクションの定義ができます。つまり、ActionScriptを使ってイベントハンドラなどの仕組みが分かるようなFlashデザイナだと、ちょっとしたアプリケーションを作るためにはすごく便利だと思います。

　では、実際の書き方については次ページからサンプルのアプリケーションを作成していく中で解説していきます。