FlexでFlashコンテンツを作ろう

2008年7月16日(水)
高橋 義博

MXMLとActionScript 3.0について

 第1回(http://www.thinkit.co.jp/article/102/1/)、第2回(http://www.thinkit.co.jp/article/102/2/)とFlex Builder 3の概要と使用方法を説明してきました。今回は、Flex Builder 3でFlashコンテンツを作成する方法について説明していきます。

 前回までは、簡単なFlashコンテンツを作成する方法やMXMLの説明をしてきました。まだ、ActionScript 3.0に関しての説明をしていませんので、今回は、ActionScript 3.0を利用したコンテンツ制作について説明していきます。

 Flex Builder 3で、ActionScriptを使用する場合には、MXML内に記述する方法と外部ASファイルとして利用する方法の2種類がありますが、本連載では分かりやすいMXML内に記述する方法を使っていきます。

 MXML内にActionScriptを記述する場所ですが、の間に記述します。これはXHTMLにJavaScriptを記述する際に利用する

ActionScriptでラベル表示

 コンポーネント・パネルから「Button」と「Label」を画面中央の「デザインエリア」にドラッグ&ドロップしてください。配置した「Label」コンポーネントを選択し、画面右側「Flexプロパティ→共通→ID」を「msg」にし、「文字」の内容を削除してください。

 表示モードを「ソースモード」を切り替え、図1のようにActionScriptを入力します。の間に記述されている内容がActionScriptの記述となります。こちらの内容は、ID「msg」が設定されている「Label」コンポーネントに対して、「Flex Builder 3」という文字を表示するという処理「labelView()」を設定しています。
この処理「labelView()」をボタンクリックしたら実行するように「click="labelView()"」に設定しています。

 ActionScriptの前後に、の記述がありますが、この記述はXML内にスクリプトコードなどテキストを記述する際に必要なCDATAセクションというものになります。このCDATAセクションは、

制御機器メーカーでソフト開発やWebマスターの業務を経て、2007年からフリーランスとして、Webサイト制作、Flashコンテンツ制作を行っている。また、WebスクールでWebデザイン、Flash制作の講師などを担当し、経験を生かして幅広い指導を行っている。

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています