Adding text to a dynamic slider menu

[msjen3011]

Hi,

I have created a slider menu that moves when the arrows are clicked on either side. The images for this menu are loading dynamically from an xml file onto a 'container' in my fla.

I need desperately to also be able to add text underneath those pics.....any help would be appreciated.

Code is :

import com.greensock.*;
import com.greensock.easing.*;

var xml:XML;
var images:Array = new Array();
var totalImages:Number;
var nbDisplayed:Number = 1;
var imagesLoaded:int = 0;
var slideTo:Number = 0;
var imageWidth = 150;

var container_mc:MovieClip = new MovieClip();
slider_mc.addChild(container_mc);
container_mc.mask = slider_mc.mask_mc;

function loadXML(file:String):void{
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest(file));
xmlLoader.addEventListener(Event.COMPLETE, parseXML);
}

function parseXML(e:Event):void{
xml = new XML(e.target.data);
totalImages = xml.children().length();
loadImages();
}

function loadImages():void{
for(var i:int = 0; i<totalImages; i++){
  var loader:Loader = new Loader();
  loader.load(new URLRequest("images/"+String(xml.children().@brand)));
  images.push(loader);
//      loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,onProgress);
     loader.contentLoaderInfo.addEventListener(Event.COMPLETE,onComplete);
}
}

function onComplete(e:Event):void{
imagesLoaded++;
if(imagesLoaded == totalImages){

  createImages();
}
}

function createImages():void{
for(var i:int = 0; i < images.length; i++){
  var bm:Bitmap = new Bitmap();
  bm = Bitmap(images.content);
  bm.smoothing = true;
  bm.x = i*imageWidth;
  container_mc.addChild(bm);
}
}

Prev_Btn.addEventListener(MouseEvent.CLICK,slideLeft);
Next_Btn.addEventListener(MouseEvent.CLICK,slideRight);

function slideLeft(e:Event):void{
slideTo -= nbDisplayed;
slideContainer();
}

function slideRight(e:Event):void{
slideTo += nbDisplayed;
slideContainer();
}

function slideContainer():void{
if(totalImages - slideTo < nbDisplayed)
  slideTo = totalImages - nbDisplayed;
if(slideTo < 0)
  slideTo = 0;
 
TweenLite.to(container_mc,.5,{x: -slideTo*imageWidth,ease:Quad.easeIn});
}

stage.addEventListener(KeyboardEvent.KEY_DOWN,keyHandler);

function keyHandler(evt:KeyboardEvent) {
if(evt.keyCode == Keyboard.LEFT)  slideLeft(evt);
else if(evt.keyCode == Keyboard.RIGHT) slideRight(evt);
}

loadXML("test.xml");

[Ned Murphy]

Why can't you just add TextFields in your createImages function while you are adding the images?

[msjen3011]

I have tried that although i've been looking at this code so long im not sure i am getting it right.....could you offer any help with the code?

[Ned Murphy]

It will help if you show what you tried.

[Guest]

I think Ned is right, that's where you'd put it.

var txtFld:TextField = new TextField();

txtFld.type = TextFieldType.DYNAMIC;

container_mc.addChild(txtFld);

I would check out the AS3 Reference for TextField. There are usually some examples there too.

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/text/TextField.html

Then you can format with some styling using TextFormat

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/text/TextFormat.html

What did the code you tried to use look like? what happened when you did it? Maybe you didn't embed the font?

Dave

[msjen3011]

to be honest i tried quite a few things....but not really knowing what i was doing.

one thing im not sure if i made clear is that i need the text to come from an xml doc and i think my code is only pulling out the images from the xml doc and not the text as well so even if i create images i dont believe i have gotten the info from the xml doc to begin with

does that make sense.....sorry i'm not overly experienced..................

thanks!

[Guest]

What does your XML look like, post a snippet. If the text is in your XML file and you're loading that file... then the text you need for the captions would be in there. You just need to access it kind of like the way you access the image URLs. You would assign that element or attribute value to the textfield.text

You might have something like:

txtFld.text = xml.element[0];

or if it's an attribute, it might be something like:

txtFld.text = xml.@caption;

I've been trying to get a better handle on working with XML myself and found a great page. You might think, oh that's too much to read, but it's worth spending the time an going through each example... just copy and paste the code into the Action panel and play around. Processing XML is one of those really great things to learn in ActionScript that you'll use over and over (I just posted this link for someone else learning how to work with XML).

http://www.senocular.com/flash/tutorials/as3withflashcs3/?page=4

post that snippet!

dave