Compare BetweenAS3 and Tweener Easing

by clockmaker
♥30 | Line 148 | Modified 2009-09-21 11:35:21 | MIT License
play

ActionScript3 source code

/**
 * Copyright clockmaker ( http://wonderfl.net/user/clockmaker )
 * MIT License ( http://www.opensource.org/licenses/mit-license.php )
 * Downloaded from: http://wonderfl.net/c/2Yh2
 */

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	layout="absolute" width="465" height="465" frameRate="90"
	applicationComplete="init()">
	<mx:Script>
		<![CDATA[
			import flash.utils.getTimer;
			import flash.utils.getDefinitionByName;
			import org.libspark.betweenas3.tweens.ITween;
			import mx.collections.ArrayCollection;
			import org.libspark.betweenas3.easing.*;
			import org.libspark.betweenas3.BetweenAS3;
			import caurina.transitions.Tweener;
			
			static private const TWEENS:Array = [
				"Back", 
				"Bounce", 
				"Circ",
				"Circular",
				"Cubic", 
				"Custom", 
				"Elastic", 
				"Expo", 
				"Exponential", 
				"Linear", 
				"Physical", 
				"Quad", 
				"Quadratic", 
				"Quart", 
				"Quartic", 
				"Quint", 
				"Quintic", 
				"Sine"
			]
			static private const EASES:Array = [
				"easeInOut",
				"easeIn",
				"easeOut"
			]
			
			private var betweenBall:Sprite = new Sprite()
			private var tweenerBall:Sprite = new Sprite()
			private var betweenGraff:Sprite = new Sprite();
			private var tweenerGraff:Sprite = new Sprite();
			private var betweenLine:Sprite = new Sprite();
			private var tweenerLine:Sprite = new Sprite();
			private var tw:ITween;
			private function init():void{
				
				Back
				Bounce
				Circ
				Circular
				Cubic 
				Custom 
				Elastic 
				Expo
				Exponential 
				Linear 
				Physical
				Quad
				Quadratic
				Quart 
				Quartic 
				Quint 
				Quintic 
				Sine
				
				var base:Sprite = new Sprite();
				base.graphics.beginFill(0xFFFFFF)
				base.graphics.drawRect(0, 0, 350, 350);
				base.graphics.endFill()
				
				for(var i:int = 0; i<21; i++){
					base.graphics.lineStyle(1, 0xDDDDDD,1)
					base.graphics.moveTo(0, i/20 * 350)
					base.graphics.lineTo(350, i/20 * 350)
				}
				
				for(i=0; i<21; i++){
					base.graphics.lineStyle(1, 0xDDDDDD,1)
					base.graphics.moveTo(i/20 * 350, 0)
					base.graphics.lineTo(i/20 * 350, 350)
				}
				graff.addChild(base)
				
				betweenBall.graphics.beginFill(0xFF0000);
				betweenBall.graphics.drawRect(-4,-4,8,8);
				tweenerBall.graphics.beginFill(0x0000FF);
				tweenerBall.graphics.drawCircle(0,0,4);
				betweenLine.addChild(new Bitmap(new BitmapData(350,1,false,0xFFFF0000)));
				tweenerLine.addChild(new Bitmap(new BitmapData(350,1,false,0xFF0000FF)));
				graff.addChild(betweenBall);
				graff.addChild(tweenerBall);
				graff.addChild(betweenGraff);
				graff.addChild(tweenerGraff);
				graff.addChild(betweenLine);
				graff.addChild(tweenerLine);
				
				tweenCombo.dataProvider = new ArrayCollection(TWEENS);
				easeCombo.dataProvider = new ArrayCollection(EASES);
			}
			
			private function changeHandler(e:Event = null):void{
				
				var oldTime:Number = getTimer()
				
				betweenGraff.graphics.clear();
				var cls:Class = getDefinitionByName("org.libspark.betweenas3.easing." + tweenCombo.selectedItem as String) as Class;
				if(tw) if(tw.isPlaying) tw.stop();
				tw = BetweenAS3.tween(betweenBall, {x:350, y:0}, {x:0, y:350}, 5, cls[easeCombo.selectedItem]);
				betweenGraff.graphics.lineStyle(1, 0xFF0000,1)
				betweenGraff.graphics.moveTo(0, 350)
				tw.onUpdate = function():void{
					var time:Number = (getTimer() - oldTime)/1000 / 5 * 350
					var value:Number = betweenBall.y;
					betweenGraff.graphics.lineTo(time, value);
					betweenLine.y = value;
				}
				tw.play()
				
				Tweener.pauseAllTweens();
				tweenerGraff.graphics.clear();
				tweenerBall.x = 0;
				tweenerBall.y = 350;
				tweenerGraff.graphics.lineStyle(1, 0x0000FF,1)
				tweenerGraff.graphics.moveTo(0, 350)
				switch(tweenCombo.selectedItem){
					case "Circular":
					case "Custom":
					case "Exponential":
					case "Physical":
					case "Linear":
					case "Quadratic":
					case "Quartic": 
					case "Quintic":
						return;
				}
				
				Tweener.addTween(tweenerBall, {
					x : 350, y:0,
					time : 5,
					transition : easeCombo.selectedItem + tweenCombo.selectedItem,
					onUpdate:function():void {
						var timeT:Number = (getTimer() - oldTime) / 1000 / 5 * 350
						var valueT:Number = tweenerBall.y;
						tweenerGraff.graphics.lineTo(timeT, valueT);
						tweenerLine.y = valueT;
					}
				});
			}
		]]>
	</mx:Script>
	
	<mx:ComboBox id="tweenCombo" change="changeHandler()" x="5" y="35" rowCount="{TWEENS.length}" />
	<mx:ComboBox id="easeCombo" change="changeHandler()" x="150" y="35" />
	<mx:Label text="BetweenAS3" color="0xFF0000"  x="10" y="437"/>
	<mx:Label text="Tweener" color="0x0000FF"  x="114" y="437"/>
	<mx:UIComponent id="graff" width="460" height="400" x="5" y="65" />
	<mx:Label x="6" y="9" text="Compaere BetweenAS3 and Tweener Easing" fontSize="12" fontWeight="bold"/>
	<mx:Button x="382" y="35" label="Play" click="changeHandler()"/>
</mx:Application>

Forked