Flashを使ったメニューでボタンでアニメーションを制御したいです。

質問

Flashを使ったメニューでボタンでアニメーションを制御したいです。

【環境】
Adobe Flash CS3
WindowsXP

http://www.hookoo.net/test/
上記リンク先を見ていただきたいのですが、ActionScript1.0＆2.0の設定でメニューを作成しています。ボタンとアニメーションの連動で詰まってしまったので、どなたか教えていただけないでしょうか。

【構成】
index.html(fruit.swf)
├apple.html
├orange.html
├grape.html
└melon.html

【アニメーションの内容】
(1)マウスがどのボタンにも乗っていない場合、後ろのフルーツの絵が4秒おきに切り替わる（後ろのタイル上の背景は10f単位でフェードイン・アウトしながら切り替わっています）

(2)ボタンにマウスが乗ったら対応するフルーツを表示（appleボタンにオーバーするとりんごを表示）

(3)ボタンをクリックすると対応したページ(apple.htmlなど)にジャンプ

【やりたいこと】
(2)の段階で、現状では各ボタンにgotoAndStop()を指定しているだけですので、ボタンにマウスオーバーしていても4秒経つと次のフルーツが表示されてしまいます。これを対応するフルーツを表示したまま止まるようにしたいです（appleのボタンにオーバーしている時はりんごを表示して止まる。）
各フルーツの最後にstop()を入れてしまうと、マウスオーバーしていない状態でフルーツを自動で切り替えることができなくなってしまいます。

拙い内容ですが、flaファイルは下記からDLできますので見ていただければ分かりやすいと思います。
http://www.hookoo.net/test/fruit.fla

どなたか教えていただけますと幸いです。よろしくお願いいたします。

回答No.3

BlurFiltan · ベストアンサー

いくら頑張っても回答字数制限を超えるため回答を２つに分けます。

～ 回答 その２ ～

では次に
作り直したボタンのスクリプトです。

「Apple」ボタン（インスタンス「menu01_1」）には次のように書きます。

---------------
on (rollOver) {
//ボタンロールオーバーのフラグをtrueにする
over_flag = true;
gotoAndPlay(1);
}

//ロールアウトまたは外でマウスを放したとき
on(rollOut, releaseOutside){
//ボタンロールオーバーのフラグをfalseにする
over_flag = false;
//再生開始
play();
}

on (release) {
getURL("apple.html");
}
---------------

「Orange」ボタンには次のように書きます。

---------------
on (rollOver) {
//ボタンロールオーバーのフラグをtrueにする
over_flag = true;
gotoAndPlay(120);
}

//ロールアウトまたは外でマウスを放したとき
on(rollOut, releaseOutside){
//ボタンロールオーバーのフラグをfalseにする
over_flag = false;
//再生開始
play();
}

on (release) {
getURL("orange.html");
}
---------------

「Grape」「Melon」ボタンについても同様です。
ボタンによって
gotoAndPlay(○○)
と
getURL("△△")
の部分を変えるだけです。

以上で
「対応するフルーツを表示したまま止まる」ものができると思います。

=================

ただ...
上記のままでは背景も止まってしまいます。
それで良しとする場合はそれで良いのですが
それではダメとする場合はそこも変えなければなりません。

これには「ムービークリップ」を理解する必要があります。

ムービークリップ内のタイムラインに点滅する背景アニメーションを作って
そのムービークリップを背景のレイヤーに配置すれば良いのです。

「点滅する動作」は１クールだけで良いです。
今のように何度も同じパターンを繰り返し作らなくて良いです。
むしろその方が 作成 も 作り替え もずっと楽だと思います。

Flash とは ムービークリップ (階層) を利用して作るものです。
MovieClipクラス の スクリプト も山ほどあります。

また メインのタイムライン_root も実はムービークリップの一種です。

とにかく「ムービークリップ」をしっかり理解してください。
そして「ボタン」 もです。

ボタンの理解は簡単です。
ムービークリップはひょっとしたら数ヵ月かかるかもしれませんが頑張ってください。

「ムービークリップを理解しムービークリップを作成するということ」
それが「Flash を理解し Flash を作成すること」と言っても過言ではありません。

※ムービークリップを理解しなければ
　 簡単な ActionScript もまともに使えません。

=================

本題の
フラグ(籏)と動作のイメージ図↓

お礼

詳細にご回答いただいて、本当にありがとうございます！　付けていただいた画像も分かりやすかったです。質問して本当に良かったと思いました。ボタンについて解説されたサイトは今後も参考にできそうです。

