继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

浏览器窗口尺寸改变时图片自动重新定位

冉冉说
关注TA
已关注
手记 324
粉丝 42
获赞 194

俗话说:拳不离手,曲不离口。学过的技能不用,放长了就生疏了,今天以前的同事问我:用户改变浏览器窗口尺寸时,flash中的图片如何重新定位于4个角上。花了近一刻钟才回忆想来:stage有Resize事件,呵呵代码如下:1.先把加载图片的逻辑封装一下:

package  { 
    import flash.display.Sprite;
    import flash.display.Loader;
    import flash.display.LoaderInfo;
    import flash.net.URLRequest;
    import flash.events.Event;
    import flash.display.Bitmap;
    import flash.events.IOErrorEvent;
    import flash.system.LoaderContext;
     
    public class LoadImage extends Sprite {
         
        private var _imgWidth:int;
        private var _imgHeight:int;
         
        public function LoadImage(url:String,imgWidth:int=380,imgHeight:int=305) {
             
            this._imgWidth = imgWidth;
            this._imgHeight = imgHeight;
             
            var _request:URLRequest = new URLRequest(url);
            var _loader:Loader = new Loader();
            var _lc:LoaderContext = new LoaderContext(true);
            _loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loadComplete);
            _loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR,loadIO_Error);
            _loader.load(_request,_lc);
             
        }      
         
        private function loadComplete(e:Event):void
        {
            //trace("loadComplete");
            var li:LoaderInfo = e.currentTarget as LoaderInfo;
            var bmp:Bitmap = li.content as Bitmap;
            bmp.height = _imgHeight;
            bmp.width = _imgWidth;
            addChild(bmp);
        }
         
        private function loadIO_Error(e:IOErrorEvent):void
        {
            trace("load error!");
        }
    }  
}

2.主文档类

package  {
     
    import flash.display.MovieClip;
    import flash.events.Event;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
     
     
    public class ResizeDemo extends MovieClip {
         
        private var _top_left:LoadImage; //左上 的图片
        private var _top_right:LoadImage; //右上 的图片
        private var _bottom_left:LoadImage; //左下 的图片
        private var _bottom_right:LoadImage; //右下 的图片
        private var _center:LoadImage; //中心的图片
        private var _WIDTH:int; //舞台的宽度
        private var _HEIGHT:int; //舞台的高度
         
        public function ResizeDemo() {
            // constructor code
             
            if (stage)
            {
                init();
            }
            else
            {
                stage.addEventListener(Event.ADDED_TO_STAGE,init);
            }
        }
         
        private function init(e:Event=null)
        {
            stage.removeEventListener(Event.ADDED_TO_STAGE,init);
            stage.addEventListener(Event.RESIZE,reSizeHandler);
            stage.align = StageAlign.TOP_LEFT;
            stage.scaleMode = StageScaleMode.NO_SCALE;
             
             
            //加载图片
            _top_left = new LoadImage("top_left.jpg",100,150);
            _top_right = new LoadImage("top_right.jpg",100,150);
            _bottom_left = new LoadImage("bottom_left.jpg",100,150);
            _bottom_right = new LoadImage("bottom_right.jpg",100,150);
            _center = new LoadImage("center.jpg",200,300);
             
             
            addChild(_top_left);
            addChild(_top_right);
            addChild(_bottom_left);
            addChild(_bottom_right);
            addChild(_center);
             
            adjustPosition();
             
             
        }
         
        private function reSizeHandler(e:Event=null)
        {
            adjustPosition();
        }
         
        //调整位置
        private function adjustPosition()
        {
            _WIDTH = stage.stageWidth;
            _HEIGHT = stage.stageHeight;
             
            trace("_WIDTH =",_WIDTH);
            trace("_HEIGHT =",_HEIGHT);
            trace("_top_left.width =",_top_left.width);
             
            //定位 左上的图片
            _top_left.x = _top_left.y = 0;
             
            //定位 右上的图片
            _top_right.x = _WIDTH - _top_left.width;
            _top_right.y = 0;
             
            //定位 左下的图片
            _bottom_left.x = 0;
            _bottom_left.y = _HEIGHT - _bottom_left.height;
             
            //定位 右下的图片
            _bottom_right.x = _WIDTH - _bottom_right.width;
            _bottom_right.y = _HEIGHT - _bottom_right.height;
             
            //定位中心的图片
            _center.x = (_WIDTH - _center.width)/2;
            _center.y = (_HEIGHT - _center.height)/2;
        }
         
    }
     
}

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP