NORI

トゴル・カンパニー

第 1 回 開発環境のインストールと Flash 画面の表示

ケータイで Flash が動くというニュースが発表されてしばらく経ちましたが、NTT DoCoMo の iモード 505i シリーズ（以下 iモード端末）でそれが実現されました。

ケータイで動作するための Flash として、Macromedia Flash Lite (以下、Flash Lite)が開発され、iモード端末に標準搭載されることになったのです。

普段パソコンでFlashコンテンツを作っている人にとって Flash Lite は、最初戸惑うかもしれません。 その主な理由は、ケータイというデバイスのために最適化されて削られた機能の多さと、Flash Lite のスクリプトが Flash 4 ベースであるという点です。

しかし、考えてみれば、数年前はもっと機能の低い Flash3 や Flash2 で十分楽しめるコンテンツを作成していたのですから、それを考えると iモードに初めて載った Flash Lite は、コンテンツ制作には必要十分な機能を備えていると言えるのではないでしょうか。

ケータイで Flash コンテンツを配信するメリットは、Flash コンテンツがパソコンの画面でなく、一般的に普及しているケータイで見れるという点に尽きます。日本ではインターネット以上に普及していると言っても過言ではないメディア上で、自分の作品を発表できるのです。

Flash の良さを十分に引き出したコンテンツがiモードでも楽しめるようになれば、さらに大きく発展する可能性も広がるでしょう。Flash クリエイターとしては、ぜひとも iモードという新しい分野にチャレンジして大きく発展させていきたいところです。

さて、この連載では、3 回に渡って、Flash Lite での開発工程を見ながら、iモード用 Flash の機能や TIPS を紹介する予定です。内容は、Flashについてひと通りの知識があり、パソコンでのオーサリング経験があることを前提に話を進めます。Flashで今すぐにでもiモードコンテンツを作ってみたいという方や、技術情報をとりあえず集めておきたいという方に適しています。

全 3 回の予定は以下の通りです。

第 1 回　開発環境のインストールとFlashの表示
第 2 回　アニメーションとインタラクティブ機能
第 3 回　iモード用サウンドとファイルサイズの最適化

i モード、i-mode ロゴ、NTT DoCoMo、およびDoCoMo はNTT ドコモの商標または登録商標です。

 

第 1 回 開発環境のインストールと Flash 画面の表示　その 2

開発環境について

iモード用の Flash も、開発は Windows か Macintosh で行います。Flash MX と Macromedia Flash MX 用 Flash Lite アップデータ(以下、アップデータ)をインストールすれば、準備は完了です。

また、実際に制作した Flash コンテンツをテストするために、NTT DoCoMo より iモード HTML シミュレータ（以下、シミュレータ）が提供されています（Windows 版のみ）。このシミュレータを使用すると、デスクトップでコンテンツのプレビューが可能となります。ただし、ケータイの動作と異なる可能性もありますので、最終的には実機でのテストが必要になるでしょう。

開発環境をインストール

Flash MX が、すでにインストールされている状態とします。アップデータのインストールでは、いくつかのファイルを上書きします。そのため、ファイルのバックアップを取ってからインストールを開始しましょう。予期せぬトラブルが発生したときなどに、バックアップファイルを元に戻すことで、インストール前の状態に戻せます。

以下のファイルのバックアップファイルを残しておく（Windows の場合）

- Flash MX\First run\AuthPlay.dll -> AuthPlay.dll.bak
- Flash MX\First run\Player\SAFlashPlayer.exe -> SAFlashPlayer.exe.bak
（ただし、Application Data ディレクトリにも AuthPlay.dll は作成されるためこれも元に戻す必要があります）

アップデータは、アイコンをダブルクリックして、インストールします。Macintosh の場合は、FLASHLIT.HQX というファイルを StuffITExpander などで解凍し、できた「FlashLiteInstaller_ja」をダブルクリックします。

画像 1：インストールアイコン (Windwos 版)

画像 2：バックアップが保存されているかどうか確認したらインストールを開始する (Windows版)

指示に従ってインストールすると、まもなく完了します。特に複雑な操作は必要ありません。これで、Flash MX のアップデート作業は完了します。

 

第 1 回 開発環境のインストールと Flash 画面の表示　その 3

Flash Lite の制限

Flash Lite は、パソコンの Flash と動作条件の異なる（いわばより厳しい）環境において動作するため、Flash MX と比較しても、大きく異なる点がいくつもあります。ここでは、その違いや注意点について触れます。

