A Flash Developer Resource Site

Results 1 to 2 of 2

Thread: xml thumbnail gallery

  1. #1
    Junior Member
    Join Date
    Feb 2005
    Location
    washington, dc
    Posts
    10

    xml thumbnail gallery

    Hi Everyone,

    I'm loading two XML documents, one for the thumbnails and one for the pictures. Until now, everything loads fine on the screen, but I need a way to interact between the thumbnail and the full size picture, since both of them are inside of arrays, I was thinking to make something like this but I cannot make it work

    if (thumbnailarray[i] is clicked){
    show picturearray[i]
    }

    This is my code, everything is working until now, I just need to know how to create what I described above


    Code:
    // variables for both XML's
    var loader2 = new URLLoader();
    loader2.addEventListener(Event.COMPLETE, piclo)
    loader2.load(new URLRequest("pics2.xml"));
    var list:XMLList = new XMLList;
    var listlenght:int = 0;
    var imgloader2:Loader;
    var rayita:Array = new Array();
    var _mc:MovieClip = new MovieClip;
    var xmlLoader:URLLoader = new URLLoader();
    xmlLoader.addEventListener(Event.COMPLETE, xmlend);
    xmlLoader.load(new URLRequest("pics.xml"));
    var xmlList:XMLList;
    var xmlLength:int = 0;
    var imgArray:Array = new Array();
    var imageLoader:Loader;
    var imgHolder_mc:MovieClip;
    var j:Number = 0;
    var p:Number = 0;
    var l:Object;
    
    
    //  first XML IS LOADED
    
    function xmlend(event:Event){
        XML.ignoreWhitespace = true;
    	var this_xml:XML = new XML(event.target.data);
    	xmlList = this_xml.children();
    	xmlLength = xmlList.length();
    	
    	for (var i:int = 0; i<xmlLength; i++) {
    		imageLoader = new Loader();
    		imageLoader.load(new URLRequest(xmlList[i].text()));
    		
    		imgHolder_mc = new MovieClip();
    		addChild(imgHolder_mc);
    		
    		imgHolder_mc.x = 20 ;
    		imgHolder_mc.y = 15 + i*50;
    		imgHolder_mc.alpha = .4;
    		imgHolder_mc.addChild(imageLoader);
    		imgArray.push(imgHolder_mc);
    	    imgArray[i].addEventListener(MouseEvent.MOUSE_OVER, mouseov) 		
    	    imgArray[i].addEventListener(MouseEvent.MOUSE_OUT, mouseou) 
    		imgArray[i].name = "ahora" + i
    		trace(imgArray[i].name);
    		//imgHolder_mc.name = "ahora" + (i + 2) ;
    		} 
    }
    
    // second xml loaded
    function piclo(event:Event){
    	var xml2_xml:XML = new XML(event.target.data);
    	list = xml2_xml.children();
    	listlenght = list.length();
        for (var i:int = 0; i<listlenght; i++) {		
    		_mc.name = "ahora" +i;
    
    		imgloader2 = new Loader();
    		imgloader2.load(new URLRequest(list[i].text()));
    		
    		trace(_mc.name);
    		_mc = new MovieClip();
    	    addChild(_mc);
    		imgloader2.contentLoaderInfo.addEventListener(Event.COMPLETE, ch)// add event to get width
    	    rayita.push(_mc)
     		_mc.addChild(imgloader2);
            _mc.alpha = 0;
    
            }
    }
    
    
    function mouseov(event:MouseEvent){
    	    event.target.alpha = 4;
    		
    		
    }
    
      
      
    function mouseou(event:MouseEvent){
    	    event.target.alpha = 1 ;
    }
    
    function ch(event:Event):void// need to do this to get correct width
    {
    	
    if (event.currentTarget.content.width > 400){
    	event.currentTarget.content.x = 140
    	event.currentTarget.content.y = 25
    }else{
    	event.currentTarget.content.x = 250
    	event.currentTarget.content.y = 10
    }
    
    }

  2. #2
    Junior Member
    Join Date
    Mar 2008
    Location
    India
    Posts
    6

    humbnail Problem

    Hello

    hello my action script can help u. u can write as on the top blank layer.

    But i have problem in multi level thumbnail.
    I m facing problem in XML and action script when i have to make a tree level gallery.
    Means suppose i have to make a gallery for shirt builder, and it has 2 types of thumbnails like thumbnail for portion (front, back, collar) and other for fabrics.

    i have made 1 thumbnail for front, back and collar and also the big image appear by clicking on thumbnail, but it is not working for 2nd thumbnail, for example for fabric.
    on clicking on fabric thumbnail corresponding thumbnails and big image should also change.

    http://www.brooksbrothers.com/select...lectshirts.tem


    Please see the link, our company want to make this type of flash wit us, here all image comes from database, for this we are using XML.

    we have finished right side panel, but when clicking on left side category right side pannel should also change, how can it will be possible.
    can anyone help us.

    please see the xml and let us tell where we have to make change

    <?xml version="1.0" encoding="iso-8859-1"?>
    <gallary>
    <image title="image 1" main="main/shirt_front.jpg" thmb="thumbnails/shirt1_front.jpg"/>
    <image title="image 2" main="main/shirt_cuff.jpg" thmb="thumbnails/SHIRT1_CUFF.jpg"/>
    <image title="image 3" main="main/shirt_collor.jpg" thmb="thumbnails/shirt1_collar.jpg"/>
    <image title="image 4" main="main/shirt_back.jpg" thmb="thumbnails/shirt1_back.jpg"/>
    </gallary>


    And the flash for thumbnail is here:

    loadMovie("main/shirt_front.jpg", "loader");
    myPhoto = new XML();
    myPhoto.ignoreWhite = true;
    myPhoto.onLoad = function(success) {
    //portfolioTag = this.firstChild;
    numimages = this.firstChild.childNodes.length;
    spacing = 95;
    for (i=0; i<numimages; i++)
    {
    this.picHolder = this.firstChild.childNodes[i];
    this.thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
    this.thumbHolder._x = i*spacing;
    this.thumbLoader = this.thumbHolder.createEmptyMovieClip("thumbnail_i mage", 0);
    this.thumbLoader.loadMovie(this.picHolder.attribut es.thmb);
    this.thumbHolder.title = this.picHolder.attributes.title;
    this.thumbHolder.main = this.picHolder.attributes.main;
    this.thumbHolder.onRelease = function() {
    loader.loadMovie(this.main);
    title_txt.text = this.title;
    };
    }
    };
    myPhoto.load("XMLPhoto.xml");


    this code is right only for one level xml and flash, but i need tree level.

    can any one help? we are facing lots of problem.

    thanks

    Vijaylaxmi

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center