衛星のような動き

satellite



一見複雑そうな動きでも、単純な動きを組み合わせることで簡単に表現できます
解説はつづきから






新規ファイル作成
ステージ設定はサイズを400×300、フレームレートは30に





まずは背景を作成






次に30×30の大きさで円を描く
線の太さを5、線の色を#00CCFFで塗りはなし





作成した円をムービークリップシンボルに変換
ActionScriptに書き出しにチェックを入れて、クラス名をCircleに




新規レイヤーを追加しActionScriptを記述

//空のスプライト
var base:Sprite = new Sprite();
//角度用の変数
var deg:int = 0;
//ラジアン用の変数
var rad:Number = 0;
//子衛星を入れる配列
var list:Array = [];

//子衛星作成
for (var i:int = 0; i<5; i++) {
    var c:Circle = new Circle();
    c.x = circle.x;
    c.y = circle.y;
    //大きさ、透明度を順に小さく
    c.scaleX = c.scaleY = 0.9-0.1*i;
    c.alpha = 0.9-0.1*i;
    //baseに設置、配列にいれる
    base.addChildAt(c, 0);
    list.push(c);
}
//circleをbaseに設置
base.addChild(circle);
//baseの基準点をステージ中央にして設置
base.x = stage.stageWidth/2;
base.y = stage.stageHeight/2;
addChild(base);

//衛星の動きのイベント追加
addEventListener(Event.ENTER_FRAME, loop);
function loop(e:Event):void {
    //circleの動き用の角度を増加
    deg += 5;
    //角度をラジアンに変換
    rad = deg%360*Math.PI/180;
    //ラジアンを代入してcircleの位置を動かす
    circle.x = 150*Math.cos(rad);
    circle.y = 50*Math.sin(rad);
    //baseを回転させる
    base.rotation += 0.2;

    //子衛星の動きの設定
    for (var i:int = 0; i<5; i++) {
        //配列の0番目の衛星はcircleについていくように
        if (i == 0) {
            list[i].x += (circle.x-list[i].x)/3;
            list[i].y += (circle.y-list[i].y)/3;
        //それ以外は一つ前の衛星についていくように
        } else {
            list[i].x += (list[i-1].x-list[i].x)/3;
            list[i].y += (list[i-1].y-list[i].y)/3;
        }
    }
}


これでムービープレビューすると以下のようになってるかと思います







以上、衛星のような動きの作り方でした