ファイルサイズに注意

SWF ファイルのサイズが制限されています。これは、iモードに内蔵のブラウザが一度に読み込めるデータ容量の上限が 20KB であるためです。さらに SWF ファイルを CHTML に組み込んで表示する場合は、ページを構成するファイル全体の合計が 20KB を超えないようにする必要があります。 ただし、SWF ファイルを単独で表示する場合は、20KB をそのまま SWF ファイル容量の上限と考えることができます。

また、実行時のメモリサイズは200KB（505i シリーズの場合）が保証されますが、ファイルサイズがメモリサイズのどちらかが、条件から外れてしまうと、Flash は正しく表示されません。

Flash Lite の Player は、iモード端末で動作することをふまえ、入力装置（マウス）の制限やセキュリティに配慮するため、機能自体に制限を設けた形で実装されています。Flash Lite の基本のバージョンは Flash 4 です。シンタックスは、Flash MX でのオーサリングを考慮して、MXに近いのですが、実装レベルの機能は、バージョン4 が基準になっているため、現在のFlash MXなどと比べると以下のような機能の違いがあります。（詳細は、「Flash Lite for i-mode Authoring Guidelines J」をご覧ください）

サポートされない大きな機能

• SWF 読み込み・・・LoadMovie によって外部SWFを読み込むことはできません
• ドラッグ・・・マウス操作ができないためサポートされません
• MP3 / ADPCM サウンド・・・サウンドは、MFiという i モード専用サウンドを使用します
• 入力テキスト・・・サポートされるテキストフィールドは、静止テキストとダイナミックフィールドのみです。ダイナミックフィールドは、スクロール (scroll、maxscroll) もサポートされません
• コアオブジェクト・・・Flash 4 ベースのため、Array、Math、MovieClip、Date などのオブジェクトがありません。 例外として、Math.cos() などの定数が存在します

アクションとプロパティのサポート/非サポート一覧

サポートされるアクション

サポートされるプロパティ

サポートされないアクション (Flash 4 と比較した場合)

サポートされないプロパティ (Flash 4 と比較した場合)

動作に条件があるアクションとプロパティ

Flash 4 では無かったがサポートされるアクション

その他

アクションについては、この連載の第 2 回で具体的に解説する予定です。使用できない機能もありますが、配列 (Array オブジェクト) などは、その代わりになるテクニックなどもあります。最初に必要十分と申し上げたのは、シンプルな機能ですが、上手に組み合わせれば複雑なコンテンツを制作することも可能だからです。

 

第 1 回 開発環境のインストールと Flash 画面の表示　その 4

グラフィックを表示する

ステージサイズは、505i シリーズが QVGA に対応していることから、240x320 ピクセルまで可能です。しかし、パソコンでブラウザのメニューや枠などを計算して、コンテンツのサイズを決めるのと同じように、iモードのブラウザの表示エリアも小さくなるはずです。そこで、この連載では 240x240 ピクセルで制作することとします。まずは、もっともシンプルな●と■を描いてみました。

画像 1：まずは、Flashで簡単なグラフィックを描いてみる

グラフィックができあがったら、パブリッシュして、シミュレータで表示できるか試します。

Flash Lite 用に書き出すには、[ファイル]-[パブリッシュ設定]を選択して、バージョンの項目を「Flash Player 4」にします。パブリッシュボタンを押すと、SWF ファイルが出力されます。

Flash 4 以外のバージョンでのパブリッシュでは、それぞれのバージョンに応じた通常の Flash が書き出されます。つまり、Flash MX と Flash Lite の開発は、同じアプリケーションの中で、特に何も設定しなくても可能なのです。しかし、どうしても Flash Lite の書き出しを Flash 4 に戻したいときは、「FlashLiteUser.txt」の「device_type=Standard」を有効にして、他のすべての行頭に「//」を挿入し、無効にした上で、Flash MX を起動します。

画像 2：Flash Lite のパブリッシュには「Flash Player 4」を選択する

パブリッシュ時に、注意する点は、SWFファイルのファイル容量と Flash Lite の出すアラートです。 グラフィックを描いているだけであれば、特に問題はないと思いますが、アクションを設定した場合、サポート外のアクションなどが含まれるとアラートが表示されます。

画像 3：出力ウィンドウには、ケータイデバイス用のアラートが出るので確認する。この程度は何も問題ない

