• 续flash全站实例 - [flash]

    2009-05-25

    版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明
    http://2yue22.blogbus.com/logs/39947030.html

    Tops:在编程中,路径是一个很重要的概念,特别是在很多swf嵌套的时候,很多错误都是路径引起的,所以尽量少使用_root之类的绝对路径,多用相对路径,比如我上面的代码就可以写成
    this._parent._parent.loadswf("about.swf",262,150);
    如果你自己都不清楚自己要引用的是哪个路径的话,教你个好办法:在你所要引用的路径的帧上写var path=this;这样要引用这个路径就可以用path.loadswf(...);了:)

    下面是main.swf主时间轴上第一帧的代码,其中主要是自定义函数loadswf()

    this._lockroot = true;                                              //这是为了让所有的_root都指向它 
    fscommand("fullscreen", true); 
    fscommand("allowscale", false); 
    loading_mc._visible=false;                                 //在这里也放置了前面制作的loading_mc 
    //loadswf() 
    function loadswf(url:String,hx:Number,hy:Number){  //自定义函数loadswf,hx为_x值,hy为_y值 
    if(container!=undefined){                        //如果在加载前,已经加载了另一个swf的话,需先 
    my_mcl.unloadClip(container);      //卸载它 

    var my_mcl=new MovieClipLoader();    //这个和前面的代码很相似,规范点的话,应该把 
    var mcllistener=new Object();                  //它进行封装的 
    var container=this.createEmptyMovieClip("container", this.getNextHighestDepth()); 
    mcllistener.onLoadStart=function(){ 
    loading_mc._visible=true; 
    loading_mc.loading_txt.text="00.00"; 

    mcllistener.onLoadProgress=function(target, bytesLoaded, bytesTotal){ 
    var loaded=100*bytesLoaded/bytesTotal; 
    loading_mc.loading_txt.text=loaded.toString().slice(0,5); 
    loading_mc.loading_txt._y=50-loaded/2; 

    mcllistener.onLoadComplete=function(){ 
    loading_mc._visible=false; 

    mcllistener.onLoadInit = function(target){ 
    target._x=hx;                                //定义加载的target的x和y坐标 
    target._y=hy; 

    my_mcl.addListener(mcllistener); 
    my_mcl.loadClip(url,container); 
    }

    4>  music_mc
    这里制作的是一个功能较全面的音乐播放器,通过动态加载music.xml来实现的,这里我们首次结合了flash和xml,下面先看下这个music.xml文件:

    Music.xml: 
    <?xml version="1.0" encoding="UTF-8"?> 
    <music> 
    <item url="music\GloomySunday.mp3" name="GloomySunday" /> 
    <item url="music\我相信我能飞.mp3" name="I think I can fly" /> 
    <item url="music\我会永远爱你.mp3" name="I’ll allways love you" /> 
    <item url="music\勿伤我心.MP3" name="Don’t hurt me" /> 
    <item url="music\敬重.mp3" name="Respect" /> 
    <item url="music\毕业生.MP3" name="Graduation" /> 
    </music>

    Tips:如果xml文件中有中文,必须把编码格式设为UTF-8或gb2312,否则flash中显示为乱码。方法是在记事本输完上述代码后,选择“另存为”,在编码格式中选UTF-8,如下图:
     

    下面我们先看下我们要做的music播放器的效果图:

    这是没展开时的样子

    这是展开后没播放时的样子

    这是正在播放的样子

    我们可以看到,第一个图的"music"是个动态文本num_txt,在没有音乐播放时显示"music",在有音乐播放时和前面做的loading效果一致,显示播放进度,并改变其x坐标;并且第一个图的标尺上我做了一个隐形按钮control_btn,点击(press)时音乐面板展开(当然利用mc的事件可以不需要用隐形按钮的,另外我使用的时onPress事件,可以改成onMouseOver时展开,onMouseOut时回收,依自己的喜好而定)。
    再看下第二张图,中间上面有"1"...."6"的实际上是一个MC(select_mc),这个MC主要包括一个动态文本(select_txt)和一个按钮(rec_btn),flash从music.xml中读取信息,通过attachMovie把select_mc排列起来,点击每个select_mc后,会传递相应的变量给自定义的函数soundid,函数soundid负责播放音乐。
    在第三张图中可以看到,在中间还有个动态文本name_txt,当播放时显示音乐名称,就是music.xml中每个item的属性name的值(你可以做成滚动歌词的),并且在暂停,停止...会显示控制信息。
    最下面的就是控制菜单了,依次时播放(start_btn),步进(step_btn),步退(back_btn),停止(stop_btn),暂停(pause_btn)和一个音量控制条,滑块为sound_mc

    上面所说的只要细心就行了,下面就是编程了,可能对新手来说有点难,不过不要泄气,遇到不懂的多看看flash的帮助文档。

    首先是通过control_btn来控制control_mc的显隐的:

    num_txt.text="music";         //num_txt默认时显示"music" 
    control_mc._visible=false;    //control-mc默认隐藏 
    var vis=0;                                //这是一个开关变量,通过它来控制control_mc的显隐 
    control_btn.onPress=function(){                         //这段程序不难理解吧 
    if(vis==0){         
    control_mc._visible=true; 
    vis=1; 
    }else if(vis==1){ 
    control_mc._visible=false; 
    vis=0; 

    }

    下面这些代码就是比较重要的了:

    var music_xml=new XML();              //定义xml对象 
    var music=new Array();                    //定义一个数组对象,实质上是一个对象数组,就是说它的每 
    var count:Number=0;                        //个数组元素都是一个对象 
    music_xml.ignoreWhite=true;           //忽略空白 
    music_xml.onLoad=function(success){  
    if(success){ 
    parse();                  //parse()是一个自定义函数,在加载成功时调用                  


    music_xml.load("xml/music.xml");     //加载xml文件,onLoad事件最好写在load的前面 
    //parse()

    //在后面的制作中多次使用flash+xml,且xml的格式基本一致,所以按编程规范来说,应该自定义一//个类来实现,或把这段代码抽象,进行代码公用,不过我没这么做,那样对没有OOP经验的人来//说理解起来有点麻烦

    function parse(){ 
    var e=music_xml.firstChild.childNodes;   
    count=e.length;              
    for(var i=0;i<count;i++){     //如果下面的代码不理解的话,看下XML类的介绍 
    var musicobject=new Object(); 
    musicobject.url=e.attributes.url; 
    musicobject.name=e.attributes.name; 
    music=musicobject; 
    var item=this.attachMovie("select_mc","select"+i,this.getNextHighestDepth()); 
    //注意select_mc必须有一个链接ID, 这里还是select_mc 
    item.id=i; 
    item._x=12*i;   //设置item的坐标,因为每个select-mc是10px宽,间隔2px,所以这 
    item._y=-22;     //里为12*i 
    item.select_txt.text=i+1;   //设置item中select_txt的值 
    item.rec_btn.onRelease=function(){    //当rec_btn触发onrelease事件时调用soundid 
    //函数 
    soundid(music[this._parent.id].url,music[this._parent.id].name); 



    // 
    var soundbool=false; 
    var mid:Number=1;       
    var position=0; 
    var mysound:Sound=new Sound();                    //定义sound对象 
    function soundid(url,name){              //自定义函数soundid,接收两个参数 
    mysound.loadSound(url,true);           //可以参看Sound类的介绍 
    this.onEnterFrame=function(){ 
    if(mysound.getBytesLoaded()>=mysound.getBytesTotal()){ 
    name_txt.text=name; 
    mysound.setVolume(int((this._parent._x-95)*2)); 
    mysound.start(); 
    delete this.onEnterFrame; 
    }else{ 
    name_txt.text="loading..."; 



    // 
    start_btn.onRelease=function(){                //播放 
    if(soundbool==false){ 
    soundid(music[mid-1].url,music[mid-1].name); 
    }else if(soundbool==true){ 
    mysound.start(position); 
    name_txt.text=music[mid-1].name; 


    stop_btn.onRelease=function(){                 //停止 
    mysound.stop(); 
    name_txt.text="stop"; 

    step_btn.onRelease=function(){                     //步进 
    if(mid<count){ 
    mid++; 
    soundid(music[mid-1].url,music[mid-1].name); 


    back_btn.onRelease=function(){                     //步退 
    if(mid>1){ 
    mid--; 
    soundid(music[mid-1].url,music[mid-1].name); 


    pause_btn.onRelease=function(){                       //暂停 
    position=mysound.position/1000; 
    mysound.stop(); 
    name_txt.text="pause"; 
    soundbool=true; 

    sound_mc.sound_btn.onPress=function(){            //音量的滑块滑动 
    sound_mc.startDrag(false,95,2.3,145,2.3); 

    sound_mc.sound_btn.onRelease=sound_mc.sound_btn.onReleaseOutside=function(){ 
    sound_mc.stopDrag(); 
    var t=int((this._parent._x-95)*2); 
    mysound.setVolume(t); 

    _root.music_mc.onEnterFrame=function(){ 
    var f=(mysound.position/mysound.duration)*100; 
    if(isNaN(f)){ 
    _root.music_mc.num_txt.text="music";//不播放时显示"music" 
    }else{ 
    _root.music_mc.num_txt.text=f.toString().slice(0,5);//播放时显示播放进度,并设置 
    _root.music_mc.num_txt._x=50.7+f/2;                                    //num_txt的坐标 

    }

    好了,现在main.swf的内容说完了,下面是每个分栏目的swf了

     


    收藏到:Del.icio.us




    引用地址: