tweenmax,imageloader

package  {
    import flash.display.MovieClip;
    import flash.display.Sprite;
    import com.greensock.loading.*;
    import com.greensock.TweenMax;
    import com.greensock.events.LoaderEvent
    import com.greensock.loading.data.ImageLoaderVars;
    import com.greensock.loading.display.ContentDisplay;
    import flash.events.MouseEvent;
    import flash.text.TextField;
    import com.greensock.loading.display.*;    
    import flash.display.StageScaleMode;
    /**
     * ...
     * @author littlejoe
     */
    public class Main extends Sprite{
        private var xPhotography:XMLLoader;
        private var xImgList:XMLList;
        //通过这种方式用到舞台上的元件。
        public var thumbHolder:MovieClip;
        public var mainHolder:MovieClip;        
        public var titleTxt:TextField;
        public var descTxt:TextField;
        
        public function Main() {
            stage.scaleMode = StageScaleMode.SHOW_ALL;
            //加载xml文件
            xPhotography = new XMLLoader("photography.xml");
            xPhotography.load();//开始加载
            xPhotography.addEventListener(LoaderEvent.COMPLETE, xmlLoaded);        
        }
        
        private function xmlLoaded(e:LoaderEvent):void {
            //content相当于原来loader的data
            var xData:XML = e.target.content;
            //输出元素师img相关的
            xImgList = new XMLList(xData.img);
            //setup a loadermax object
            var thumbLoader:LoaderMax = new LoaderMax( { name:"thumbLoader" } );
            
            var nImgWidth:Number = 150;
            var nImgHeight:Number = 100;
            var nMaxCols:Number = 2;
            
            for (var i:int = 0; i < xImgList.length(); i++)
            {
                //对每个对象的载入,设置参数
                var iLoad:ImageLoader = new ImageLoader("images/thumbs/" + xImgList[i].@url, new ImageLoaderVars()
                .name(xImgList[i].@name)//p1,p2..!!!
                .width(nImgWidth)
                .height(nImgHeight)
                .smoothing(true)
                .container(thumbHolder)
                //位置!!!
                .x((i % nMaxCols) * nImgWidth)
                .y(int(i / nMaxCols) * nImgHeight)
                .scaleMode("proportionalOutside")//完整匹配
                .crop(true)    //将图像超出部分剪去        
                //再重新定义属性吗?
                .prop("index", i)
                .prop("url", xImgList[i].@url)
                .prop("title", xImgList[i].@title)
                .prop("desc", xImgList[i].@desc)
                .alpha(0)
                )
                thumbLoader.append(iLoad);//loaderMax中的append,增加到队列
            }            
            thumbLoader.load();
            thumbLoader.addEventListener(LoaderEvent.COMPLETE, thumbLoaded);//加载完成后才会调用此函数
        }
        
        private function thumbLoaded(e:LoaderEvent):void
        {//对thumbImg设置单击事件
            for (var i:int = 1; i < xImgList.length()+1; i++)
            {
                var cdImg:ContentDisplay = LoaderMax.getContent("p" + i);//对应前面的name,就是.name,content仅是一个“容器”
                cdImg.buttonMode = true;
                cdImg.addEventListener(MouseEvent.CLICK, thumbClick);
                //开始载入时的渐变
                TweenMax.to(cdImg, 1, { autoAlpha:1, delay:(i * 0.2) } );//延迟多少秒后开始载入
            }
        }
        
        private function thumbClick(e:MouseEvent):void
        {
            var vars:Object = ImageLoader(e.currentTarget.loader).vars;
            checkOldImage(vars.index);//相当于点击index=1这张图
        }
        
        private function checkOldImage(index:Number):void
        {
            //如果已经载入过,就直接缓动显示,没有的话去加载,顺便设置其属性,等下次直接判断家在过,直接缓动
            //单击一次,载入一张,再单击下一张,前一张将被移除,所以numChildren最大为1,位置时0
            if (mainHolder.numChildren == 1 )
            {
                //getChildAt返回位于指定索引处的子显示对象实例。
                var oldClip:Sprite = Sprite(mainHolder.getChildAt(0));
                //隐藏前面的,重新加载新的图片
                TweenMax.to(oldClip, 0.5, { autoAlpha:0, onComplete:function() { mainHolder.removeChildAt(0);loadImage(index) }})
            }else {
                loadImage(index);
            }
        }
        
        private function loadImage(index:Number):void
        {
            //get filename,就是图片的存储名称
            var file:String = xImgList[index].@url;
            //change text display
            titleTxt.text = "Title:" + xImgList[index].@title;
            descTxt.text = "Description:" + xImgList[index].@desc;
            
            var mainLoad:ImageLoader = new ImageLoader("images/main/" + file, new ImageLoaderVars()
            .width(500)
            .height(500)
            .scaleMode("proportinalInside")
            .container(mainHolder)
            .smoothing(true)
            .alpha(0)
            )
            //setup event listener
            mainLoad.load();
            mainLoad.addEventListener(LoaderEvent.COMPLETE, imageLoaded);
        }
        
        private function imageLoaded(e:LoaderEvent):void
        {
            //ContentDisplay与name对应
            var imgClip:ContentDisplay = LoaderMax.getContent(e.currentTarget.name);
            TweenMax.to(imgClip, 0, { colorTransform: { exposure:2 }} );//曝光
            TweenMax.to(imgClip, 1.5, { colorTransform: { exposure:1 }, autoAlpha:1 } );
        }
    }

}




<?xml version="1.0" encoding="UTF-8"?>
<data>
    <img url="SDZoo-9.jpg"       name="p1"  title="zoo 1"     desc="zoo from San Dieago"/>
    <img url="SDZoo-17.jpg"      name="p2"  title="zoo 2"     desc="zoo from San Dieago"/>
    <img url="SDZoo-29.jpg"     name="p3"  title="zoo 3"     desc="zoo from San Dieago"/>
    <img url="squirrel-1.jpg"   name="p4"  title="squirrel 1" desc="Squirrel"/>
    <img url="SDZoo-3.jpg"      name="p5"  title="zoo 4"     desc="zoo from San Dieago"/>
    <img url="Lorne2009-5.jpg"   name="p6"  title="Sea"      desc="touch the wave"/>
    <img url="Lorne2009-28.jpg"   name="p7"  title="Smile"   desc="ocean smile"/>
    <img url="Lorne2009-30.jpg"   name="p8"  title="Car"     desc="R33 Skyline"/>
</data>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值