今回は、そのままでOKです。動作は PC 上で見る Flash と変わらないので、あまり感動はないかもしれませんが、これは実際にiモード端末でも見ることができる Flash なのです。言い換えれば、ｉモードでベクターグラフィックがこんなに簡単に表示できるのです。

 

第 1 回 開発環境のインストールと Flash 画面の表示　その 5

ビットマップを表示する

Flash に BMP、GIF、PNG、JPEG、PICT (Macintosh のみ)などのファイルを読み込んで、ビットマップを表示することができます。しかし、読み込む画像ファイルのファイルサイズは、SWF のファイルサイズに影響するため注意が必要です。シンプルな色で構成された画像などは、GIF 形式を利用し、写真などは JPEG 形式を利用するなどして、いわゆる画像に最適なフォーマットを使用します。そうすることで、より小さなサイズでも、綺麗な画像を表示できるでしょう。

画像 1：Fireworks などで画像を使用するサイズぴったりに縮小して書き出す。ここでは、横幅が最大の 240 ピクセルになるようにしている

また、ビットマップは、Flash 内部で描画するベクターグラフィックと異なり、リサイズすると画像が乱れてしまいます。そこで、Macromedia Fireworksなどを使用して、最終のサイズで画像を作成してから読み込むと良いでしょう。大きすぎる画像を Flash 内で縮小しても、大きいファイルサイズの画像を使っていることと同じです。その点も注意してビットマップは扱う必要があります。

画像 2：ライブラリで、ビットマップを選択し右クリックで出てきたメニューから「プロパティ」を選択すると、それぞれのビットマッププロパティを見ることが可能

画像 3：ビットマッププロパティは、スムージングのオン/オフ、圧縮形式の選択、JPEGデータの画質の設定、といった調整が可能。「テスト」ボタンを押すと、圧縮後の消費サイズまでわかる。もちろん、左上の窓に表示される画像は指定した画質で圧縮されたものが表示される

 

第 1 回 開発環境のインストールと Flash 画面の表示　その 6

テキストや絵文字を表示する

テキストフィールドは、静止テキストとダイナミックテキストが使用できます。静止テキストでは、複雑な形の明朝系よりもゴシック系の方がサイズを抑えることができます。また、デバイスフォントを使用すれば、さらにサイズを節約することができます。デバイスフォントは、フォントのアウトライン情報を持たず、ケータイがもっているフォントを使用して表示するため、ファイルサイズやメモリサイズを抑えるのに効果的です。特に、長文のテキストや、アクションによって内容がダイナミックに変わる場合に使用します。

ただし、デバイスフォントには、静止テキストと異なり、以下のようないくつかの制限があります。

デバイスフォントを使用する際の注意事項

• 1 つのテキストフィールドに使用できるフォントは 1 種類です
• テキストフォーマットで有効なのは、行揃え（左揃え、中央揃え、右揃え）だけです
• テキストの色は、1 つのテキストフィールドについて 1 色だけです
• 上付き、下付き、カーニング、太字、斜体などはサポートしていません

iモード対応絵文字を表示する

iモード端末専用の iモード対応絵文字を表示するには、i絵文字の Shift-JIS コードを埋め込んで表示します。入力には専用のツールを使いますが、その iモード対応絵文字をデスクトップで入力/表示するためのユーティリティ「iモード対応絵文字入力ソフト」は NTT DoCoMo のサイトからダウンロードできます。

iモード対応絵文字入力ソフト「i絵文字」

画像 1：このユーティリティを使用すると、iモード対応絵文字の Shift_JIS コードをクリップボード経由で入力できる

画像 2：外字設定をしないと、デスクトップで絵文字が正しく表示されない

画像 3：Flash 内でテキストフィールドを作成してみた。上から、静止テキスト、ダイナミックテキスト、i 絵文字を使用した静止テキスト、iモード対応絵文字を使用したダイナミックテキストである。どちらの場合もテキストの色は自由に変更でき、静止テキストならば1文字単位で調整が可能

今回はここまで

今回は、Flash Lite の基本となる部分をご紹介しました。Flash Lite の制限については、さらに詳細が「Flash Lite for i-mode Authoring Guidelines J」にありますので、参考にしてください。また、グラフィックを表示するだけのコンテンツを制作する場合は、特に何の問題もなく制作できますので、ファイルサイズ 20KBを 守るように心がけてたくさんのコンテンツを制作してください。

