ささきち流 Suzuka & ParaDraw 講座
Suzuka & ParaDraw
TOP
PROFILE
ActionScript Editor
LINK
BBS


フリーのFlash作成ソフト SuzukaParaDraw でFlashな生活を楽しもうというサイトです。
Suzuka 基礎・基本 タイムラインの制御

 今回は,簡単な ActionScript と,スプライトの基本的な活用方法を説明します。説明に使っているSuzuka のバージョンは Ver. 0.7.2 です。

 前回の「ものをトィーンで動かす」では,タイムラインの再生ヘッドを全く制御していないので,単にアニメーションがループ再生されるだけです。
 今回は少しインタラクティブにアニメーションをさせてみます。

 今回するような制御は,Suzuka のアクションパネルの「簡易モード」でもできることばかりなのですが,発展性を考えて,ActionScript(アクションスクリプト) を使用する方法を書きます。

 タイムラインの制御には,
 stop(); ←停止
 play(); ←再生
 gotoAndStop(フレーム); ←指定フレームに進ませて停止
 gotoAndPlay(フレーム);  ←指定フレームに進ませて再生
というような関数があります。

 また,スプライト内にもタイムラインを持ちますから,命令を出すスプライトが違う場合には,
 スプライトインスタンス.stop();
  ↑スプライトインスタンスの停止
 スプライトインスタンス.play();
  ↑スプライトインスタンスの再生
 スプライトインスタンス.gotoAndStop(フレーム);
  ↑スプライトインスタンスを指定フレームに進ませて停止
 スプライトインスタンス.gotoAndPlay(フレーム);
  ↑スプライトインスタンスを指定フレームに進ませて再生
というMovieClipクラスのメソッドを使用します。  

 レイヤー上に挿入されたスプライトインスタンスは,ActionScript ではMovieClip(ムービークリップまたはMC)に相当します。
 Suzuka のヘルプを見ても MovieClip や ムービークリップ という言葉は出てきませんが,ActionScript を使う上で,スプライトインスタンスは,MovieClip です。ActionScript の参考書やサイトを見る場合,「MovieClipインスタンスとはスプライトインスタンスのことである」として見てください。  

 まずはサンプル Flash 。

 まずは,上のようにアニメーションをループ再生をさせない方法です。
 アニメーションする「赤玉」や「青玉」などのレイヤーとは別に,アクションレイヤーを挿入します。
 そして,アクションレイヤーの最終フレームをキーフレームにし,そのキーフレームを選択した状態で,下の「スクリプトを編集」ボタンをクリックします。
 すると「スクリプトエディタ」が起動しますから,そこに,

 stop();

 を書きます。
 これで,アニメーションの再生ヘッドはそこで止まるのでループ再生はしなくなります。

 また,「停止」「再生」「最初から再生」ボタンも用意しています。
「停止」ボタンのアクションは次のように書いています。

 on (release) {
   stop();
 }

 on (release) というのは,ボタンまたはスプライトインスタンス自体に直接書ける,onハンドラ と呼ばれるもので,「クリックしたとき(マウスで押してそのマウスを上げたとき)」に { } 内が実行されます。
 上の場合は,クリックしたときに stop(); が実行され,再生ヘッドが停止します。

 「再生」ボタンのアクションは次のように書いています。

 on (release) {
   play();
 }

 同じく,クリックしたときに play(); が実行され,再生ヘッドが次のフレームへと動きだします。

 「最初から再生」ボタンのアクションは次のように書いています。

 on (release) {
   gotoAndPlay(1);
 }

 同じく,クリックしたときに gotoAndPlay(1); が実行され,再生ヘッドがフレーム1に進んだあと動きだします。
 こういうものを用意すると,インタラクティブに動作する Flash が作成可能になります。
 ここまでは,on (release) と,stop(); や play(); など,タイムライン制御の関数を使用したものです。

 

 上の状態だと「赤玉」「青玉」は同じメインのタイムラインに存在します。再生ヘッドはタイムライン上を進行するので,片方だけを止めるということはできません。

 「赤玉」の動きと「青玉」の動きを別々に制御したい場合は,違うタイムラインに入れなければなりません。
それが次の例です。

 「赤玉」は「赤玉親」スプライト(インスタンス名:redMC),「青玉」は「青玉親」スプライト(インスタンス名:blueMC)に入っています。
 「赤玉親」や「青玉親」の中のタイムラインは両方とも 40フレーム になっていて,その中で「赤玉」や「青玉」をトゥイーンで動かしています。

 この場合,ボタンに,

 on (release) {
   stop();
 }

 と書いても,メインのタイムラインの再生ヘッドが停止するだけです。
 メインのタイムラインはそもそも1フレームしかないので,停止も再生もありません。フレーム1が表示されるだけです。

 そこで,stop(); や play(); などという関数ではなく,
 スプライトインスタンス.stop();
 スプライトインスタンス.play();
 というようなMovieClipクラスのメソッドが必要になります。

「赤玉親」スプライトには,インスタンス名として「redMC」,
 「青玉親」スプライトには,インスタンス名として「blueMC」,を付けています。
 このインスタンス名がレイヤーに配置されたスプライトインスタンスの名前になります。

 したがって,「赤玉親」スプライトの再生ヘッドを停止させるボタンのスクリプトは,

 on (release) {
   redMC.stop();
 }

 となります。

 また,「青玉親」スプライトの再生ヘッドを停止させるボタンのスクリプトは,

 on (release) {
   blueMC.stop();
}

のようになります。

 両方止める場合は,両方に命令しなければなりませんから,

 on (release) {
   redMC.stop();
   blueMC.stop();
 }

となります。

 ボールを転がすのではなく,ボタンによって違うフリップのようなものを例えば左から中央に出すようにすると,ボタンによって違う画面を出し入れするような画面転換も可能になります。

 stop();
 play();
 gotoAndStop(フレーム);
 gotoAndPlay(フレーム);

 スプライトインスタンス.stop();
 スプライトインスタンス.play();
 スプライトインスタンス.gotoAndStop(フレーム);
 スプライトインスタンス.gotoAndPlay(フレーム);

 たったこれだけのスクリプトについてしか書いていませんが,使い方次第で,かなりすごいものを作ることができます。
 また,これらの再生ヘッド制御スクリプトはタイムラインベースのソフトのスクリプトの根幹になります。
 スプライトインスタンスを使いこなすことと,そこで上のようなタイムライン制御のスクリプトが使えるかどうかが ,Suzuka で 高度な Flash を作れるかどうかの要だと考えて良いと思います。

 

サンプルダウンロード
PDRファイル・CSFファイル在中
「kiso031.zip」 4.73 KB (4,853 バイト)