解説いただいた通りに修正したところ、無事やりたいことができました！　ただ、りんごだけメニューにマウスオーバーした状態でもアニメが止まりませんでした。色々試してみたんですが、フレーム1に書いた
------------------------
//ボタンロールオーバーのフラグをfalseにしておく
over_flag = false;
------------------------
と、「Apple」ボタンに書いた
------------------------
on (rollOver) {
//ボタンロールオーバーのフラグをtrueにする
over_flag = true;
gotoAndPlay(1);
}
～以下略～
------------------------
が、フレーム1でバッティングしてるのがまずいのかなと素人ながら思い、図のようにアニメーションが始まるフレームを後ろに1つずらしたところ、上手くいきました。これが正しい回避方法なのかはちょっと不安ですが…。
ちなみに背景のパタパタも試しにムービークリップにしてみたんですが、それも上手くいった（？）ようです。実はボタンにロールオーバーしたりロールアウトする度に背景までチラチラするのが気になっていたんですが、それも解消されました。フレームのコピペ作業が本当に手間だったこともあり、これはすごく便利ですね。
今後も、ボタンとムービークリップについて勉強したいと思います。本当にありがとうございました！

修正後のテストページ↓
http://www.hookoo.net/test/

修正後のflaファイル↓
http://www.hookoo.net/test/fruit_ans2.fla

回答No.2

BlurFiltan

いくら頑張っても回答字数制限を超えるため回答を２つに分けます。

～ 回答 その１ ～

大まかな筋道は
ボタンにロールオーバーしたかしていないかというフラグとなる変数を用意して，
その変数の値(true/false)によってタイムラインの再生か停止を決めれば良いと思います。

しかし！
その前に「ボタン」というものを理解していらしゃらないようですから
「ボタン」の理解と作成からすべきです。

「ボタンを理解しよう！」
http://1art.jp/flash/le/lesson8/lesson8.htm

↑じっくりと理解するのは後からしてもらうとして，
ボタンを作り直します。

例えば，「menu01_1」というインスタンス名を付けられたボタンは
ボタンインスタンスではありますが，ボタンシンボルではありません。
また「ライブラリ」を見てもらうと「メニュー01_1」というシンボル名が付けてあります。

この「メニュー01_1」というシンボルを右クリックするなどして，
「プロパティ」を選択し，
「シンボルのプロパティ」パネルより
　タイプ(T)[ ボタン ]
に変更します(図↓上)。
変更と言うより，あるべき姿に戻します。

そして，ステージ上の「menu01_1」インスタンスをダブルクリックするなどして，
その内部の編集に移ります。

内部は 「アップ」「オーバー」「ダウン」「ヒット」 という４つのフレームがあると思いますから，
２フレーム目の「オーバー」を "空白キーフレーム" にして，
そこに マウスオーバー状態の 「Apple」 の絵を配置します。
↑絵を配置するのですよ。
　マウスオーバー状態の 「Apple」 のシンボルではありません(図↓下)。

この作業を「Orenge」「Grape」「Melon」についてもします。
つまり
「menu_on」レイヤーに置いてある「menu01_2」～「menu04_2」は全て不要なんです。

ここまで来てやっとスクリプトです。

メインのタイムラインに ActionScript 用のレイヤーを１つ用意します。
そしてその レイヤー の フレーム1 に
次の２行(実質１行)を書きます(コピペします)。

------------------------
//ボタンロールオーバーのフラグをfalseにしておく
over_flag = false;
------------------------

そして フレーム119(ラベルorangeの１つ前) を空白キーフレームにして
その キーフレーム に次のように書きます。

------------------------
//ボタンロールオーバーのフラグがtrueであれば
if (over_flag) {
//再生を停止
stop();
}
------------------------

フレーム239 も フレーム359 も フレーム480 も同様に 空白キーフレームにして，
フレーム119 と全く同じスクリプトを書きます。

つまり
　フレーム1で変数「over_flag」というものを用意して
　その変数の値によって
　フレーム119，239，359，480 で
　停止するかしないかを変える。
ということです。

回答No.1

76masa

flaファイルは見ていませんので、詳しい事はかけませんが。

ロールオーバー時　→　背景のMC.gotoAndStop()
ロールアウト時　　→　背景のMC.plya()

にすれば良いのでは？

あと、
>現状では各ボタンにgotoAndStop()を指定しているだけです
との事ですが、gotoAndStop()だと止まるはずですが、
動いていると言う事は、gotoAndPlay()を使ってるのでは？

お礼

各フルーツごとにムービークリップにするなど試してみたんですが、自力で完成させることができませんでした…。回答していただいたのに本当にすみません。まず、フルーツがアニメーションしなくなってしまったり…という状況です。
それと、完全に勘違いしてgotoAndStop()と書いてしまいましたが、gotoAndPlay()でした。混乱させてしまいましたら恐縮です。
ご回答いただきありがとうございました！