Skip to content


[AS 3] Yahoo! TabBar Component

I was just wondering at the ease of the Yahoo! component, so I modified their code to output simple tab data (just the page id).

You can grab the component here: http://developer.yahoo.com/flash/

Here is the document class:

package
{
	import flash.display.Sprite;
	import flash.events.Event;
	import fl.data.DataProvider;
	import com.yahoo.astra.fl.controls.TabBar;
	import flash.text.TextField;
    import flash.text.TextFieldAutoSize;
    import flash.text.TextFieldType;
    import flash.text.TextFormat;  

	public class YahooTabNavigation extends Sprite
	{
		private var navData:Array;
		private var btnID:int;
		private var navbar:TabBar;

		public function YahooTabNavigation()
		{
			// add the text fields
			buildUI();

			// set up the menu
			var navData:Array = [ "Home", "About", "Contact","Blah", "Blah 1", "Blah Blah" ];

			var navbar:TabBar = new TabBar();
			navbar.move(10, 10);
			navbar.dataProvider = new DataProvider( navData );
			navbar.selectedIndex = 0;
			addChild( navbar );

			navbar.addEventListener(Event.CHANGE,tabChange);
		}

		private function tabChange(e:Event):void
		{
			var index:int = ( e.currentTarget as TabBar ).selectedIndex;
			statusField.text = "Page: " + index;
		}

		private var statusField:TextField;
		private var statusFieldLbl:TextField;

		private function buildUI():void
		{
			// New Output Shared Object
            var txtFormat:TextFormat = new TextFormat();
            txtFormat.font = "Arial";
            txtFormat.color = 0x336699;
            txtFormat.size = 14;
            txtFormat.underline = false; 

			// Status Field
            statusField = new TextField();
            statusField.defaultTextFormat = txtFormat;
            addChild(statusField);
            statusField.x = 10;
            statusField.y = 74;
            statusField.width = 200;
            statusField.height = 22;
            statusField.multiline = true;
            statusField.wordWrap = true;
            statusField.border = true;
            statusField.background = true;  

            statusFieldLbl = new TextField();
            statusFieldLbl.defaultTextFormat = txtFormat;
            addChild(statusFieldLbl);
            statusFieldLbl.x = 10;
            statusFieldLbl.y = 50;
            statusFieldLbl.width = 250;
            statusFieldLbl.height = 20;
            statusFieldLbl.text = "Current Page:";
            statusFieldLbl.selectable = false;
		}

	}
}

Posted in Actionscript 3, Yahoo! Components.


0 Responses

Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.



Some HTML is OK

or, reply to this post via trackback.