一下午做了个图片展示flash

文章分类:FLASH  查看次数:575 + 107

访问地址:http://www.live-my-life-with-yuyi.com/lab/pic_show/

总体来说比较满意,使用方面没有问题,效果方面可能差了点(播放条可能跟下面的图片有点重合,换张图片就可以了),应该对载入的图片来个缓动效果,其实也不限于图片,swf文件也行,因为是通过movieclipLoader载入的,文件都是定义在外部的xml里。

发现我的AS还是有点基础的,o(∩_∩)o...哈哈。

顺便试试geshi的代码解析

源文件下载:http://www.box.net/shared/m22rjq2ixd

//初始化
var img_arr:Array = new Array();//用来存放相片信息
var img_i = 0;
var img_total:Number;//照片总数
var home = this;//避免直接引用_root

//处理playing_bar
var playing_obj = new Object();
var playing_listener_obj = new Object();
//初始化广播事件
AsBroadcaster.initialize(playing_obj);
//监听playing_listener_obj
playing_obj.addListener(playing_listener_obj);
//当接收倒playover的广播事件后执行的函数
playing_listener_obj.playover = function() {
    //停在第一帧上
    play_bar.playing_bar.gotoAndStop(1);
    //将当前的img_i加1
    img_i++;
    //如果img_i大于总img数,清零
    if (img_i>img_total) {
        img_i = 0;
    }
    //载入img_arr数组里的图片
    mcLoader.loadClip(img_arr[img_i], empty_mc);
    //去掉所有按钮的高亮,同时设置变量clicked为false
    for (var j = 0; j<=img_total; j++) {
        home["btn_mc_"+j].roll_over_mc._visible = false;
        home["btn_mc_"+j].clicked = false;
    }
    //对当前按钮设置高亮,同时设clicked属性为true
    home["btn_mc_"+img_i].roll_over_mc._visible = true;
    home["btn_mc_"+img_i].roll_over_mc.clicked = true;
};
//接收playstart广播事件,收到事件信息后,play_bar开始播放
playing_listener_obj.playstart = function() {
    home.play_bar.playing_bar.gotoAndPlay(1);
};

//载入外部文件
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
function onLoadInit(mc:MovieClip) {
    //载入完后,广播事件playstart
    playing_obj.broadcastMessage("playstart");
    //隐藏loading_txt
    loading_txt._visible = false;
}
this.onLoadProgress = function(target:MovieClip, bytesLoaded:Number, bytesTotal:Number):Void  {
    //显示载入的进度
    loading_txt.text = Math.floor((bytesLoaded/bytesTotal)*100)+"%";
    loading_txt._visible = true;
};

//处理xml
var images_xml:XML = new XML();
images_xml.ignoreWhite = true;
images_xml.onLoad = function(success) {
    //将xml里的元素赋给数组img_arr
    for (var i = 0; i<images_xml.firstChild.childNodes.length; i++) {
        img_arr[i] = images_xml.firstChild.childNodes[i].attributes.src;
    }
    //设置play_bar的位置
    play_bar_pos(i);
   
    //先载入第一个图片
    mcLoader.loadClip(img_arr[img_i], empty_mc);
    //给照片总数赋值
    img_total = --i;
    //分配按钮,并设置按钮的鼠标事件
    attach_btn(img_total);
    //高亮第一个按钮
    home["btn_mc_0"].roll_over_mc._visible = true;
    home["btn_mc_0"].roll_over_mc.clicked = true;
};
//载入xml文件
images_xml.load("images.xml");

//复制按钮
function attach_btn(j) {
    for (var i = 0; i<=j; i++) {
        //将按钮从库里拉出来,并分配坐标
        this.attachMovie("btn_mc", "btn_mc_"+i, this.getNextHighestDepth(), {_x:15+25*i, _y:206});
        //给按钮写上数字,同时隐藏高亮
        with (this["btn_mc_"+i]) {
            num_txt.text = i+1;
            roll_over_mc._visible = false;
        }
        //记录当前的i值
        this["btn_mc_"+i].num = i;
        //鼠标移到mc上面高亮显示
        this["btn_mc_"+i].onRollOver = function() {
            this.roll_over_mc._visible = true;
        };
        //移走后,如果clicked为false,则取消高亮
        this["btn_mc_"+i].onRollOut = function() {
            if (!this.clicked) {
                this.roll_over_mc._visible = false;
            }
        };
        //点击事件
        this["btn_mc_"+i].onRelease = function() {
            //取消所有高亮
            for (var j = 0; j<=img_total; j++) {
                home["btn_mc_"+j].roll_over_mc._visible = false;
                home["btn_mc_"+j].clicked = false;
            }
            //设置当前高亮
            this.roll_over_mc._visible = true;
            this.clicked = true;
            //播放条停在第一帧
            play_bar.playing_bar.gotoAndStop(1);
            载入相应的图片或swf
            mcLoader.loadClip(img_arr[this.num], empty_mc);
            //设置当前的img_i
            img_i = this.num+1;
            //trace(this.num);
        };
    }
}

//设置play_bar的位置
function play_bar_pos(k){
    k--;
    play_bar._x = 15+25*k+30;
    play_bar._y = 210;
}
 

评论

共2 条评论 to “一下午做了个图片展示flash”

  1. zcs on 2007-11-21 11:29 pm
    Gravatar

    好像有点缺陷,
    我测试了
    我把图片数量增加到4张,可以正常显示1到4张的图片
    但增加五张以上
    到第五张的时候就没反应了,在那里卡住

    [回复此评论]

  2. lzyy on 2007-11-22 7:04 pm
    Gravatar

    还有这样的问题啊,有空看看

    [回复此评论]

发表评论