putting an image list into a scroller

By iamskillz | Jan 14, 2009

hi,

i am new to flash and AS and I have created a custom image gallery, where thumbnails appear on the left of my page and once clicked they fade into he screen.

however i have so many images that they do not all show on the page, and take up the entire left hand side -

i would like to know how i could edit my code so that all the thumbnails (that are loaded from a .xml file) can be put into a scroller box.

I would also like to add a function so that the image would close on mouse click of the bigger picture OR when a "close" button is clicked

below is the code for my image gallery - hope this helps.

ActionScript Code:


import fl.transitions.Tween;
import fl.transitions.easing.*;

var fadeTween:Tween;

var imageText:TextField = new TextField();

var imageLoader:Loader;
var xml:XML;
var xmlList:XMLList;
var xmlLoader:URLLoader = new URLLoader();

xmlLoader.load(new URLRequest(“data/images.xml”));

xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded);

function xmlLoaded(event:Event):void
{
    xml = XML(event.target.data);
    xmlList = xml.children();
    for(var i:int = 0; i < xmlList.length(); i++)
    {
        imageLoader = new Loader();
        imageLoader.load(new URLRequest(xmlList[i].attribute(“thumb”)));
        imageLoader.x = 130;
        imageLoader.y = i * 150 ;//+ 10;
        imageLoader.name = xmlList[i].attribute(“source”);
        addChild(imageLoader);
        imageLoader.addEventListener(MouseEvent.CLICK, showPicture);
    }
                                       
}

function showPicture(event:MouseEvent):void
{
    imageLoader = new Loader();
    imageLoader.load(new URLRequest(event.target.name));
    imageLoader.x = vid.x;
    imageLoader.y = vid.y;
    addChild(imageLoader);
    imageText.x = imageLoader.x + 140;
    imageText.y = imageLoader.y + 280;
    for(var j:int = 0; j < xmlList.length(); j++)
    {
        if(xmlList[j].attribute(“source”) == event.target.name)
        {
            imageText.text = xmlList[j];
        }
    }
    fadeTween = new Tween(imageLoader,“alpha”,None.easeNone,0,1,1,true);
}
imageText.autoSize = TextFieldAutoSize.LEFT;
addChild(imageText);