次は、アクションスクリプトを利用したコンテンツ制作についてお話したいと思います。

 

第 2 回　アニメーションとインタラクティブ機能　その 1

今回は、Flash Lite で簡単な ActionScript を利用したコンテンツを作成してみましょう。Flash Lite の ActionScript について、どのようなものが使えるかは、前回紹介しました。また、リファレンスマニュアルにも書いてありますので、参考にしてください。今回のソースファイルは、このページの一番下からダウンロードできます。注意事項をよくお読みなってから、ご利用ください。

今回、最初に解説するサンプル「じゃん・けん・ぽん」は、こちらです。

ハリネズミのじゃんけんの手がランダムに切り替わります。

乱数と条件文を使用する

スクリプトで、もっとも便利に使えるのは、乱数と条件文です。この 2 つを理解すれば、さまざまに応用してより複雑なコンテンツが作成できます。上記のサンプルは、乱数と条件文を効果的に利用している例です。

プログラムの解説の前に

プログラム初心者の方のために、乱数と条件文について簡単にまとめましたので、ご覧ください。プログラムの知識がある人は、次のページまで飛ばしていただいて構いません。

乱数とは

乱数とは、ある範囲の中の、特定の数を指します。たとえば、Flash Lite では、乱数は、random(10) と書いて求めますが、この場合、意味しているのは「0～9 までの 10 個の数の中のどれか 1 つ」ということです。そのため、random(10) は、あるときは「0」、あるときは「3」、あるときは「9」と、予測できない数に置き換えられます。ただし、数の範囲は、0～9 の 10 パターンしかないことが決まっています。

条件文とは

大抵、乱数を求めると、ほとんどの場合、条件文と一緒に活用します。条件文とは、「●●のとき、■して、そうじゃないときは▲する」ということを、Flash にさせるときに使用します。たとえば、random(10) の値が、「0」の時なら、シーン「A」を再生して、それ以外ならシーン「B」を再生するといった感じです。

これらのテクニックを応用してサンプルで紹介した「じゃん・けん・ぽん」というアニメーションを作成する場合、左にいるハリネズミの出す手は、グー・チョキ・パーの 3 種類があります。これは、乱数を利用して 3 種類の中のどれかを出すようにしています。乱数が「1」なら「グー」、「2」なら「チョキ」、「0」なら「パー」ということとしています。どの数字がどの手になるかは、作り手の自由ですので、適当に決めますまた、パターンを簡潔にするために、キリンの手は「グー」しか出せないようにしました。これならば、すべてのじゃんけんのパターンは、3 通りしかありませんから、分かりやすいですね。

(もし、キリンも 3 つの種類の手を使えるとすると、3 x 3 で 9 個のパターンを作成する必要があります。それ以前にキリンがどうやってチョキを出すかを考えないといけないですけど)

今回使用するソースファイルをダウンロードできます。

以下のものが含まれます。太字が実際に解説に使用したサンプルです。

• menu.fla・・・メニュー画面です。
• janken.fla・・・メニューから呼ばれる「じゃん・けん・ぽん」というアニメーションです。
• 9puzzle.fla・・・メニューから呼ばれる「9 パズル」というゲームです。
• amida.fla・・・メニューから呼ばれる「あみだくじ」というゲームです。
• addNum.fla・・・call() のサンプルムービーです。
• telltarget.fla・・・telltarget() のサンプルムービーです。
• readme.txt・・・注意事項などの詳細が書いてありますので、必ずお読みください。また、他に、それぞれ swf 書き出ししたファイル（拡張子が .swf のもの）があります。

• ダウンロード(TOGORU_Sample.zip)

注意事項：すべてのソースファイル、およびキャラクターやイラストレーション、アニメーション等は、トゴル・カンパニーが著作権を所有しています。学習目的で利用することはできますが、それ以外に利用することはできません。ご注意ください。詳細については、readme.txt をご覧ください。

 

第 2 回　アニメーションとインタラクティブ機能　その 2

ソースを開いてみる

「じゃん・けん・ぽん」のソースを開いてみましょう。janken.fla を Flash MX で開きます。一番上のレイヤーには、キーフレームが作成されていて、ラベル名がつけられています (画像 1)。 各ラベルの名称とその部分にあるアニメーションの内容は次の通りです。

画像 1：

