FlashCS3でプログラミングを行う際に知っておきたい基本的な仕組みの一つに「プロパティ」と「メソッド」という考え方があります。この二つの仕組みを見てみましょう。

表示されているインスタンスをスクリプトで動かす

 今回からは,スクリプトを使ってムービーを制御する方法を学習します。まずは,とりあえずスクリプトを書いて,ステージ上に配置してあるインスタンスを動かしてみましょう。

図1:スクリプトでインスタンスを動かす(クリックすると別ウィンドウで表示します)

 図1のムービーは,スクリプトを使って画面上の四つのインスタンスの位置や大きさを移動しています。また,インスタンスの大きさに応じて,四つのインスタンスの重ね順を随時変更しています。つまり,スクリプトを使って「位置」と「大きさ」,さらには「重ね順」をコントロールしているわけですね。

 このように,スクリプトでステージ上に配置したインスタンスを制御する方法を見てみましょう。

ステージ上のインスタンスにアクセスするには名前が必要

 まず,新規Flashドキュメントを作成し(*1),任意の名前で保存します。このFlashドキュメントのステージ上に,なんでも良いので図形を一つ描き,その図形をスクリプトから動かしてみましょう。

 まず,図形をスクリプトから動かすには,「どれを動かしたいのか」を指定するための「名前」である「インスタンス名」を付けます。また,インスタンス名を付けるには,「シンボル化」という作業が必要になります。

 では,その手順を追ってみましょう。

 ステージ上に任意の図形を描いて選択し,[F8]キーを押して「シンボル化」します(図2)。

図2:図形のシンボル化

 図2では[多角形]ツールを使って,星型の図形を一つ描き,シンボル化してみました。また,シンボル化する際の[名前]欄には「Star」としてみました。これで図形をシンボルとして登録できました。[Ctrl]+[l]キーを押して[ライブラリ]パネルを表示してみると,「Star」という名前で図形が登録されていることが確認できます。

 続いて,インスタンス名を付けましょう。ステージ上のインスタンス(*2)を選択し,今度は[Ctrl]+[F3]キーを押し,[プロパティインスペクタ]を表示し,[インスタンス名]の所に「star1」と入力します(図3)。これで準備はOKです。

図3:インスタンス名を付ける

 これでこの星型の図形は「star1」という名前で扱えるようになりました。では,この「star1」というインスタンス名を使って位置を移動してみましょう。

 タイムラインの左下にある[レイヤーの追加]ボタンを押し,新規レイヤーを一つ追加します(*3)。このレイヤーを選択し,[F9]キーを押して[アクション]パネルを表示します。ここにActionScriptの命令文(コード)を記述していきます(図4)。

図4:[アクション]パネルにコードを記述する

 今回は,以下のようにコードを記述してみましょう。

star1.x = 100;
star1.y = 200;

 1行目は「star1」の横位置(x座標)を管理する「x」という要素の値を「100」に変更する,という内容。2行目は同じく「star1」の縦位置(y座標)の管理する「y」という要素の値を「200」に変更する,という内容です。

 このコードを記述したFlashドキュメントを[ムービープレビュー]でプレビューしてみましょう。すると,「star1」がスクリプトで指定した位置である横位置が「100」,縦位置が「200」の位置へと移動していることが確認できますね(図5)(*4)。

図5:指定座標への移動(ソースコード=flaファイルをこちらでダウンロードできます

 このように,ActionScriptで命令を行うには,基本的に,

インスタンス名.要素 = 変更後の値;

というように,インスタンス名と要素名を「.」(ドット)で繋ぎ,さらに,変更後の値を「=」(イコール)で繋いで記述します。この場合のイコールは,「=」の右側の値を左側の要素に「代入」するという意味になります。

 また,このときの「x」や「y」等の各要素のことを「プロパティ」と呼びます。1行目のコードは「star1の『xプロパティ』の値を100に変更」する命令であり,2行目のコードは「star1の『yプロパティ』の値を200に変更」する命令となります。