プロパティによるオブジェクトの移動

プロパティを利用してオブジェクトを移動してみましょう。

例 横方向に進むムービークリップ

移動させたいムービークリップにムービークリップアクションをつけます。

onClipEvent(load) {
    var speed=10;
}
onClipEvent(enterFrame) {
    this._x+=speed;
}

初期設定で変数speedの値を決め、クリップイベントループを使って毎フレーム_xの値を増やすことで移動します。

例 _rotationの方向に進むムービークリップ

onClipEvent(load) {
    var speed=10;
    _rotation=60;
}
onClipEvent(enterFrame) {
    // _rotationの角度に進む
    this._x+=speed*Math.cos(this._rotation/180*Math.PI);
    this._y+=speed*Math.sin(this._rotation/180*Math.PI);
}

_rotationは角度を表しているので、それをラジアン(角度÷180×π)に直し、それを三角関数を使ってx座標の増分とy座標の増分を計算します。Mathオブジェクトのπ(Math.PI)とsin関数(Math.sin())、cos関数(Math.cos())を使用しています。

例 ランダムな方向に進むムービークリップ

上の例の角度を設定している部分を書き換えて0〜1のランダムな実数を生成するMath.random()を使って、_rotationの値を設定します。

this._rotation=Math.random()*360;

あまり頻繁に角度を変えるとよくわからない動きになるので、適当な間隔で角度を変えるように書き換えてみましょう。下の例では変数countの値を1づつ増やしていき、10になったときに角度を変えるようにしています。

if (count==10) {
    this._rotation=Math.random()*360;
    count=0;
}
count=count+1;

変数countの初期値を0などに設定するのを忘れないようにしましょう。

例 画面端まできたら逆の端に表示する

画面から外に出ないようにする方法の一つとして、逆の端に表示する方法があります。上下と左右をつなげてしまう感じです。以下の式で座標を求めます。

横座標=(横座標+画面幅 )%画面幅
縦座標=(縦座標+画面高さ)%画面高さ

今回の例では以下のようになります。

var width =Stage.width;
var height=Stage.height;

// 画面端から出たら逆から出現
this._x=(this._x+width )%width;
this._y=(this._y+height)%height;

以上のプログラムを合わせると以下のようになります。

onClipEvent(load) {
    var count=0;
    var speed=10;
    var width =Stage.width;
    var height=Stage.height;
}
onClipEvent(enterFrame) {
    if (count==10) {
        this._rotation=Math.floor(Math.random()*360);
        count=0;
    }
    count=count+1;

    // _rotationの角度に進む
    this._x+=speed*Math.cos(this._rotation/180*Math.PI);
    this._y+=speed*Math.sin(this._rotation/180*Math.PI);

    // 画面端から出たら逆から出現
    this._x=(this._x+width )%width;
    this._y=(this._y+height)%height;
}

例 画面端まできたら跳ね返る

画面端まで来たら跳ね返るように変更してみましょう。

(角度の修正)

上下端では、移動角度を現在の移動角度の符号を変えたものに、左右端では、180度から現在の移動角度を引いたものにします。

場合分けなのでif文を使用します。

xMin=0; xMax=Stage.width;
yMin=0; yMax=Stage.height;

if (this._x<xMin || this._x>xMax) {
    this._rotation=(180-this._rotation+360)%360;
}
if (this._y<yMin || this._y>yMax) {
    this._rotation=(-this._rotation+360)%360;
}

これだとムービークリップの大きさの半分だけはみ出してしまう(ムービークリップの座標が中心に定められている場合)ので、以下のように修正します。

xMin=0+this._width/2;  xMax=Stage.width -this._width/2;
yMin=0+this._height/2; yMax=Stage.height-this._height/2;

(位置の修正)

跳ね返った場所を計算してその位置にくるように修正します。左端で跳ね返る場合には、「左端の座標×2−x座標」で計算できます。同様に、右端では「右端の座標×2−x座標」で計算できます。上下端も同様です。

角度と合わせて、以下の式で計算することができます。

if (this._y<yMin || this._y>yMax) {
    this._rotation=-this._rotation;
    if (this._y<yMin) {
        this._y=yMin*2-this._y;
    } else {
        this._y=yMax*2-this._y;
    }
}

if (this._x<xMin || this._x>xMax) {
    this._rotation=180-this._rotation;
    if (this._x<xMin) {
        this._x=xMin*2-this._x;
    } else {
        this._x=xMax*2-this._x;
    }
}

例 スピードを徐々に落として停止

速度(speed)を減らしていけばよいことになります。適当な間隔で減速するために下の例では変数countの値を1づつ増やしていき、10になったときに速度を1減らすようにしています。

if (count==10) {
    speed=speed-1;
    count=0;
}
count=count+1;

このままだと、速度がマイナスの値になり、逆方向に加速していくので、speedが正の値のときのみ減速するように変更します。

if (count==10) {
    if (speed>0) {
        speed=speed-1;
    }
    count=0;
}
count=count+1;

例 再加速

マウスでオブジェクトをクリックしたらspeedの値を変更します。

on(press) {
    speed=20;
}

例 特定のオブジェクトの方を向く

特定のオブジェクトの方向を向くようにするには、対象のオブジェクトと自分のオブジェクトの座標から角度を求めて、_rotaionに設定します。ラジアンは以下の式で求めます。

Math.atan2(対象のy座標-自分のy座標,対象のx座標-自分のx座標)

これを角度に直して_rotationの値とします。例えば、インスタンス「ball」の方向を向くには、以下のようになります。

onClipEvent(enterFrame){
    rad=Math.atan2(_parent.ball._y-this._y,_parent.ball._x-this._x);
    this._rotation=rad*180/Math.PI;
}