ラベル名	アニメーションの解説
start	開始
janken	「じゃんけん」（または「あいこで」）を出すアニメーション。
pon_gu_gu	「ぽん」（または「しょ」）といいながら、「グー」ｘ「グー」のアニメーション。
pon_choki_gu	「ぽん」（または「しょ」）といいながら、「チョキ」x「グー」のアニメーション。
pon_pa_gu	「ぽん」（または「しょ」）といいながら、「パー」x「グー」のアニメーション。
hari_yorokobi	ハリネズミが勝ち、喜ぶ。結果のアニメーション。
kirin_yokokobi	ハリネズミが負け、キリンが喜ぶ。結果のアニメーション。

乱数と条件文を使う

乱数と条件文を使うタイミングは「じゃんけん」（または「あいこで」）と出したときです。つまり、ラベル「janken」の最後になります。

実際に、janken の最後のフレームである 15 フレーム目に以下のようなアクションが書かれています。(解説の便宜上、行番号を先頭に付加しています)

1. r = random(3);
2. trace(r);
3. if (r == 1) {
4. gotoAndPlay("pon_gu_gu");
5. } else if (r == 2) {
6. gotoAndPlay("pon_choki_gu");
7. } else if (r == 0) {
8. gotoAndPlay("pon_pa_gu");
9. }

スクリプトの解説

1 行目で、乱数を作っています。random(3) なので、0 から始まる 3 種類の整数、0,1,2 のどれかの数字が、r という変数に入ります（このことをrに乱数を代入するといいます）。次に、条件としてif文が使われています。
2 行目のtrace() は、r の内容を出力ウィンドウに表示するという、確認のためのアクションです。実際の動作には無関係ですので、消してしまっても、そのまま残しておいても構いません。ただ、無駄な処理には違いないので、swf として出力するときはパブリッシュ設定の「trace アクションを省略」をチェックしておきましょう。
3～4 行目では、r が 1 ならば、「pon_gu_gu」ラベルへジャンプしなさいと書かれています。
5～6 行目では、r が 2 ならば、「pon_choki_gu」ラベルへジャンプしなさいと書かれています。
同じく、7～8 行目では、r が 0 ならば、「pon_pa_gu」ラベルへジャンプしなさいと書かれています。

このようにして、乱数と条件文を使用して、ハリネズミの手をランダムに出すことを実現しています。

あとは、それぞれ 3 つのパターンでは、どちらが勝つかが、おのずと分かりますので、2 つの結果のどちらかを表示するために、ハリネズミが勝つ場合は「hari_yorokobi」へジャンプし、キリンが勝つ場合は「kirin_yokokobi」へジャンプするアクションを設定しています。

さて、ここで 1 つ問題が発生します。じゃんけんでは、「あいこ」の場合があるのです。つまり、あいこのときは「あいこで♪」と言って、またやり直します。次は、それを実現しましょう。

 

第 2 回　アニメーションとインタラクティブ機能　その 3

「あこで・しょ」を実現する

「あいこで・しょ」を実現するために、 ある変数の状態によって、ムービークリップの特定のフレームから始まるようにスクリプトを作成する方法を紹介しましょう。

ある変数の状態とは、あいこかどうかということです。そこで、aiko という名前の変数を作成し、true（真）のときなら「あいこ」で、false（偽）のときなら、「あいこではない」と決めます。

ムービークリップの特定のフレームとは、「じゃんけん」と出すか、「あいこで」と出すかが異なる２つのアニメーションです。

ラベル「janken」のフレームで、レイヤー「text」を見てください。ここに、白丸のムービークリップがあります。これが、「じゃんけん」と「あいこで」という 2 つのパターンを含んだムービークリップです。

画像 1：

実際に中を見てみましょう。

画像 2：

ムービークリップ内では、2 つのパターンがラベルによって分けられています。各ラベルの名称と意味は次の通りです。

ラベル名	アニメーションの解説
janken	「じゃんけん」と表示する
aiko_de	「あいこで」と表示する

「あいこで」を表示するムービークリップの中身

このムービークリップの一番最初のフレームには、変数 aiko の状態によって、再生するフレームを指定するアクションが記述されています。そのアクションは以下のようになっています。

1. if (/:aiko) {
2. gotoAndPlay("aiko_de");
3. } else {
4. play();
5. }

スクリプトの解説

