# Question about XML in ScrollPanes

**URL:** https://forum.kirupa.com/t/question-about-xml-in-scrollpanes/323172
**Category:** flash
**Created:** [June 20, 2011, 12:04am UTC](https://forum.kirupa.com/t/question-about-xml-in-scrollpanes/323172 "2011-06-20T00:04:53Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![amgt](https://avatars.discourse-cdn.com/v4/letter/a/ecd19e/32.png) [@amgt](https://forum.kirupa.com/u/amgt)
#### Post date: [June 20, 2011, 12:04am UTC](https://forum.kirupa.com/t/question-about-xml-in-scrollpanes/323172/1 "2011-06-20T00:04:53Z")

</div>

I’m working on my first website, and have mostly been using tutorials on [Lynda.com](http://Lynda.com) which has been hugely helpful. I need several different scrollpanes in the site, one of which is a typical thumbnail gallery that uses XML to load the thumbnail images and displays full-size images & text when thumbnails are clicked. With a Lynda tutorial I was able to write the appropriate code and use the canned scrollpane in Flash, but even after changing some of the properties I really don’t like how it looks. I found another tutorial ([http://www.developphp.com/Flash\_tutorials/show\_tutorial.php?tid=265](http://www.developphp.com/Flash_tutorials/show_tutorial.php?tid=265)) that shows a scrollpane I like better (after some modifications), and I’ve got it working perfectly elsewhere on the site… but I’m wondering if/how I can integrate the XML code I’ve already written into this new scrollpane so I can replace the canned one? If anyone has any tips or can give me any advice I’d really appreciate it…  
Thank you!  
I’m using Flash CS4/AS3  
Macbook Pro

This is the code for the canned one with all the XML:

[INDENT]var titleArray:Array = new Array();  
var descriptionArray:Array = new Array();  
var largeimageArray:Array = new Array();  
var thumbimageArray:Array = new Array();  
var imageNum:Number=0;  
var totalImages:Number;

//xml  
//load xml  
var XMLURLLoader:URLLoader = new URLLoader();  
XMLURLLoader.load(new URLRequest(“insituportfolio/mainInSituGallery.xml”));  
XMLURLLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(event:Event):void {  
var theXMLData:XML=new XML(XMLURLLoader.data);  
totalImages=theXMLData.title.length();  
for (var i:Number = 0; i \< totalImages; i++) {  
titleArray.push(theXMLData.title\*);  
descriptionArray.push(theXMLData.description\*);  
largeimageArray.push(theXMLData.largeimage\*);  
thumbimageArray.push(theXMLData.thumbimage\*);  
}  
loadThumbnail();  
}

mainScrollPane.source=thumbsMain;

// load thumbs  
function loadThumbnail():void {  
trace(imageNum);  
var thumbLoader:Loader = new Loader();  
thumbLoader.load(new URLRequest(thumbimageArray[imageNum]));  
thumbLoader.y = 100\*imageNum;  
var thislargeimage:String = largeimageArray[imageNum];  
var thistitle:String = titleArray[imageNum];  
var thisdescription:String = descriptionArray[imageNum];  
thumbLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, thumbLoaded);  
function thumbLoaded(event:Event):void {  
thumbsMain.addChild(thumbLoader);  
thumbsMain.buttonMode=true;  
mainScrollPane.update();  
thumbLoader.addEventListener(MouseEvent.CLICK,loadMainImage1);  
function loadMainImage1(event:MouseEvent):void {  
largeUILoader.source=thislargeimage;  
selectedTitle.text=thistitle;  
selectedDescrip.text=thisdescription;  
}  
}  
//add to imageNum (1);  
imageNum++;  
if (imageNum\<totalImages){  
loadThumbnail();  
}  
}[/INDENT]

And this is the code for the Scrollpane I’d like to use:

[INDENT]// Scroll My Content function - AS3  
function scrollMyContent () {  
// Cache the TextField as a bitmap to improve performance.  
content\_mc.cacheAsBitmap = true;  
// Event Listeners  
scrollDragger.addEventListener(MouseEvent.MOUSE\_DOWN, scrollDraggerPress);  
stage.addEventListener(MouseEvent.MOUSE\_UP, mouseUpOnStage);  
// Set variables  
var scrollbarHeight:Number = scrollbarBG.height;  
var contentHeight:Number = content\_mc.height;  
var scrollDraggerHeight:Number = scrollDragger.height;  
var maskHeight:Number = contentMask.height;  
var scrollAmout:Number = (contentHeight-maskHeight)/(scrollbarHeight-scrollDraggerHeight);  
var topBound:Number = scrollbarBG.y;  
var bottomBound:Number = scrollbarBG.height-scrollDraggerHeight+scrollbarBG.y;  
var startPos:Number = content\_mc.y;  
var leftBound:Number = scrollbarBG.x;  
var absNumSet:Number = 0;

```
// When scrollDragger gets pressed we do this

```

function scrollDraggerPress(event:MouseEvent):void {  
// Set bounds using some of the scroller BG properties claimed above  
var bounds:Rectangle = new Rectangle(leftBound, topBound, 0, bottomBound);  
scrollDragger.startDrag(false, bounds);  
stage.addEventListener(MouseEvent.MOUSE\_MOVE, reportStageMouse);  
function reportStageMouse(event:MouseEvent):void {  
absNumSet = Math.abs(scrollbarBG.y - scrollDragger.y);  
content\_mc.y = Math.round(absNumSet \* - 1 \* scrollAmout + startPos);  
}  
}  
// When mouse is released while dragging we do this  
function mouseUpOnStage(event:MouseEvent):void {  
stopDrag();  
}  
}  
scrollMyContent();[/INDENT]