In Theory

The following code dynamically creates a button array, and sets up a tweening sequence between these buttons – one after the other, the buttons will be revealed.

This is my response to this Actionscript.org post:

http://www.actionscript.org/forums/showthread.php3?t=194501

The goal of this code is to automate button addition and tweening. It is not exactly useful as is, though, since it sort of assumes that you want to put them in a grid, and have the events fire in order. It can be modified quite easily – read the code for hints as to where to change a certain setting.

In Practice

To use this code, create an empty Flash file, and create one button in the library. In the Properties of that library button:

  • set the “Name” to “buttonTweenTest
  • check the “Export to Actionscript”
  • set the “Class” to the same as the “Name”: “buttonTweenTest
  • Next, set the root object’s class to “tweenTest” (see this post for help)

    Finally, put the following code in a file named “tweenTest.as” in the same directory as your FLA file.

    package  
    {
    	import fl.motion.easing.Bounce;
    	import fl.transitions.Tween;
    	import fl.transitions.TweenEvent;
    	import flash.display.SimpleButton;
    	import flash.display.Sprite;
    	import flash.events.Event;
    	import flash.events.MouseEvent;
    	import flash.geom.Point;
    	
    	/**
    	 * ...
    	 * @author Delfeld, copyright 2008
    	 */
    	public class tweenTest extends Sprite
    	{
    		private var newButton:SimpleButton;
    		private var buttonArr:Array;
    		private var twn:Tween;
    		private var totalButtonsInRow:Number;
    		private var totalButtonsInCol:Number;
    		private var curItemNum:int;
    		private var gap:Point;
    		private var totalButtons:int;
    		private var alphaStartVal:Number;
    		private var alphaEndVal:Number;
    		private var tweenInterval:Number;
    		
    		public function tweenTest() 
    		{
    			addEventListener(Event.ADDED_TO_STAGE, initHnd, false, 0, true);
    		}		
    		
    		private function setDefaults():void
    		{
    			alphaStartVal = .1;
    			alphaEndVal = 1;
    			tweenInterval = .1;
    			
    			gap = new Point(12, 9);
    			
    			totalButtons = 20;
    			totalButtonsInRow = 0;
    			totalButtonsInCol = 0;
    			
    			if (buttonArr !== null) 
    			{
    				var valj:int = buttonArr.length;
    				for (var j:int = 0; j < valj; j++) 
    				{
    					removeChild(buttonArr[j]);
    					buttonArr[j] = null;
    				}
    			}
    			buttonArr = new Array();
    		}
    		
    		private function initHnd(e:Event):void 
    		{
    			setDefaults();
    			
    			for (var i:uint = 0; i < totalButtons; i++) 
    			{
    				// create a new button, name
    				buttonArr[i] = new buttonTweenTest();
    				buttonArr[i].name = "button" + i;
    				
    				// set button grid
    				if (i == 0 ) 
    				{
    					setGrid(buttonArr[i].width, buttonArr[i].height);
    				}
    				
    				// listen for being added
    				buttonArr[i].addEventListener(Event.ADDED_TO_STAGE, initButtonHnd, false, 0, true);
    				
    				// add button to the stage
    				addChildAt(buttonArr[i], i + 1	);
    			}
    		}
    		
    		// set the dimensions for the button grid
    		private function setGrid(wid:int, ht:int):void
    		{
    			if (totalButtonsInRow == 0) 
    			{
    				totalButtonsInRow = Math.abs(Math.floor((this.width / (wid + gap.x)) - 1));
    				totalButtonsInCol = Math.abs(Math.floor((this.height / (ht  + gap.y)) - 1));
    				
    				//trace("tweenTest.setGrid: " + Math.abs(int((this.width + gap.x) / wid - 1)));
    				//trace("tweenTest.setGrid: " + int((this.width + gap.x) / wid - 1));
    				//trace("tweenTest.setGrid: " + ((this.width + gap.x) / wid - 1));
    				//trace("tweenTest.setGrid: " + this.width);
    				//trace("tweenTest.setGrid: " + gap.x);
    				//trace("tweenTest.setGrid: " + wid );
    				
    				trace("tweenTest.initHnd: totalButtonsInRow: " + totalButtonsInRow + ", totalButtonsInCol: " + totalButtonsInCol);
    			}
    		}
    		
    		private function initButtonHnd(e:Event):void 
    		{
    			// remove the listener
    			e.target.removeEventListener(e.type, initButtonHnd);
    			
    			// find this event's button
    			var btIdx:int = buttonArr.indexOf(e.target);
    			if (btIdx !== -1) 
    			{
    				//trace("tweenTest.initButtonHnd: " + btIdx);
    				
    				// for test: set alpha of everything not the first button to alphaStartVal
    				if (buttonArr[btIdx].name !== "button0") 
    				{
    					buttonArr[btIdx].alpha = alphaStartVal;
    				}
    
    				// move this button to grid position
    				buttonArr[btIdx].x  = (buttonArr[btIdx].width + gap.x ) * Math.floor((btIdx % totalButtonsInRow) + 1);
    				buttonArr[btIdx].y  = (buttonArr[btIdx].height + gap.y ) * Math.floor((btIdx / totalButtonsInRow) + 1);
    				trace("tweenTest.initButtonHnd: " + buttonArr[btIdx].x);
    				
    				// listen for click event
    				buttonArr[btIdx].addEventListener(MouseEvent.CLICK, buttonClickHnd, false, 0, true);
    			}
    			else
    			{
    				trace("tweenTest.initButtonHnd: button not found.");
    			}
    		}
    		
    		private function buttonClickHnd(e:MouseEvent):void 
    		{
    			// create a tween on click
    			createTween(SimpleButton(e.target));
    		}
    		
    		// recursive, when used with with tweenFinishHnd
    		private function createTween(button:SimpleButton):void
    		{
    			// erase old tween, create a new one
    			// Note: for this example, there should only be one tween
    			
    			// if tween does not exist, or tween's affected object is the current one
    			if (twn === null || twn.obj !== button)
    			{
    				// if tween exists. . .
    				if ( twn ) 
    				{
    					// change the focus object of the tween
    					twn.obj = button;
    					
    					// listen for finish of this tween
    					twn.addEventListener(TweenEvent.MOTION_FINISH, tweenFinishHnd, false, 0, true);
    					
    					// start the tween from 0 again
    					twn.start();
    				}
    				// if tween does not exist:
    				else 
    				{
    					// create the tween
    					twn = new Tween(button, "alpha", Bounce.easeIn, alphaStartVal, alphaEndVal, tweenInterval, true );
    					
    					// listen for finish of this tween
    					twn.addEventListener(TweenEvent.MOTION_FINISH, tweenFinishHnd, false, 0, true);
    				}
    			}
    		}
    		
    		private function tweenFinishHnd(e:TweenEvent):void 
    		{
    			// remove tween listener
    			e.target.removeEventListener(e.type, tweenFinishHnd);
    			//trace("tweenTest.tweenFinishHnd: ");
    			
    			// find this event's button
    			var btIdx:int = buttonArr.indexOf(Tween(e.target).obj);
    			if (btIdx !== -1 
    				&& (btIdx + 1 ) < buttonArr.length) 
    			{
    				createTween(buttonArr[btIdx + 1]);
    			}
    			else 
    			{
    				trace("tweenTest.tweenFinishHnd: Tweening complete.");
    				twn = null;
    			}
    		}
    	}	
    }

    If you want to set up a trace() to test any areas, make sure to check :

    File | Publish Settings. . .

    “Flash” tab, “Advanced” section, “Permit Debugging”

    – 30 –

    Advertisements