1～2 行目は、メインタイムラインにある aiko という変数の中身が true だったら、aiko_de へジャンプして再生するという条件文です。
3～4 行目は、メインタイムラインにある aiko という変数の中身が、true 以外だったら、そのまま（jankenn を）再生するという条件文になっています。

ここで、注目しておくのは、1 行目で aiko の前にある「/（スラッシュ）」と「:（コロン）」です。 / は、メインタイムラインをあらわし、/ で区切られた部分を階層と呼びます。最初の「/」は、Flash 6 でいう _root と同じです。「:」は、その後に続く文字列が変数名である場合につけます。: がないと、その階層にあるムービークリップを示すことになります。

また、それぞれのパターンを表示した後は、再生を stop() しています。そうしないと、延々とループ再生してしまうためです。

まとめると、このムービークリップは、メインタイムラインにある変数 aiko の内容によって、再生するフレームを変更していることになります。つまり「じゃんけん」と「あいこ」を切り替え表示できるのです。

これとまったく同じ方法で「ぽん」と「しょ」の表示も制御しています。

画像 3：

 

第 2 回　アニメーションとインタラクティブ機能　その 4

ボタンで制御

最初のサンプルは、アニメーションで勝手に動くものでした。そのため、インタラクションがまったく必要ありません。次は、ボタンを使ったアクションを制作してみましょう。

まず、iモード端末で使用可能なボタンについて説明します。

• ボタンが反応するイベント・・・KeyPress、release
• 端末で反応するボタンの種類
  0,1,2,3,4,5,6,7,8,9,*,#・・・文字入力キーとして機能
  上下キー・・・上が Shift+Tab、下が Tab として機能
  決定キー・・・enter キーとして機能

2 つ目のサンプルはこちらです。

サンプルの「amida.fla」を開いてみましょう。

ステージ内と外のボタン

画像 1：

まず、スタート画面にある「スタート」ボタンは、決定キーに割り付けるために、次のようなアクションが設定されています。

1. on (release, keyPress "") {
2. gotoAndPlay(2);
3. }

実際に再生してみると、最初の画面で決定キーを押すと、ミニゲームが始まります。そこで、次に「2」や「8」のキーを押すと、ハリネズミが上下に移動します。さらに、「6」のキーを押すと、ハリネズミは歩き出します。「4」か「5」のキーを押すとハリネズミは止まります。

これらは、画面の外にあるボタンのアクションで動作しています。実際にソースで確認するには、[表示メニュー]-[ワークエリア]を選択し、ワークエリアを見えるようにしてから、2 フレーム目を表示してください。
画面の上に透明ボタンが並んでいるのが分かります。それぞれの透明ボタンでは、ハリネズミの動作を定義したアクションを呼ぶようにスクリプトが書かれています。

画像 2：透明ボタンである点やサイズ、その位置に、特別な意味はありません。

たとえば、6 のキーを押したときのボタン(中断・右のボタン)には、次のようなアクションが記述されています。

1. on (release, keyPress "6") {
2. call("walkhari")
3. }

スクリプトの解説

2 行目の call("walkhari") は、「walkhari」という名前で定義したプログラムの塊（サブルーチンといいます）を呼んでいます。このサブルーチンは、ハリネズミを歩かせるという目的を持っています。サブルーチンが呼ばれると、そこには、「walkhari」として書いてある ActionScript がそのまま実行されます。（call については、後述します）

その他のボタンの活用方法

Flash Lite では、 iモードならではの getURL() の活用方法があります。それらを使用すれば、電話をかけるボタンやメーラーを起動するボタンを作成することもできます。以下に、ボタンの動作と ActionScript の記述方法についてまとめました。

ボタンの動作内容	スクリプト例（ボタンクリック時か、「4」キー押下時に動作）
電話をかける	on (release, keyPress "4") { getURL("tel:0357205210"); }
メーラーを起動する	on (release, keyPress "4") { subject = "TinyToys感想"; getURL("mailto:sales@togoru.net", "", "GET"); }
Web ページを呼び出す	on (release, keyPress "4") { getURL("http://www.togoru.net/i/505/"); }

メーラーを起動する場合で、サブジェクトを指定する場合などは、変数に代入して、getURL の時に「GET を使用して送信」を選択します。mailto: の後に URL パラメータのように続けて記述する方式は、日本語が混じると正しく機能しませんので注意しましょう。

 

第 2 回　アニメーションとインタラクティブ機能　その 5

call と telltarget

