現在位置の分かるスライドボタン

質問

いつもお世話になっております。
flashで、数字を押すとそのページにスムーズスクロールするボタンがあります。
これを現在表示しているページが分かるように番号の色を変えたいと思っています。
例えば白いボタンが
１　２　３　４　５
と並んでいて
２を押すと２だけ赤になっていて３を押すと今度は３が赤に…
というものを作りたいのです。

どこかの記事でそういう独自のスクリプトはなく、自作するしかない、というものを見ましたが記事を紛失してしまいました。
どう検索してよいかも分からず的を得たものにいきあたりません。

必要な情報がありましたら教えて下さい。
制作環境はmacOSX、flashMX2004です。
どうぞ宜しくお願いします。

回答No.1

noname#35109

難しいことや ActionScript などを考える前に，
Flash は元々タイムラインでアニメーションするソフトです。
そこをうまく利用すれば簡単だと思います。

> どう検索してよいかも分からず的を得たものにいきあたりません。

どこにでも答えはあります。

ご質問で書かれていらっしゃるように，そういう独自のスクリプトはありません。
しかし，Flash はタイムラインを移動するアニメーションソフトなのですから，
ムービークリップでボタンを作れば，基本的には，
MovieClip.gotoAndPlay() もしくは
MovieClip.gotoAndStop() だけで，どうにでもなりますでしょう。

要は 「チェックボックス」 のような動きをするボタンだと思います。
「Adobe Flash」 の使い方ではなく 「Suzuka」 の使い方のページですが↓。

チェックボックス サンプル＆作成方法解説
http://suzupara.iinaa.net/check.html

※ ダウンロードできるサンプルは Suzuka 用ファイルで，
　　FLA ファイルではありませんので，
　　ダウンロードしても Flash では閲覧できませんよ。

上の URL にも図示してありますが，

////////////////////////////////////////////////////
　ムービークリップ内タイムライン
　フレーム1　フレーム2　フレーム3　フレーム4　フレーム5　フレーム6　
　アップ1　　 オーバー1　ダウン1　　アップ2　　 オーバー2　ダウン2
///////////////////////////////////////////////////

というような画像をそれぞれのフレームに用意しておいて，
ムービークリップの中のフレームを行ったり来たりさせれば良いだけです。
当然，他のフレーム配置でも良いですし，それぞれが単フレームでなく複数フレームあっても良いです。
また，６フレーム分の絵を用意するのが面倒でしたら「ON状態」「OFF状態」という２フレーム分だけででも良いです。
何にしても，
ムービークリップの中のフレームを行ったり来たりさせれば良いだけです。

ただし，
ムービークリップでボタンを自作した場合，
階層が変わりますから，階層には気を付けてください。

メインムービーのタイムラインにボタン（ボタンシンボルのインスタンス）があったとします。

　_root
　　　└ ボタンインスタンス

この場合，ボタンインスタンスから，_root のフレームを play(); させたいと思ったときは，

on (release) {
play();
}

で _root のタイムラインが再生開始されます。
しかし，
メインムービーのタイムラインにムービークリップがあったとします。

　_root
　　　└ ムービークリップ

この場合，
ムービークリップ自体に直接書く場合は，

on (release) {
_parent.play();
}

もしくは，絶対パスで

on (release) {
_root.play();
}

と書かなければなりません。
ムービークリップは１つの階層を持ちます。

上の URL のサンプルにあるように，
ムービークリップ自体に直接書くのではなく，ムービークリップ内のタイムラインに書く場合は，

// このムービークリップからマウスアップしたときの動作定義
this.onRelease = function() {
this._parent.play();
};

などになります。

あと，上の URL のチェックボックスだと，複数選択可能なチェックボックスです。

> １　２　３　４　５
> と並んでいて
> ２を押すと２だけ赤になって…

というわけですから，
どのボタンを押しても，全てのボタンムービークリップ内のタイムラインを1に戻して，
押したボタンムービークリップだけをフレーム4に進めるようにしなければなりませんね。

もし， １　２　３　４　５ と並んでいるボタンに，
btn_mc1，btn_mc2，btn_mc3，btn_mc4，btn_mc5　というインスタンス名を付けたとした場合，

// このムービークリップからマウスアップしたときの動作定義
this.onRelease = function() {
for(i=1;i<=5;i++){
// btn_mc1～5 を全てフレーム1へ
_root["btn_mc"+i].gotoAndStop(1);
// btn_mc1～5 を全ての変数 flag を false にする
_root["btn_mc"+i].flag = false;
}
// 自分自身はフレーム4へ
this.gotoAndStop(4);
// 自分自身の変数 flag は true にする
this.flag = true;
// 何か適当な動作をする
this._parent.play();
};

というような感じにする必要があると思います。
別に for文を使用する必要もありませんが，使用してみただけです。

とにかく，何にしても，そういう独自のスクリプトはありませんが簡単ですね（あってもきっと困ります）。
ムービークリップを使用したタイムライン制御というFlashアニメーションの基本でできます。

お礼

sassakunさんですよね？
名前がなくなっているようですが改めて質問させて頂きます。
やってみましたがボタンの色が変化するだけでスクロールしなくなってしまいました。
// このムービークリップからマウスアップしたときの動作定義
this.onRelease = function() {
for(i=1;i<=5;i++){
// btn_mc1～5 を全てフレーム1へ
_root["btn_mc"+i].gotoAndStop(1);
// btn_mc1～5 を全ての変数 flag を false にする
_root["btn_mc"+i].flag = false;
}
// 自分自身はフレーム4へ
this.gotoAndStop(4);
// 自分自身の変数 flag は true にする
this.flag = true;
// 何か適当な動作をする
this._parent.play();
};

これはどこに書くのですか？

補足

ご自身のサイトを提示して頂きありがとうございます。
慣れている方には簡単そうでも私には難しそうですがご回答通りやってみます。