FLASH オブジェクトをスクリプトで拡大縮小

シンプルな質問だと逆にどう答えようか構えてしてしまいますね。 料理にたとえると， 「目玉焼きの作り方を教えてください。」と質問された感じのような…。 でも，決してバカにしているわけではありません。 サイトも少し探してみましたが，複合的なものはたくさん見つかっても， 「拡大縮小する」単独では良い物は見つかりませんでした。 料理の本に「目玉焼きの作り方」がないのと同じかもしれません。 でも，とても重要なことで，基本的なことですが，そんなに簡単なものでもありません。 正に目玉焼き。簡単そうで奥が深い…。 前置きはこのくらいで。 だんだん拡大縮小させるタイミングですが，ActionScript の場合色々なタイミングが考えられます。 秒単位で拡大，マウスが動いたときに拡大，ステージの大きさが変わったときに拡大，などなど… しかし，モーショントゥイーンを使っても，ActionScriptを使っても， 基本的に Flash はフレームレートを基準にアニメーションします。 ですから，１フレーム進む時間毎に，大きさを変えるのが普通だと思います。 １フレーム進む時間毎に何かをする場合は， 「onEnterFrame」，もしくは「onClipEvent (enterFrame)」を使います。 ですから，これらを使った場合で回答することにします。 「onEnterFrame (MovieClip.onEnterFrame ハンドラ)」 http://livedocs.macromedia.com/flash/8_jp/main/00002490.html 「onClipEvent ハンドラ」（enterFrame - アクション） http://livedocs.macromedia.com/flash/8_jp/main/00001753.html また，バージョンを書かれていませんが， Flash MX 以降（Flash MX 2004系，Flash 8系 を含む）として回答します。 Flash 5 でも可能な物は 「※F5可」 という印を付けておきます。 一応，Flash8，Flash5にて動作検証済みで，スクリプトはコピペで使用可能です。 (勝手に Flash4 以前のバージョンの質問ではないと思うのでFlash4以下は省略。) まずメインのタイムラインのステージ上に，ムービークリップシンボルを作ります。 ムービークリップと言っても，適当な四角を描いてそれをムービークリップに変換するだけのものでもかまいません。 動くものでも動かないものでもそれらを１つのシンボルにしないと，オブジェクトとして扱えませんので，とりあえず大きくしたい物全体を１つのムービークリップにしてください。 ムービークリップに変換したら，そのムービークリップにインスタンス名を付けてください。 ムービークリップを選択した状態で，下のプロパティパネルを開き， パネルの左の方にある 　　　[　ムービークリップ ▼] 　　　[　<インスタンス名>　] となっている <インスタンス名> のに文字列を記入すれば， その文字列がインスタンス名になります。 インスタンス名はアルファベットの大文字か小文字から始まる文字列であれば，だいたい何でもかまいません。 この説明では「A」というインスタンス名を付けたとしておきます。 ◎まず，一般的によくある ActionScript での拡大縮小方法です。 次のスクリプトはメインムービーのタイムラインのフレームに書くスクリプトです。 または，ムービークリップA の中のタイムラインのフレームでもかまいません。 ------------------------------------------- //---準備--- //拡大率の設定[3倍(300％)](可変) var mag_power = 3; //拡大速度の設定(可変) var mag_speed = 25/100; //拡大後の大きさの算出 var end_sclX = _root.A._xscale*mag_power; var end_sclY = _root.A._yscale*mag_power; //---拡大--- this.onEnterFrame = function() { _root.A._xscale += (end_sclX-_root.A._xscale)*mag_speed; _root.A._yscale += (end_sclY-_root.A._yscale)*mag_speed; }; ------------------------------------------- 上のスクリプトをフレームに書くのではなく， 拡大したいムービークリップ自体に書く場合は次のようになります。 ---（※F5可）-------------------------------- //---準備--- onClipEvent (load) { //拡大率の設定[3倍(300％)](可変) var mag_power = 3; //拡大速度の設定(可変) var mag_speed = 25/100; //拡大後の大きさの算出 var end_sclX = _root.A._xscale*mag_power; var end_sclY = _root.A._yscale*mag_power; } //---拡大--- onClipEvent (enterFrame) { _root.A._xscale += (end_sclX-_root.A._xscale)*mag_speed; _root.A._yscale += (end_sclY-_root.A._yscale)*mag_speed; } ------------------------------------------- var ○○ のように前に var が付いた物は，規定の関数でも何でもなく，単なる今勝手に決めた変数です。 「var」自体は varステートメント と呼ばれるもので，一応変数を宣言した形にしています。 上記のように関数外で変数を宣言した場合，その変数は，そのステートメントが含まれるタイムライン全体で使用できます。 Flash では今のところ，必ず変数を宣言しなければならないわけではありませんし， この var を使用しなくてもエラーがでることはありませんが，var を前に付けた方が「変数だ」ということがわかりやすいかと思い付けています。 ---上記スクリプトの説明--- 最初の２行で，拡大率と速度を設定します。 var mag_power = 3; これは，変数mag_power の値を 3 (300％) にするということです。 3 を 2 とか 5 とかに変えてもらうと，拡大する大きさが変わります。 1/3 にすると ３分の１(33.33…％)の大きさまで縮小します。 var mag_speed = 25/100; これは，変数mag_speed の値を 25/100 にするということです。 この 25/100 を，0以上1以下の数に変えてもらうと，拡大する速度が変わります。 当然 1/4 でもかまいません。 詳細は後述。 var end_sclX = _root.A._xscale*mag_power; var end_sclY = _root.A._yscale*mag_power; 拡大率mag_power を決めてしまえば，最終的な大きさが勝手に決まります。 この拡大後の大きさを先に算出させています。 this.onEnterFrame = function() {} これは最初の方で書いた，１フレーム進む時間ごとに{ } 内を実行させるときに使うスクリプトです。 頭の this. はメインムービー自体を指すパスです。 _root.A._xscale += (end_sclX-_root.A._xscale)*mag_speed; 日本語で書くと， ムービークリップAの横サイズを最後の大きさまで，最初に決めた速度の大きさずつ変化させる。 ということです。 +=(加算後代入演算子) は左辺の値に右辺をさらに加算するときに使います。 X = X+1 というのを ActionScript で縮めて書くと X += 1 となります。 当然 X = X+1 という書き方でもかまいません。 現在横サイズ = 現在横サイズ + (最終横サイズ - 現在横サイズ) ×速度 ということです。 mag_speed=25/100　(1/4) だとすると， 残りの距離に対して 25％ ずつ現在の横サイズを近づけるということになります。 結局，拡大率は極限値になるので，何年かけても拡大率の値まで達することはありませんが， モニタで人間が見る場合には近似的にすぐに極限値にたどり着くように見えます。 簡単でなおかつ ActionScript っぽい動きをするのでよく使われる方法です。 ◎次に （何フレームかけて拡大縮小するみたいな・・・。） 　 をする ActionScript での拡大縮小方法です。 次のスクリプトはメインムービーのタイムラインのフレームに書くスクリプトです。 または，ムービークリップA の中のタイムラインのフレームでもかまいません。 ------------------------------------------- //---準備--- //拡大率の設定[3倍(300％)](可変) var mag_power = 3; //拡大速度（拡大するフレーム数）の設定(可変) var mag_frames = 20; //拡大後の大きさの算出 var end_sclX = _root.A._xscale*mag_power; var end_sclY = _root.A._yscale*mag_power; //1フレームで拡大する大きさの算出 var one_sclX = (end_sclX-_root.A._xscale)/mag_frames; var one_sclY = (end_sclY-_root.A._yscale)/mag_frames; //---拡大--- this.onEnterFrame = function() { //Aを1フレームで拡大する大きさずつ拡大 _root.A._xscale += one_sclX; _root.A._yscale += one_sclY; //もし拡大後の大きさに達したら if (_root.A._xscale>=end_sclX) { //大きさを拡大後の大きさで固定 _root.A._xscale = end_sclX; _root.A._yscale = end_sclY; //このthis.onEnterFrameを取り消す delete this.onEnterFrame; } }; ------------------------------------------- 上のスクリプトをフレームに書くのではなく， 拡大したいムービークリップ自体に書く場合は次のようになります。 ---（※F5可）-------------------------------- //---準備--- onClipEvent (load) { //拡大率の設定[3倍(300％)](可変) var mag_power = 3; //拡大速度（拡大するフレーム数）の設定(可変) var mag_frames = 20; //拡大後の大きさの算出 var end_sclX = _root.A._xscale*mag_power; var end_sclY = _root.A._yscale*mag_power; //1フレームで拡大する大きさの算出 var one_sclX = (end_sclX-_root.A._xscale)/mag_frames; var one_sclY = (end_sclY-_root.A._yscale)/mag_frames; } //---拡大--- onClipEvent (enterFrame) { //Aを1フレームで拡大する大きさずつ拡大 _root.A._xscale += one_sclX; _root.A._yscale += one_sclY; //もし拡大後の大きさに達したら if (_root.A._xscale>=end_sclX) { //大きさを拡大後の大きさで固定 _root.A._xscale = end_sclX; _root.A._yscale = end_sclY; } } ------------------------------------------- 最初の２つとの大きな違いは，拡大後の処理が加わるというところです。 拡大するのは良いですが，いつか止めなければ拡大し続けます。 この例では，　var mag_power = 3;　つまり３倍の大きさになったとき拡大を終了するようにしています。 ---上記スクリプトの説明--- var mag_power = 3; 変数mag_power の値を 3 にするということです。 一応拡大率を3倍(300％)にしておきます。可変です。 var mag_frames = 20; これは，変数mag_frames の値を 20 にするということです。 20の場合，20フレームで拡大率まで変化させます。 この 20 を，1以上の数に変えてもらうと，拡大する速度が変わります。 var end_sclX = _root.A._xscale*mag_power; var end_sclY = _root.A._yscale*mag_power; 拡大率mag_power を決めてしまえば，最終的な大きさが勝手に決まります。 この拡大後の大きさを先に算出させています。 var one_sclX = (end_sclX-_root.A._xscale)/mag_frames; var one_sclY = (end_sclY-_root.A._yscale)/mag_frames; 最終的な大きさと現在の大きさとの差をフレーム数で割れば， １フレームあたりに変化する大きさが求められます。 this.onEnterFrame = function() {} １フレーム進む時間ごとに{ } 内を実行させるときに使うスクリプトです。 _root.A._xscale += one_sclX; _root.A._yscale += one_sclY; Aの大きさを１フレームあたりに変化する大きさずつ拡大させます。 上述の通りで， _root.A._xscale = _root.A._xscale+one_sclX; _root.A._yscale = _root.A._yscale+one_sclY; と同じことです。 if(_root.A._xscale>=end_sclX){ } if文です。 もし，Aの大きさが，最終の大きさと以上になった場合 { }内を実行します。 _root.A._xscale = end_sclX; _root.A._yscale = end_sclY; 一応，Aの大きさを拡大率で指定した大きさで固定します。 delete this.onEnterFrame; そして，１フレーム進む時間ごとに{ } 内を実行させるというスクリプトを解除します。 ※ onClipEvent (enterFrame) {} の場合 このムービークリップ自体が消えるまで解除できません。 だから，大きさを固定するだけで終わっています。 まとめると， ActionScript の用語としては，次のようなものが出てきただけです。 _xscale：x軸方向の大きさ _yscale：y軸方向の大きさ onEnterFrame = function() {};：１フレーム進む時間毎に１回{ }内を実行 onClipEvent (enterFrame) {}：１フレーム進む時間毎に１回{ }内を実行 delete this.onEnterFrame;：onEnterFrameの解除 if (○○) {}：もし○○がtrueであれば{ }内を実行 あとは，勝手に決めた変数と値が登場するだけです。 それも簡単な四則演算ですね。 決して「ActionScriptは難しい」のではありません。 ActionScriptは簡単なのですが， 「工夫し考えながら方程式を作るのが面倒でややこしい」ということです。 だいたいそんな感じが多いと思います。 「目玉焼きが難しい」のではなくて， 焦がさないように，なおかつ黄身まで火が通るように， 「工夫し考えながら焼くのが面倒でややこしい」 というわけです　（まだ目玉焼きに喩えてる…）。 ちなみにムービークリップ A をステージの真ん中より左上に置いて， 上で書いたスクリプトの 全ての _xscale を _x に書き替え， 全ての _yscale を _y に書き替えると違う動作をします。 _x は x座標，_y は ｙ座標 という意味です。 こんな実験をすると理解が深まるかもしれません。 ======== ======== ======== ======== 上の例では MovieClip.onEnterFrame = function() {}; と onClipEvent (enterFrame) {} で一定時間ごとにムービークリップを少しずつ大きさを変化させる方法を書きました。 他にも，ミリ秒単位で関数を呼び出す setInterval 関数 や， SWF ファイルを再生し始めてからの経過時間をミリ秒単位で返す getTimer 関数 とonEnterFram を組み合わせるという方法で一定時間ごとにムービークリップを少しずつ大きさを変化させる方法もあります。 機会があれば，いろいろやってみるのも良いと思います。