AS3でステージのリサイズに対応したメニューの作成

ウィンドウをリサイズしたときにイージングでついてくる。
menu_mcにロールオーバーで完全に出てくる。&ロールアウトで半分隠れる。
メニューバー内のボタンも動く。

のような動きをAS3で作ってみました。
ActionScript 3.0 入門ノート のEaseingSimpleというものを参考にさせていただきながら作りました。

サンプル

//ActionScript//////////////////////////////////////////////////////////////////

var easeObj:EaseingSimple =  new EaseingSimple(menu_mc);

//Stage.width&Heightの設定
var w:uint = stage.stageWidth;
var h:uint = stage.stageHeight;

//menuの初期座標の設定
var menux:uint = w/2;
var menuy:uint = h + menu_mc.height/10;

//EaseingSimpleを使用して、menuを初期座標へイージング
easeObj.easeTo(menux, menuy);

//menu_mcのscaleModeの設定と、リサイズ時のリスナー設定
menu_mc.stage.scaleMode = StageScaleMode.NO_SCALE;
menu_mc.stage.align = StageAlign.TOP_LEFT;
menu_mc.stage.addEventListener(Event.RESIZE, onStageResize);

//menu_mcにロールオーバーしたときのリスナー設定
menu_mc.addEventListener(MouseEvent.MOUSE_OVER , menuon);
menu_mc.addEventListener(MouseEvent.MOUSE_OUT , menuoff);

//menu内のボタンのリスナー設定
menu_mc.m1_btn.addEventListener(MouseEvent.CLICK,m1);
menu_mc.m2_btn.addEventListener(MouseEvent.CLICK,m2);

//onStageResize()の定義
function onStageResize (event:Event):void {
var w:uint = stage.stageWidth;
var h:uint = stage.stageHeight;

menux = w/2;
menuy = h + menu_mc.height/10;
easeObj.easeTo(menux, menuy);
}

//menuon()の定義
function menuon (event:MouseEvent):void {
var w:uint = stage.stageWidth;
var h:uint = stage.stageHeight;
menux = w/2;
menuy = h - menu_mc.height/2;
easeObj.easeTo(menux, menuy);
}

//menuoff()の定義
function menuoff (event:MouseEvent):void {
var w:uint = stage.stageWidth;
var h:uint = stage.stageHeight;
menux = w/2;
menuy = h + menu_mc.height/10;
easeObj.easeTo(menux, menuy);
}

//m1()の定義
//function m1...

//m2()の定義
//function m2 ...

//EaseingSimple.as//////////////////////////////////////////////////////////////////

package {
    import flash.display.MovieClip;
    import flash.geom.Point;
    import flash.events.Event;

    public class EaseingSimple {
        var my_mc:MovieClip;
        var endPoint:Point;

        //コンストラクタ
        function EaseingSimple(mc:MovieClip) {
            my_mc = mc;
        }
        //イーズ開始
        public function easeTo(end_x:Number, end_y:Number):void {
            endPoint = new Point(end_x, end_y);
            my_mc.addEventListener(Event.ENTER_FRAME, easeStep);
        }
       
        //繰り返しステップ
        private function easeStep(event:Event):void {
            var mcPoint:Point = new Point(my_mc.x, my_mc.y);
            //2点間の距離
            var distance:Number = Point.distance(mcPoint, endPoint);
            if (distance>1) {
                var tmpPoint:Point = getTmpPoint();
                my_mc.x = tmpPoint.x;
                my_mc.y = tmpPoint.y;
            } else {
                my_mc.x = endPoint.x;
                my_mc.y = endPoint.y;
                my_mc.removeEventListener(Event.ENTER_FRAME, easeStep);
            }
        }
       
        //座標計算
        private function getTmpPoint():Point {
            var tmpX:Number = my_mc.x + (endPoint.x - my_mc.x) *0.3;
            var tmpY:Number = my_mc.y + (endPoint.y - my_mc.y) *0.3;
            var tmpPoint:Point = new Point(tmpX,tmpY);
            return tmpPoint;
        }
       
        //イーズ中断
        public function stop():void {
            my_mc.removeEventListener(Event.ENTER_FRAME, easeStep);
        }
    }
}


Bookmark and Share


ブックマークに追加