Super simple Flash ticker using Tweener

So you need a Flash based ticker of some sort? It needs to load items dynamically you say? Oh, well in that case let me give you a hand (well me and Tweener).

This example is just a quick Frame action. You can easily abstract it to a class however (and maybe I'll do that in a future post...).

Also, I'm not going to go into detail on this post yet. It's late and I just wanted to get something up... so wait a day or two if you want the breakdown.

First lets look at the XML format. Fairly simple. Not much to say about it.



	        
			news.ticker.001
			Bush warns Iran over insurgents
			President George W Bush has warned Iran to stop supporting the militants.
		
		
			news.ticker.002
			Fresh fuel protests held in Burma
			Further protests have been held in Burma over fuel price rises.
		
		
			news.ticker.003
			Stock markets suffer fresh falls
			New York shares cast a shadow over global stock markets again.
		
		
			news.ticker.004
			US home sales decline yet further
			Concern that US house prices could fall sharply.
		
		
			news.ticker.005
			Apollo Moon photos reveal detail
			Highly detailed photographs of the Moon taken by the Apollo missions.
		
		
			news.ticker.006
			Russian music site to 'relaunch'
			Russian music download site allofmp3.com looks set to resume business.

An here is the AS3 code



        import flash.display.*;
	import flash.events.*;
	import flash.net.*;
	import flash.text.*;
        import caurina.transitions.*;

		var item:Number = 0;
		var itemsTotal:Number
		 
		 
		var _xmlLoader:URLLoader
		var _xmlData:XML;
		var newsItems:XMLList;
		
		
		var sourceFormat = new TextFormat();
		sourceFormat.font = 'Century Gothic';
		sourceFormat.kerning = true;
		sourceFormat.color = 0x333333;
		sourceFormat.size = 20;
		sourceFormat.align = 'left';
			
		var bylineFormat = new TextFormat();
		bylineFormat.font = 'Century Gothic';
		bylineFormat.kerning = true;
		bylineFormat.color = 0x333333;
		bylineFormat.size = 15;
		bylineFormat.align = 'left';
			
		var newsTicker = new MovieClip();
		newsTicker.x = 10;
		newsTicker.y = 5;
			
		var newsTickerMask = new MovieClip();
		newsTickerMask.graphics.beginFill(0x000000, 0);
		newsTickerMask.graphics.drawRect(0,0,530,100);
		newsTickerMask.graphics.endFill();
		newsTickerMask.x = 10;
		newsTickerMask.y = 5;
			
			
		loadXML("news_tickers.xml");
			
                function loadXML(xmlpath)
		{
			_xmlLoader = new URLLoader();
			_xmlData = new XML();
			_xmlLoader.addEventListener(Event.COMPLETE, onLoadXML,false,0,true);
			_xmlLoader.load(new URLRequest(xmlpath));
		}

		function onLoadXML(e:Event):void {
			_xmlData = new XML(e.target.data);
			drawScreen();
		}
			
			
		function drawScreen()
                {
			
		newsItems = _xmlData.*;
		//trace(newsItems);
			
		 	itemsTotal = newsItems.length();
			trace(itemsTotal);
			for(var i=0; i < itemsTotal;i++)
			{
				var _newsItemMC = new MovieClip();
				_newsItemMC.alpha = 1;
				_newsItemMC.name = "newsItem_"+i
				_newsItemMC.x = 1000;
				
				var _source = new TextField();
				_source.height = 30;
				_source.width = 525;
				_source.embedFonts = true;
				_source.text = newsItems[i].source;
				_source.x = 0;
				_source.y = 0;
				_source.selectable = false; 
				_source.autoSize = TextFieldAutoSize.LEFT;
				_source.setTextFormat(sourceFormat);
				var _byline = new TextField();
				_byline.height = 20;
				_byline.width = 525;
				_byline.embedFonts = true;
				_byline.text = newsItems[i].byline;
				_byline.x = 0;
				_byline.y = 25
				_byline.selectable = false; 
				_byline.autoSize = TextFieldAutoSize.LEFT;
				if (_byline.length > 65){
				_byline.replaceText(65, 2000, "...")
				}
				_byline.setTextFormat(bylineFormat);

			        _newsItemMC.addChild(_source);
			        _newsItemMC.addChild(_byline);
			        newsTicker.addChild(_newsItemMC);
			
			}//end for loop
			
			
			addChild(newsTicker);
			addChild(newsTickerMask);
			newsTicker.mask = newsTickerMask;
			
			showItem();
			
			
                }
			
		function hideItem(itemMC){
			//trace(itemMC.name);
			Tweener.addTween(itemMC, {x: -1000, alpha:1, time:4, delay: 4, onStart: showItem});
			
		}
			
			
		function showItem(){
				if(item < itemsTotal){
				var itemMC = newsTicker.getChildByName("newsItem_"+item);
				
				//trace(itemMC.name);
				
				Tweener.addTween(itemMC, {x: 0, alpha:1, time:2, delay: 0, onComplete: hideItem, onCompleteParams: [itemMC]});
				//resetTime(itemMC);
				item++
				}else{
					item = 0;
					showItem();
				}
					
		}