flash ticker that reads xml

I'm working on a project and I really need some help with figuring out how to create a ticker in flash that reads from an xml file. I assumed that I could make a dynamic text box as a movie clip, add the actions that I wanted the text to do within the clip, and add the rest of the code in as3 but I can't find a good tutorial to help me with the code!!

1. as3 code to insert xml text into a text box
2. specifics on how to write the xml so that it doesn't all display at once (ie 1 sentence at a time)
3. as3 to read the xml file in the first place
4. if I'm even going about adding the animation the right way (with the movie clip)

Please help!
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Antonio EstradaTech Leader / Senior Web DeveloperCommented:
Let's see if this works for you:

Source Files: http://vulturous.110mb.com/eefiles/XMLTicker.zip
The code:


Hope it helps.

import fl.transitions.easing.*;
import fl.transitions.Tween;
import fl.transitions.TweenEvent;
/* ------- Global Variables -------- */
var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
var xmlUrl:String = "source.xml";
var tickerPhrases:Array = new Array();
var currentTickerShown:Number = 0;
var currentTicker:Ticker;
var totalTickers:Number = 0;
const animationDuration:Number = 2; //Seconds
const stopDuration:Number = 5; //Seconds
/* ------- Application Start ------- */
/* ------- Generic Functions ------- */
function startUp():void {
	xmlData.ignoreWhitespace = true;
	xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded);
	xmlLoader.load(new URLRequest(xmlUrl));	
function parseXML(xml:XML):void {
	var xmlNode:XML;
	for each(xmlNode in xml.phrase) {
function showTicker(num:Number):void {
	var ticker:Ticker = new Ticker();
	var tween:Tween;
	ticker.txt.text = tickerPhrases[num].content;
	ticker.x = stage.stageWidth;
	tween = new Tween(ticker,"x",Strong.easeOut,ticker.x,0,animationDuration,true);
	tween.addEventListener(TweenEvent.MOTION_FINISH, tweenedIn);
	if(currentTickerShown==totalTickers-1) {
		currentTickerShown = 0;
	} else {
/* --- Event Triggered Functions --- */
function xmlLoaded(event:Event):void {
	xmlData = new XML(event.target.data);
function tweenedIn(event:TweenEvent):void {
	var timer:Timer = new Timer(stopDuration*1000,1);
	timer.addEventListener(TimerEvent.TIMER_COMPLETE, hideTicker);
	currentTicker = event.currentTarget.obj;
function tweenedOut(event:TweenEvent):void {
function hideTicker(event:TimerEvent):void {
	var tweenOut:Tween = new Tween(currentTicker,"x",Strong.easeIn,currentTicker.x,stage.stageWidth*-1,animationDuration,true);
	tweenOut.addEventListener(TweenEvent.MOTION_FINISH, tweenedOut);

Open in new window


Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
flashhelpplzAuthor Commented:
WOW thank you so much!!!!! It's perfect! :D It's not made at all how I expected it would- so all the animation and text style and everything is created entirely by actionscript? If you don't mind too much, could you maybe explain a little bit about the code so I could change little things if I wanted to? Like the direction of the animation or the text color?

flashhelpplzAuthor Commented:
Thank you so much!! I'd love it if you'd explain it to me a little, though, please! :)
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

Antonio EstradaTech Leader / Senior Web DeveloperCommented:
I'm glad it was useful for you :).

Ok, so about the text color. There is a MovieClip in the library, it includes a dynamic textfield and you can change the font, size, color or whatever in there.

About the animation, it's done with this line... let's break it out:
tween = new Tween(ticker,"x",Strong.easeOut,ticker.x,0,animationDuration,true);

The Tween class lets you create animations via code without too much of a hassle.

a) I tell the Tween class that I will animate the "ticker" object.
b) I tell the Tween that the animation will work over the "x" property (so, ticker.x will be the value that changes)
c) Strong.easeOut is one of the functions that can be applied to the tween to get different effects. You can use other things like Bounce, Elastic, Regular.
d) The animation will start at the current value of ticker.x which was something like 550
e) The animation will end at 0. So the ticker.x property will move from 550 to 0
f) I tell the Tween how many seconds the animation will take.
g) I force the duration to be in seconds.


Hope that helped, dunno if I was clear enough. If I wasn't I'll elaborate further.

flashhelpplzAuthor Commented:
Thanks! I think I understand...

Unfortunately I don't have my laptop with me to try it out right now, but for example if I wanted to make it animate from top to bottom I could just switch the x's for y's like
tween = new Tween(ticker,"y",StrongeaseOut,ticker.y,0,animationDuration,true);  ? and since it starts at 550, I would need to move the text field to somewhere at the top of the stage, too, right?

I know this is getting a little more complicated (for me anyway lol) but if I wanted to make it drop in from the top and leave out the right, would I need to add another new Tween? And I would have to make the first tween stop in the middle of the animation so the second one wouldn't be starting after it's already off the stage, right?  I'm just taking guesses-I wish I wasn't so clueless about actionscript...

Thanks so much for your help!! You have no idea how much I'd like to learn this stuff :D
Antonio EstradaTech Leader / Senior Web DeveloperCommented:
Exactly, you can play with those values and interchange them around.. here are a few examples:

(Line 1 should go instead of the line on the function showTicker, Line 2 should go instead of the line on hideTicker, and you'd also need to change the line ticker.x = stage.stageWidth; to ticker.x = 0;)


//fade into stage,fly out to the right
tween = new Tween(ticker,"alpha",Strong.easeOut,ticker.alpha,1,animationDuration,true);
var tweenOut:Tween = new Tween(currentTicker,"x",Strong.easeIn,currentTicker.x,stage.stageWidth*-1,animationDuration,true);
//fly from the top, fade out
tween = new Tween(ticker,"y",Strong.easeOut,ticker.y,stage.stageHeight/2,animationDuration,true);
var tweenOut:Tween = new Tween(currentTicker,"alpha",Strong.easeIn,currentTicker.alpha,0,animationDuration,true);
//etc ;)

Open in new window

flashhelpplzAuthor Commented:
Awesome, thank you so much!!! Thanks for explaining it, too, I really appreciate it!!
Hopefully one day I won't be so helpless anymore lol :D
Antonio EstradaTech Leader / Senior Web DeveloperCommented:
I'm glad to help ;)

It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Adobe Flash

From novice to tech pro — start learning today.