動きを伴うフェードインフェードアウトするmcをボタンで制御したい

質問

4つ前の質問と類似するのですが、四角形のムービークリップを透明度0から100になりつつ移動させたいと思っています。
単純に制御だけするなら
onClipEvent (load) {
function move() {
dx = 10;
// x方向の移動量
dy = 0;
// y方向の移動量
time = 0;
// 時間カウント用
}
}
onClipEvent (enterFrame) {
function move2(){
// 毎フレームごとに移動量を増やしていく
dx *= 0.9;
dy *= 0.9;
// 毎フレームごとに移動量を座標に足しこむ
_x += dx;
_y += dy;
}
}
で動作したのですが、ボタンを押した時にはじめてこの動きを出したいと思っています。

そこで
onClipEvent (load) {
function move() {
dx = 10;
dy = 0;
_alpha = 0;
time = 0;
}
}
onClipEvent (enterFrame) {
function move2(){
dx *= 0.9;
dy *= 0.9;
_alpha += 5;
_x += dx;
_y += dy;
}
}

と書いて、ボタンには
on(release){
this.player.move();
this.player.move2();
}
と書いたところ、それぞれの動きが別になってしまいました。

また、他のボタンを押したときはこれと逆に消えていく動きのあとにこれと同じ動きで四角形が出て来てもらいたいのですがどのようにしたらよろしいでしょうか？どなたかおわかりになる方教えていただきたいです。宜しくお願いします。

回答No.3

noname#35109 · ベストアンサー

＃１です。

switch文などを使っても，
ダラダラとスクリプトが縦に長くなるだけでしょう。

初心者であるのでしたら，
単純に，

