FLASHのお勉強 ーアクションスクリプトの実践的事始めー |
|
（３）移動の停止 |
|
動いているオブジェクトを停止させるとき、ふわーっと止めたり（減速･イージング）、バネ仕掛けのように弾んで止めたりすることが出来るがそれについてのお勉強である。 減速しながら止める （１）、（２）節でオブジェクトを移動させてきたが、いずれの場合も、ｘあるいはｙの値を一定量変化させていた。 すなわち、x+=5; のように、1フレームあたり5ピクセルずつ増加させる設定である。 減速しながら止めるには、時間が経つにしたがって変化量を小さくさせなければならない。 これには、移動体のｘ（ｙ）座標と移動先座標（目標位置）との差を変化量とする手法を使う。 近づけば近づくほど変化量は小さくなるから、ゆっくり近づくことになる。 この変化量は加速度とみなすことが出来、加速度がだんだん減少する、すなわち減速することになる。 これを、ｘ座標だけで書くと、 this._x += (a - this._x) / b と言うスクリプトとなり、ａは移動先座標、ｂは定数である。 このスクリプトにより、移動先（目標地点）に近づくほど変化量は小さくなり、減速される。 そして、減速の度合いは、定数ｂの値で調整できる。 以下に実例を示すが、スクリプト内の i f 文は繰り返しモーションさせるための構文であり、停止させる場合は不要である。 |
|
| onClipEvent (load) { this._x = 50; this._y = 50; } onClipEvent (enterFrame) { if ( this._x>399) { this._x = 50;} dx = (400-this._x)/4; this._x += dx; } |
|
| このスクリプトで作成されたムービではインスタンスはゆっくり止まり、いわゆる浮遊したようなふわっと止まる動きにはならない。 そこで、次に勉強するのは、行き過ぎては戻りを繰り返し、最終的には目的位置に静止するムービーである。 これが出来れば、この動きを調整して振幅幅を小さくした静止、いわゆるふわーっとした静止を作り出すことが出来る。 バネ仕掛けのように弾んで止まる このような止め方も良く使われていて、３角関数を使って減衰させる方法もあるようだが、最もよく使われている手法をお勉強する。 この場合は、目標位置に到達しても通り過ぎ、次に目標地点より手前に引き戻されてという（慣性の働いた）動作を繰り返して、振幅幅を減衰させながら目標位置に停止すると言うことになる。 これを実現させるために、いわゆる慣性の概念を用いる。 すなわち、タイムラインの１FRAME のような極く短い時間内では、 速度 ＝ 現在の速度×慣性 ＋ 加速度 なる式が成り立つ。 そこで、極く短い時間内でのｘ軸方向の座標の増分（速度）を ｖｘ とおくと以下のような式が出来る。 vx = vx*a + ( L - this._x)/b aは慣性にかかわる係数、ｂは加速度にかかわる係数、Lは目標座標 this._x += vx ｘ座標の増分（速度に相当） この式をそのままスクリプトとして用いると以下のような例になる。 ここでも、if文はモーションを繰り返すための記述である。 |
|
| onClipEvent (load) { this._x = 75; this._y = 75; vx = 0 } onClipEvent (enterFrame) { if ( this._x == 300 ) { this._x = 50; } vx = vx*0.8 + (300-this._x)/5; this._x += vx; } |
|
| 上記スクリプトで、上式のａ（慣性）、ｂ（加速度）の数値の組み合わせをいろいろ変えると、動きが変わってくるので、望みの動きになるように調節する。 バネのような振幅運動を小さく抑えればふわーっとした静止状態も作ることが出来る。 またこの手法は、マウスを動かすとイメージが追いかけるクリップを作るときの慣性効果にもよく応用される。 | |
|
|
|
| HOME お勉強総リスト | |