as3でTweenを複数インスタンスに同時で行う方法

質問

as3でTweenを複数インスタンスに同時で行う方法

ロールオーバー時に、たくさんのインスタンスがウェーブするような動きを作ろうと思っています。
Tweenである領域に入ったインスタンスを上下に揺らすことが目的ですが、Tweenで同時にインスタンス10個ずつを順に＆時間差で動かしたいです。

この場合、構文としてはどのようになるのでしょか？

回答No.3

BlurFiltan

＃２です

> 決まった位置にこれ！というムービークリップは作れないと思います。

？？？
スプライトが配置できてムービークリップが配置できない理由がよく(全く)わかりませんが。

ムービークリップの リンケージ で クラス名 として ○○ と付け
new ○○()　で ○○ クラスのムービークリップを呼び出して
addchild で配置すれば良いだけだと思うのですが。
それではできないのでしたらスプライトでもできないと思います。

ちなみに
スプライト ＋ Tween の方法で出来るのでしたらそれで良いと思います。
全く異論はありません。

回答No.2

BlurFiltan

＃１ です。

> BlurFiltanさんの場合、このような動きはどのようなスクリプトにされますか？

＃１ を書いたのは良いのですが，
ちょっと変更するだけでも
＃１ の内容を全て理解した上で
さらにもっと工夫する必要が出てきます。

「そんな努力や試行錯誤をするくらいならスクリプトは使いません」
という意味で
>私はこういう場合，TweenやTimerクラスを使用する方法は多分使いません。
と書いたんです。

ちょっとの変更ができるくらいなら
これくらい楽勝で作れなければならないということですね。

基本的にスクリプトは使いません。
というか
使うのですが
for文 と MovieClip.gotoAndPlay メソッドくらいです。

ムービークリップのタイムラインで 「●」 インスタンスがモーショントゥイーンで動くものを１つ作成します。
そのムービークリップに色々なインスタンス名を付けてステージ上に配置します。

それで，
再生開始させる場所(タイムライン(フレーム)) をインスタンスごとに変えれば良いだけでしょう？

何かに ロールオーバー した後
その何かから ロールアウト したときでも
「●」 を最初の位置に戻したければ gotoAndStop(1) をすれば良いだけです。
その後
再び同じ何かに ロールオーバー した時も
同じようにウェイブさせることもできれば，
続きからウェイブさせることもできます。

何を(どこを) 動きの出発地点にするかも
モーショントゥイーン なら 楽々作成できます。

つまり
「もっと基本的なこと をすれば もっと柔軟に もっと楽に 何でもできます」
ということです。

お礼

なるほど、何でもスクリプトでしようとすると無駄に複雑になるだけってことですね。
仕様にもあるように、エリアごとに形も違うため、●の数も集合体の形も変わるので、どうしたらいいか迷っていました。
現在の処理は、エリアをかたどったインスタンスをhitTestPointで●を子インスタンスとして配置し、エリアのインスタンスをロールオーバーしたときに●が動く、というのをロジックにしています。
ただ、この●はSpriteで作っていて、スクリプトで動きを加えようとしてました。
この動きをタイムラインを使用して上下運動させるってことですね。
でも、●の数も集合体の形も変わることから、決まった位置にこれ！というムービークリップは作れないと思います。ウェーブの動きを加えるにはやはり先ほどのTweenの連鎖運動のスクリプトが必要になると思うのですが・・・。

回答No.1

BlurFiltan

メインタイムラインのステージ上に
10個のムービークリップ「mc0」～「mc9」と
１個のボタン「btn」を用意した場合(↓下図)の
フレームに書くスクリプト例↓。

--------------------------
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;

//「mc○」の個数を設定
var num:int = 10;

//Tweenにかける秒数を設定
var sec:Number = 1;

//Timer実行の遅延ミリ秒数を設定
var wait:int = 250;

//「mc○」の初期 y座標 を保存
var base_y:Number = mc0.y;

//「mc○」のスタート y座標
var start_y:Number = base_y;

//「mc○」のゴール y座標 の設定
var finish_y:Number = base_y - 80;

//カウント用変数の用意
var cnt:int;

//Timerインスタンス「myTimer」を生成
var myTimer:Timer = new Timer(wait,num);

//「myTimer」 に関数 timerHandler を実行する設定
myTimer.addEventListener(TimerEvent.TIMER, timerHandler);

//関数 timerHandler の定義
function timerHandler(evt:TimerEvent):void {
//Tweenインスタンスを生成
this["tween" + cnt] = new Tween(this["mc" + cnt],"y",Regular.easeInOut,start_y,finish_y,sec,true);
//Tween終了時に 関数 myYoyo を実行する設定
this["tween" + cnt].addEventListener(TweenEvent.MOTION_FINISH,myYoyo);
//カウント用変数に 1 を加算
cnt++;
}

//関数 myYoyo の定義
function myYoyo(evt:TweenEvent):void {
//Tweenを逆再生
evt.currentTarget.yoyo();
}

//「btn」マウスオーバー時に 関数 overHandler を実行する設定
btn.addEventListener(MouseEvent.MOUSE_OVER,overHandler);

//関数 overHandler の定義
function overHandler(evt:MouseEvent):void {
//最終Tweenが生成されていなければ
if (this["tween" + (num-1)] == undefined) {
//Timerスタート
myTimer.start();
}
for (var i:int=0; i<num; i++) {
//Tweenが生成されていれば
if (this["tween" + i] != undefined) {
//Tweenを続きから再生
this["tween" + i].resume();
}
}

}

//「btn」マウスアウト時に 関数 outHandler を実行する設定
btn.addEventListener(MouseEvent.MOUSE_OUT,outHandler);

//関数 outHandler の定義
function outHandler(evt:MouseEvent):void {
//最終Tweenが生成されていなければ
if (this["tween" + (num-1)] == undefined) {
//Timerストップ
myTimer.stop();
}
for (var i:int=0; i<num; i++) {
//Tweenが生成されていれば
if (this["tween" + i] != undefined) {
//Tweenを停止
this["tween" + i].stop();
}
}
}
--------------------------

書いておきながら...何ですが，
私はこういう場合，TweenやTimerクラスを使用する方法は多分使いません。
字数制限のため以上。

お礼

ご親切にスクリプト書いていただき、ありがとうございます。

>書いておきながら...何ですが，
>私はこういう場合，TweenやTimerクラスを使用する方法は多分使いません。
>字数制限のため以上。

BlurFiltanさんの場合、このような動きはどのようなスクリプトにされますか？

少し詳細を↓
求人検索などでよくある「エリアからの検索」機能を作ろうと思っています。
マップ上をクリックすると、phpファイルにPOST送信し、SQLを発行＆画面表示します。
マップは各地区ごとに「●」の集合体で描かれ、ロールオーバー時にその地区の●の集合体が動く、というのが仕様です。
●の動きは何でもいいんですが、左から右へウェーブするような動きがいいと思っています。
なので、同じx座標にある複数(約10個くらい）が同時に動き、その最中に次のx座標が動く・・・のように、連鎖していきます。

簡単に、イメージ画像を載せます。

長々とすみませんが、アドバイスいただきたく、よろしくお願いいたします。

補足

すいません、画像が乗せれませんでした・・・。