// _root.flag が 2 で なおかつ player1 の座標が 1 以下
// （player2 は飛ばして）
// なおかつ player3 の座標が 1 以下 …
// なおかつ player12 の座標が 1 以下
if (_root.flag == 2 && _root.player1._x <= 1&& _root.player3._x <= 1&& … && _root.player12._x <= 1) {

などとまず考えるべきです。
また，これで一応できます。
「なおかつ （&&）」 の書き方もちゃんと提示してありますよね。
それを使えば良いのです。

以上が最も初心者向けな回答だと思います。

横長になるのがいやであれば，
もっと合理的な方法を考えるのが一番でしょう。
考えて実現することが一番良い方法です。
プログラミングは基本的に覚えるものではありません。
「この場合はどうするのだろう？」
と思うより，
「この場合はどうしよう？」
とまず考えないと先に進めません。

> 環境はflash mx2004です。

そうでしたか。
それでは，Flash MX 以上で使えるようになった，
フレームに何でも書いてしまう方法例を "別法として" 書いておきます。
こういうときに，
共有の function を用意したりすると便利になるのです。
（今回も別にユーザ定義関数を使うわけではありませんが）。

動かす player は，
「player1」～「player12」を用意します。
それぞれの player を動かすためのボタンにもインスタンス名を付けます。
「move1_btn」～「move12_btn」 と付けたとしておきます。

その，
「player1」～「player12」や
「move1_btn」～「move12_btn」 が存在する，
_root の フレームに書くスクリプトです。

////////////////////////////////////////////////////////
// スピードの設定（※可変）
var spd = 1/8;
// ムービークリップの個数を指定（※可変）
var MCNum = 12;
// 変数 flag の初期化
var flag = 0;
// player1 ～ MCNum の初期化
for (i=1; i<=MCNum; i++) {
// 全て透明に そしてx座標を0にする
_root["player"+i]._alpha = 0;
_root["player"+i]._x = 0;
}
//
// ------
//
_root.onEnterFrame = function() {
// sum_x の初期化
sum_x = 0;
// player1 ～ MCNum の座標合計を算出
for (i=1; i<=MCNum; i++) {
sum_x += +this["player"+i]._x;
}
//
// 座標合計が 2 以下 または
// flag 番号 のムービークリップ の x座標 が 1 以上であれば
if (sum_x<=2 || this["player"+flag]._x>=1) {
// flag 番号 のムービークリップを x=90 に近づける
this["player"+flag]._x += (90-this["player"+flag]._x)*spd;
// アルファ を 100 に近づける
this["player"+flag]._alpha += (100-this["player"+flag]._alpha)*spd;
} else {
// それ以外
for (i=1; i<=MCNum; i++) {
// flag 番号 のムービークリップを x=0 に近づける
this["player"+i]._x += (0-this["player"+i]._x)*spd;
// アルファ を 0 に近づける
this["player"+i]._alpha += (0-this["player"+i]._alpha)*spd;
}
}
};
//
// ------
// move1_btn ～ move(MCNum )_btn の動作定義
for (i=1; i<=MCNum; i++) {
// 各ボタンの固有値変数 n の設定
_root["move"+i+"_btn"].n = i;
_root["move"+i+"_btn"].onRelease = function() {
_root.flag = this.n;
};
}
////////////////////////////////////////////////////////

以上です。

「player1」～「player12」や
「move1_btn」～「move12_btn」 にスクリプトを書く必要は全くありません。
全ては，_root のフレームで定義します。
こうすれば１つ１つのムービークリップなどにほとんど同じスクリプトを書き続ける必要がなくなり，
面倒くさくなくて良いのです。
また書き替えミスも防げますし，容量も削減できます。

しかし，初心者的ではありませんね。
コピペして「できた」で終わってしまう可能性もあります。
私はそれでもかまいませんが，進歩しませんよ。

ですから，
できれば，最初に書いた

// _root.flag が 2 で なおかつ player1 の座標が 1 以下
// （player2 は飛ばして）
// なおかつ player3 の座標が 1 以下 …
// なおかつ player12 の座標が 1 以下
if (_root.flag == 2 && _root.player1._x <= 1&& _root.player3._x <= 1&& … && _root.player12._x <= 1) {

のスクリプトを使ってなんとか作って，
あとは考えるのが一番だと思います。

文を短く書くとか，
function を定義するとか，
そんな小手先のことはどうでも良いのです。

まずは動くように自分で考える。
動いてから余裕があれば，スクリプトを合理的にまとめる。
そういうことが大切です。

お礼

お返事が遅くなって申し訳ありません。
丁寧な説明ありがとうございました！頑張って勉強していきます！！

回答No.2

noname#35109

＃１です。

> 四角形が再び出てくると10pxほど右にずれた位置で静止します。。
> なぜでしょうか？？

わかりません。
そうなる原因がわからないというのではなくて，
同じ物を再び最初から作り直して，
スクリプトをコピペしなおしてもそうならないので，
わからないということです。

出てくるときは，必ず，

　// 初期座標に設置
　_x = myx;
　_y = myy;

の部分を通りますから，
初期位置は元の位置にもどるはずです。
元の位置がおなじであれば，
そこから
dx = 10; が 0.9 ずつ減って行く量は同じになるので，
同じ位置で止まる（実際には止まりませんが止まったように見える）位置は同じはずです。

そのつもりで書いていますし，
実際に作っても書いたとおりになりますし，
このサイトのページに書いたものをコピペしても結果は同じでしたよ。

///////////////////////////////////////////////////

> 例えばボタンAをクリックしてフェイドインしてきたplayerが
> X座標90以下0未満の位置にあるときに
> ボタンBをクリックすると、
> playerはフェイドアウトしながら
> 一度X座標0に戻る。
> その後同じ幅、高さの四角形のムービークリップで
> 内容の違うplayer2がX座標90の位置まで
> フェイドインしてくる。

「X座標90以下0未満の位置」と書かれていますが，
おそらく，
「X座標90以下0より大きい位置」の書き間違いでしょうね。

＃１ で書くべきでしたが，
ご使用の Flash の バージョンは何なのでしょうか。
どうもしっくり来ない書き方をされているのは，
Flash 5 を使われているのかもしれないと思いました。
それなら，
enterFrame を，ムービークリップ自体に onClipEvent (enterFrame) の形で使用するしかないので，
ついでに，ムービークリップ自体に複雑な function などを定義する理由もわからいことはありません。

というわけで，
ご使用の Flash の バージョンが，Flash5 であるという条件で，
Flash 5以上のバージョンならどれでも使用できるように書きます。

ｘ座標の初期位置は 0 で，
最終到達目標が 90 なのですよね。
それでしたら，
根本的にスクリプトを変えた方が良いと思います。
もっと簡単になります。

インスタンス名 「player1」 というムービークリップに書くスクリプト↓。

--------------------------------------------
onClipEvent (load) {
// スピードの設定（※可変）
spd = 1/8;
// このムービークリップのアルファを 0 に
this._alpha = 0;
}
//
onClipEvent (enterFrame) {
// _root.flag が 1 で なおかつ player2 の座標が 1 以下のとき
if (_root.flag == 1 && _root.player2._x <= 1) {
// x=90 に近づける
this._x += (90-this._x)*spd;
// アルファ を 100 に近づける
this._alpha += (100-this._alpha)*spd;
} else {
// それ以外は x=0 と アルファ を 0 に近づける
this._x += (0-this._x)*spd;
this._alpha += (0-this._alpha)*spd;
}
}
--------------------------------------------

インスタンス名 「player2」 というムービークリップに書くスクリプト↓。

--------------------------------------------
onClipEvent (load) {
// スピードの設定（※可変）
spd = 1/8;
// このムービークリップのアルファを 0 に
this._alpha = 0;
}
//
onClipEvent (enterFrame) {
// _root.flag が 2 で なおかつ player1 の座標が 1 以下のとき
if (_root.flag == 2 && _root.player1._x <= 1) {
// x=90 に近づける
this._x += (90-this._x)*spd;
// アルファ を 100 に近づける
this._alpha += (100-this._alpha)*spd;
} else {
// それ以外は x=0 と アルファ を 0 に近づける
this._x += (0-this._x)*spd;
this._alpha += (0-this._alpha)*spd;
}
}
--------------------------------------------

インスタンス名 「player1」 というムービークリップを出すボタンに書くスクリプト↓。

--------------------------------------------
on (release) {
_root.flag = 1;
}
--------------------------------------------

インスタンス名 「player1」 というムービークリップを出すボタンに書くスクリプト↓。

--------------------------------------------
on (release) {
_root.flag = 2;
}
--------------------------------------------

このようにすると，できると思います。

お礼

ありがとうございます！！
できました！！

しかし、実は使用するボタンは２つではなく、全部で12個あるのです。
その場合、
player1は
if (_root.flag == 1 && _root.player2._x <= 1)
player2は
if (_root.flag == 2 && _root.player1._x <= 1)
の部分を変える必要があると思うのですがどのように定義したらよろしいでしょうか？
switch文でcaseを定義するなどすればいいのかな？とも思いましたがやり方がよくわからず…申し訳ありません。
環境はflash mx2004です。スクリプト初心者でご迷惑をおかけしております。お教えいただけると大変助かります。
宜しくお願いいたします。

回答No.1

noname#35109

> 単純に制御だけするなら
　～ 省略 ～
> で動作したのですが、

意味不明です。
動作するわけがないと思いますよ。
関数を定義しているだけですからね。

function は，
ユーザー定義関数を "定義する" ときに使うものです。
onClipEvent (load) 内の function だけなら，
まだ意味がわかりますが（あまり意味はわかりませんがわかると言えばわかります），
なぜ，
onClipEvent (enterFrame) 内でも function を定義する必要があるのでしょうか？
onClipEvent (enterFrame) は１フレーム進時間ごとに毎回実行されるのですから，
12fps だと，１秒間に12回実行されます。
１秒間に12回も同じ関数を定義する必要はどこにもないと思います。
ユーザー定義関数の定義は，普通，１回だけで十分です。

それと，
moveは，既存のメソッドにありますから（コンポーネントですが），
ユーザ定義関数の関数名として使うにはよろしくないです。
「UIObject.move()」
http://livedocs.macromedia.com/flash/8_jp/main/00004202.html

そもそも ユーザー定義関数を定義する必要性もわかりませんし，
何をどう修正すれば良いのか迷いますが，

とりあえず，最初のスクリプトを修正すると，
次のようになります。

----------------------------------
onClipEvent (load) {
// ユーザー定義関数 move1 の定義
function move1() {
dx = 10;
dy = 0;
_alpha = 0;
time = 0;
}
// ユーザー定義関数 move1 の実行
move1();
// ユーザー定義関数 move2 の定義
function move2() {
dx *= 0.9;
dy *= 0.9;
_alpha += 5;
_x += dx;
_y += dy;
}
}
//
onClipEvent (enterFrame) {
// ユーザー定義関数 move2 の実行
move2();
}
----------------------------------

これで，一応は動作します。

次に，

> ボタンを押した時にはじめてこの動きを出したい
これと，
> 他のボタンを押したときはこれと逆に消えていく動きのあとに
> これと同じ動きで四角形が出て来てもらいたいのですが

ですね。

こういう場合，
ユーザー定義関数を使うと，ややこしく複雑になるだけの気がしますが，
あえて使って書くと次のような感じになります。

ムービークリップ player に書くスクリプト↓。
--------------------------------------
onClipEvent (load) {
// 初期座標を記録保存
myx = _x;
myy = _y;
// ユーザー定義関数 move1 の定義
function move1() {
// 初期座標に設置
_x = myx;
_y = myy;
dx = 10;
dy = 0;
_alpha = 0;
// フラグの値を1に設定
flag = 1;
}
// ユーザー定義関数 move2 の定義
function move2() {
dx *= 0.9;
dy *= 0.9;
if (_alpha<100) {
_alpha += 5;
} else {
_alpha = 100;
}
_x += dx;
_y += dy;
}
// ユーザー定義関数 move3 の定義
function move3() {
dx = -10;
dy = 0;
_alpha = 100;
// フラグの値を2に設定
flag = 2;
}
// ユーザー定義関数 move4 の定義
function move4() {
dx *= 0.9;
dy *= 0.9;
if (_alpha>0) {
_alpha -= 5;
} else {
// アルファが 0 以下になったら move1 を実行
move1();
}
_x += dx;
_y += dy;
}
}
//
onClipEvent (enterFrame) {
if (flag == 1) {
// フラグが1であれば
// ユーザー定義関数 move2 の実行
move2();
} else if (flag == 2) {
// フラグが2であれば
// ユーザー定義関数 move4 の実行
move4();
}
}
--------------------------------------

押した時にはじめて動かすボタンに書くスクリプト↓。
--------------------------
on (release) {
this.player.move1();
}
--------------------------

消えていく動きのあとに
同じ動きで四角形を出て来させるボタンに書くスクリプト↓。
--------------------------
on (release) {
this.player.move3();
}
--------------------------

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

こういうものの場合，
ユーザー定義関数を定義して，
その関数によっていちいち変数を定義し直したり，
動作を定義し直すより，
変数の値をボタンから変えるだけにする方がシンプルになような気もします。

ムービークリップ player に書くスクリプト↓。
--------------------------------------
onClipEvent (load) {
// 初期座標を記録保存
myx = _x;
myy = _y;
// dx， dy の初期化
dx = 0;
dy = 0;
}
onClipEvent (enterFrame) {
dx *= 0.9;
dy *= 0.9;
if (_alpha<100 && flag == 1) {
_alpha += 5;
} else if (flag == 1) {
// アルファが 100 以上になったら 100 で固定
_alpha = 100;
} else if (_alpha>0 && flag == 2) {
_alpha -= 5;
} else if (flag == 2) {
// アルファが 0 以下になったら
_x = myx;
_y = myy;
dx = 10;
dy = 0;
_alpha = 0;
flag = 1;
}
_x += dx;
_y += dy;
}
--------------------------------------

押した時にはじめて動かすボタンに書くスクリプト↓。
--------------------------
on (release) {
this.player._x = this.player.myx;
this.player._y = this.player.myy;
this.player.dx = 10;
this.player.dy = 0;
this.player._alpha = 0;
this.player.flag = 1;
}
--------------------------

消えていく動きのあとに
同じ動きで四角形を出て来させるボタンに書くスクリプト↓。
--------------------------
on (release) {
this.player.dx = -10;
this.player.dy = 0;
this.player.flag = 2;
}
--------------------------

どっちもどっちですかね。
一応，参考までにということで...。

お礼

丁寧な説明ありがとうございます。
早速試してみたところ、２点不明な点がありました。

・消えていく動きのあとに同じ動きで四角形を出て来させるボタン

四角形が再び出てくると10pxほど右にずれた位置で静止します。。なぜでしょうか？？

・押した時にはじめて動かすボタン
消えていく動きのあとに同じ動きで四角形を出て来させるボタン

説明不足で申し訳ありません。
実はこのボタンはメニューとして使用を考えておりまして同列の役割にしたいと思っています。

例えばボタンAをクリックしてフェイドインしてきたplayerがX座標90以下0未満の位置にあるときにボタンBをクリックすると、playerはフェイドアウトしながら一度X座標0に戻る。
その後同じ幅、高さの四角形のムービークリップで内容の違うplayer2がX座標90の位置までフェイドインしてくる。

その後またボタンAをクリックするとplayer2はフェイドアウトしながら一度X座標0に戻る。その後playerがX座標90の位置までフェイドインしてくる。

といった感じです。

恐れ入りますが、ご教授いただけると幸いです。宜しくお願いいたします。