Flash Lite の ActionScript で覚えれば、非常に自由にコンテンツの制作が可能になるアクションがあります。
それが、call と tellTarget です。

callとは

call とは、プログラムの塊（サブルーチン）を実行するためのアクションです。サブルーチンは、同じ処理をなんども記述するのが面倒な場合などに利用します。特に Flash Lite では、ファイル容量が大きな問題になりますから、call() を上手に利用してプログラムをコンパクトにすることはとても大切なことです。

Flash Lite で call を定義するときは、再生時に実行しないフレーム（たとえば、アニメーションが終わったあとに作った空白のキーフレームなど）に記述します。実は、call() で呼ばれるフレームアクションも、通常のフレームアクションも、Flash にとっては区別がないため、1 フレーム目に書いてしまうと、call() の中身を実行してしまいます。そのため、わざと通常では再生ヘッドが通らないようなフレームに記述します。

call()で呼ばれる名前は、キーフレームのラベル名になります。

先述の「walkhari」は、実際に17フレーム目のラベル名になっています。call("walkhari") が実行されると、ラベル名「walkhari」のフレームアクションがサブルーチンとして実行されます。call() で呼ばれたフレームアクションからさらに、call() を実行することも可能です。そして、呼ばれた先のフレームアクションが終了すると、呼び出した元の call("walkhari") のすぐ次にある行のアクションを実行します。

画像 1：

call() が function などの関数と異なるのは、引数と戻り値が指定できないことです。引数と戻り値は、無理やり通常の変数を使用して行います。ローカル変数ではないため、他の call() 先のアクションと変数が重複しないように注意しなてくはいけません。また、階層が異なるフレームアクションを call() で実行する場合などは、特にパスにも注意しましょう。

tellTarget とは

tellTargetとは、他のムービークリップを制御するためのアクションです。

1. tellTarget ("hari") {
2. play()
3. }

たとえば、上記の tellTarget では、同じ階層にある「hari」(=ハリネズミ)という名前のムービークリップに対して、play() を実行しています。つまり、hari のアニメーションを再生しているのです。
このように、tellTarget(){... } の {... } の中は、指定されたムービークリップの中で記述したアクションと同じ働きをします。 この tellTarget が活躍するのは、ムービークリップの特定のフレームを表示させたいときなどです。

ムービークリップを思い通りに制御する

さらにムービークリップの X,Y 座標や回転角度を変更したり、透明度を変更するときは、ムービークリップに属するプロパティ値を変更することで可能です。

ムービークリップ「hari」のY座標を変更するときは、以下のようにするだけです。この例では、変数 haripos の値による条件文と絡ませて、Y 座標を変更してます。

1. if (haripos == 0) {
2. hari._y = 29.9;
3. } else if (haripos == 1) {
4. hari._y = 53.6;
5. } else if (haripos == 2) {
6. hari._y = 79.6;
7. } else if (haripos == 3) {
8. hari._y = 102.6;
9. }

上記は .call("showhari")で呼ばれる、ラベル「showhari」のフレームアクションです。

スクリプトの解説

2,4,6,8 行では、Y 座標を変更するために、_y プロパティに値を代入しています。つまり、haripos の値に応じて、ハリネズミは 4 つの道に沿った高さに移動することになります。その他にも、ムービークリップを制御できるプロパティをまとめました。

プロパティ名	プロパティの解説
_x	X 座標
_y	Y 座標
_alpha	透明度（0～100）。ただし、かなり CPU 負荷がかるため注意して使用してください
_visible	見える（true）か見えない（false）
_rotation	回転角度（0～360～・・・）
_xscale	横幅（パーセント）
_yscale	高さ（パーセント）
_width	横幅（読み取り専用：ピクセル）
_height	高さ（読み取り専用：ピクセル）
_currentframe	現在表示しているフレームが何フレーム目か
_totalframes	ムービークリップのすべてのフレーム数（読み取り専用）

ムービークリップは、tellTarget により表示するアニメーションを制御し、プロパティ属性の値により位置やサイズなどを変更できることになります。

今回のまとめ

ムービークリップをスクリプトで制御できれば、ゲームなどのコンテンツが制作できるようになるなど、本格的なコンテンツの第一歩です。ただし、ムービークリップを、使用しすぎると、メモリオーバーのエラーになることがありますので、気をつけながら制作しましょう。

次回は、サウンドについて解説する予定です。

著者について