jp.ferv.blog » Tweensy http://ferv.jp/blog 「ActionScriptは素晴らしい。コンパイルする価値がある。」って偉い人が言ってた。 Sun, 15 Aug 2010 00:42:34 +0000 http://wordpress.org/?v=2.9 ja hourly 1 Tweensy - easeOutIn http://ferv.jp/blog/2009/05/28/tweensy-easeoutin/ http://ferv.jp/blog/2009/05/28/tweensy-easeoutin/#comments Wed, 27 May 2009 16:58:37 +0000 dsk http://flabo.org/?p=840 tweensy_easeoutin

TweenerにはあってTweensyにないトランジションタイプがeaseOutIn系。 これは、Tweenerがトランジションを計算する caurina.transitions.Equations クラスにはeaseOutIn系関数が実装されているが、Tweensyで使う fl.motion.easing にはeaseOutIn系の関数が実装されていないからだ。
なので、TweensyでeaseOutIn系の動きをさせたいときには Tweener の Equations.easeOutIn*** 関数を、Tweensyの引数の ease:Function に渡して夢のコラボを実現するわけ。

caurina.transitions.Equations クラスの aseOutInQuad 関数を Tweensy.to の第四引数で渡すとこだけ例を挙げておく。

  • ActionScript
  • Tweensy_easeOutIn.as
  • Source
package {
	import caurina.transitions.Equations;
	import com.flashdynamix.motion.Tweensy;
	import flash.display.Sprite;

	// 中略

	public class Tweensy_easeOutIn extends Sprite {

		// 中略

		private function start():void {
			Tweensy.to(box, { x: 500 }, 3, Equations.easeOutInQuad);
		}

	}
}
  1. package {
  2.     import caurina.transitions.Equations;
  3.     import com.flashdynamix.motion.Tweensy;
  4.     import flash.display.Sprite;
  5.  
  6.     // 中略
  7.  
  8.     public class Tweensy_easeOutIn extends Sprite {
  9.  
  10.         // 中略
  11.  
  12.         private function start():void {
  13.             Tweensy.to(box, { x: 500 }, 3, Equations.easeOutInQuad);
  14.         }
  15.  
  16.     }
  17. }

でも、そもそもeaseOutIn系ってあんま使わないかも・・・

]]> http://ferv.jp/blog/2009/05/28/tweensy-easeoutin/feed/ 0 TweensySequence - push http://ferv.jp/blog/2009/05/21/tweensy_12/ http://ferv.jp/blog/2009/05/21/tweensy_12/#comments Wed, 20 May 2009 15:26:23 +0000 dsk http://flabo.org/?p=681 Tweensyで連続したアニメーションをしたいけど、それらを一連のトゥィーンとして管理したい。そんな時に使うのがTweensySequenceクラス。

アニメーションしたい順にTweensySequence.push()して、シーケンスに登録する。で、TweensySequence.start()で開始する。

TestTweensy_12.swf

  • ActionScript
  • TestTweensy_12.as
  • Source
package  {
	import com.flashdynamix.motion.TweensySequence;
	import fl.motion.easing.Elastic;
	import fl.motion.easing.Quadratic;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.events.MouseEvent;

	[SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
	public class TestTweensy_12 extends Sprite {

		private var _arrow:Sprite;
		private var _tweensySequence:TweensySequence;
		private var _button:Button;

		public function TestTweensy_12() {
			initArrow();
			initTweensySequence();
			initButton();

			startTweensySequence();
		}

		private function initArrow():void{
			_arrow = createArrow();
			_arrow.x = 50;
			_arrow.y = 50;
			addChild(_arrow);
		}

		private function createArrow():Sprite {
			var arrow:Sprite = new Sprite();
			var graphics:Graphics = arrow.graphics;
			var commands:Vector. = new Vector.(8, true);
			var data:Vector. = new Vector.(16, true);

			commands[0] = 1;
			commands[1] = commands[2] = commands[3] = commands[4] = commands[5] = commands[6] = commands[7] = 2;
			data[0] = 10; data[1] = 0;
			data[2] = 0; data[3] = -10;
			data[4] = 0; data[5] = -5;
			data[6] = -10; data[7] = -5;
			data[8] = -10; data[9] = 5;
			data[10] = 0; data[11] = 5;
			data[12] = 0; data[13] = 10;
			data[14] = 10; data[15] = 0;

			graphics.beginFill(0x0099cc);
			graphics.drawPath(commands, data);
			graphics.endFill();

			return arrow;
		}

		private function initTweensySequence():void{
			_tweensySequence = new TweensySequence();

			_tweensySequence.push(_arrow, { x: 550 }, 1, Quadratic.easeOut);
			_tweensySequence.push(_arrow, { rotation: 90 }, 1, Elastic.easeOut);
			_tweensySequence.push(_arrow, { y: 350 }, 1, Quadratic.easeOut);
			_tweensySequence.push(_arrow, { rotation: -180 }, 1, Elastic.easeOut);
			_tweensySequence.push(_arrow, { x: 50 }, 1, Quadratic.easeOut);
			_tweensySequence.push(_arrow, { rotation: -90 }, 1, Elastic.easeOut);
			_tweensySequence.push(_arrow, { y: 50 }, 1, Quadratic.easeOut);
			_tweensySequence.push(_arrow, { rotation: 0 }, 1, Elastic.easeOut, 0, 1);

			_tweensySequence.onComplete = onTweensySequenceComplete;
		}

		private function onTweensySequenceComplete():void{
			_tweensySequence.stop();
			_tweensySequence.replay();
		}

		private function initButton():void{
			_button = new Button();
			_button.label = 'pause()';
			_button.addEventListener(MouseEvent.CLICK, onButtonClick);
			addChild(_button);
		}

		private function startTweensySequence():void {
			_tweensySequence.start();
		}

		private function onButtonClick(e:MouseEvent):void {
			if (_tweensySequence.paused) {
				_tweensySequence.resume();
				_button.label = 'pause()';
			} else {
				_tweensySequence.pause();
				_button.label = 'resume()';
			}
		}


	}

}


import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.BevelFilter;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;

internal class Button extends Sprite {

	private var _textField:TextField;

	public function get label():String { return _textField.text; }
	public function set label(value:String):void {
		_textField.text = value;
		updateFill();
	}

	public function Button() {
		_textField = new TextField();
		_textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
		_textField.autoSize = TextFieldAutoSize.LEFT;
		_textField.x = 8;
		_textField.y = 4;
		addChild(_textField);

		filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
		buttonMode = true;
		mouseChildren = false;
		addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
		addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
	}

	private function onButtonMouseUp(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
	}

	private function onButtonMouseDown(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
	}

	private function updateFill():void {
		graphics.clear();
		graphics.beginFill(0xCCCCCC);
		graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
		graphics.endFill();
	}

}
  1. package  {
  2.     import com.flashdynamix.motion.TweensySequence;
  3.     import fl.motion.easing.Elastic;
  4.     import fl.motion.easing.Quadratic;
  5.     import flash.display.Graphics;
  6.     import flash.display.Sprite;
  7.     import flash.events.MouseEvent;
  8.  
  9.     [SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
  10.     public class TestTweensy_12 extends Sprite {
  11.  
  12.         private var _arrow:Sprite;
  13.         private var _tweensySequence:TweensySequence;
  14.         private var _button:Button;
  15.  
  16.         public function TestTweensy_12() {
  17.             initArrow();
  18.             initTweensySequence();
  19.             initButton();
  20.  
  21.             startTweensySequence();
  22.         }
  23.  
  24.         private function initArrow():void{
  25.             _arrow = createArrow();
  26.             _arrow.x = 50;
  27.             _arrow.y = 50;
  28.             addChild(_arrow);
  29.         }
  30.  
  31.         private function createArrow():Sprite {
  32.             var arrow:Sprite = new Sprite();
  33.             var graphics:Graphics = arrow.graphics;
  34.             var commands:Vector.<int> = new Vector.<int>(8, true);
  35.             var data:Vector.<number> = new Vector.<number>(16, true);
  36.  
  37.             commands[0] = 1;
  38.             commands[1] = commands[2] = commands[3] = commands[4] = commands[5] = commands[6] = commands[7] = 2;
  39.             data[0] = 10; data[1] = 0;
  40.             data[2] = 0; data[3] = -10;
  41.             data[4] = 0; data[5] = -5;
  42.             data[6] = -10; data[7] = -5;
  43.             data[8] = -10; data[9] = 5;
  44.             data[10] = 0; data[11] = 5;
  45.             data[12] = 0; data[13] = 10;
  46.             data[14] = 10; data[15] = 0;
  47.  
  48.             graphics.beginFill(0x0099cc);
  49.             graphics.drawPath(commands, data);
  50.             graphics.endFill();
  51.  
  52.             return arrow;
  53.         }
  54.  
  55.         private function initTweensySequence():void{
  56.             _tweensySequence = new TweensySequence();
  57.  
  58.             _tweensySequence.push(_arrow, { x: 550 }, 1, Quadratic.easeOut);
  59.             _tweensySequence.push(_arrow, { rotation: 90 }, 1, Elastic.easeOut);
  60.             _tweensySequence.push(_arrow, { y: 350 }, 1, Quadratic.easeOut);
  61.             _tweensySequence.push(_arrow, { rotation: -180 }, 1, Elastic.easeOut);
  62.             _tweensySequence.push(_arrow, { x: 50 }, 1, Quadratic.easeOut);
  63.             _tweensySequence.push(_arrow, { rotation: -90 }, 1, Elastic.easeOut);
  64.             _tweensySequence.push(_arrow, { y: 50 }, 1, Quadratic.easeOut);
  65.             _tweensySequence.push(_arrow, { rotation: 0 }, 1, Elastic.easeOut, 0, 1);
  66.  
  67.             _tweensySequence.onComplete = onTweensySequenceComplete;
  68.         }
  69.  
  70.         private function onTweensySequenceComplete():void{
  71.             _tweensySequence.stop();
  72.             _tweensySequence.replay();
  73.         }
  74.  
  75.         private function initButton():void{
  76.             _button = new Button();
  77.             _button.label = 'pause()';
  78.             _button.addEventListener(MouseEvent.CLICK, onButtonClick);
  79.             addChild(_button);
  80.         }
  81.  
  82.         private function startTweensySequence():void {
  83.             _tweensySequence.start();
  84.         }
  85.  
  86.         private function onButtonClick(e:MouseEvent):void {
  87.             if (_tweensySequence.paused) {
  88.                 _tweensySequence.resume();
  89.                 _button.label = 'pause()';
  90.             } else {
  91.                 _tweensySequence.pause();
  92.                 _button.label = 'resume()';
  93.             }
  94.         }
  95.  
  96.  
  97.     }
  98.  
  99. }
  100.  
  101.  
  102. import flash.display.Graphics;
  103. import flash.display.Sprite;
  104. import flash.events.MouseEvent;
  105. import flash.filters.BevelFilter;
  106. import flash.text.TextField;
  107. import flash.text.TextFieldAutoSize;
  108. import flash.text.TextFormat;
  109.  
  110. internal class Button extends Sprite {
  111.  
  112.     private var _textField:TextField;
  113.  
  114.     public function get label():String { return _textField.text; }
  115.     public function set label(value:String):void {
  116.         _textField.text = value;
  117.         updateFill();
  118.     }
  119.  
  120.     public function Button() {
  121.         _textField = new TextField();
  122.         _textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
  123.         _textField.autoSize = TextFieldAutoSize.LEFT;
  124.         _textField.x = 8;
  125.         _textField.y = 4;
  126.         addChild(_textField);
  127.  
  128.         filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  129.         buttonMode = true;
  130.         mouseChildren = false;
  131.         addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
  132.         addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
  133.     }
  134.  
  135.     private function onButtonMouseUp(e:MouseEvent):void {
  136.         var button:Sprite = e.currentTarget as Sprite;
  137.  
  138.         button.filters = null;
  139.         button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  140.     }
  141.  
  142.     private function onButtonMouseDown(e:MouseEvent):void {
  143.         var button:Sprite = e.currentTarget as Sprite;
  144.  
  145.         button.filters = null;
  146.         button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
  147.     }
  148.  
  149.     private function updateFill():void {
  150.         graphics.clear();
  151.         graphics.beginFill(0xCCCCCC);
  152.         graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
  153.         graphics.endFill();
  154.     }
  155.  
  156. }

]]> http://ferv.jp/blog/2009/05/21/tweensy_12/feed/ 0 TweensyGroup - shortCuts http://ferv.jp/blog/2009/05/20/tweensy_11/ http://ferv.jp/blog/2009/05/20/tweensy_11/#comments Tue, 19 May 2009 16:04:36 +0000 dsk http://flabo.org/?p=678 TweensyGroupクラスには、ショートカットメソッドが用意されている。

TweensyGroupのASDocによるとこんな感じ。

  • alphaTo
  • brightnessTo
  • colorTo
  • colorTransformTo
  • contrastTo
  • filterTo
  • matrixTo
  • rotateTo
  • scaleTo
  • slideTo
  • soundTransformTo
ここまでやるなら、contrastTo/hueRotationTo/saturationTo/volumeTo/panToとかもあってもいいけどまだないみたい。

今回は、alphaTo/scaleTo/rotateTo/slideToを使ってみた。

TestTweensy_11.swf

  • ActionScript
  • TestTweensy_11.as
  • Source
package  {
	import com.flashdynamix.motion.TweensyGroup;
	import fl.motion.easing.Bounce;
	import fl.motion.easing.Elastic;
	import fl.motion.easing.Linear;
	import fl.motion.easing.Quadratic;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	[SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
	public class TestTweensy_11 extends Sprite {

		private var _arrow:Sprite;
		private var _textField:TextField;

		public function TestTweensy_11() {
			initArrow();
			initTextField();

			startTweensyGroup();
		}

		private function initArrow():void {
			_arrow = createArrow();
			_arrow.x = stage.stageWidth / 2;
			_arrow.y = stage.stageHeight / 2;
			addChild(_arrow);
		}

		private function createArrow():Sprite {
			var arrow:Sprite = new Sprite();
			var graphics:Graphics = arrow.graphics;
			var commands:Vector. = new Vector.(8, true);
			var data:Vector. = new Vector.(16, true);

			commands[0] = 1;
			commands[1] = commands[2] = commands[3] = commands[4] = commands[5] = commands[6] = commands[7] = 2;
			data[0] = 10; data[1] = 0;
			data[2] = 0; data[3] = -10;
			data[4] = 0; data[5] = -5;
			data[6] = -10; data[7] = -5;
			data[8] = -10; data[9] = 5;
			data[10] = 0; data[11] = 5;
			data[12] = 0; data[13] = 10;
			data[14] = 10; data[15] = 0;

			graphics.beginFill(0x0099cc);
			graphics.drawPath(commands, data);
			graphics.endFill();

			return arrow;
		}

		private function initTextField():void{
			_textField = createTextField();
			_textField.x = 10;
			_textField.y = 10;
			addChild(_textField);
		}

		private function createTextField():TextField {
			var textField:TextField = new TextField();
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);

			textField.defaultTextFormat = textFormat;
			textField.autoSize = TextFieldAutoSize.LEFT;

			return textField;
		}

		private function startTweensyGroup():void {
			var tweensyGroup:TweensyGroup = new TweensyGroup();
			var targetX:Number = Math.random() * stage.stageWidth;
			var targetY:Number = Math.random() * stage.stageHeight;
			var targetRotation:Number = Math.atan2(targetY - _arrow.y, targetX - _arrow.x) / Math.PI * 180;

			tweensyGroup.slideTo(_arrow, targetX, targetY, 3, Quadratic.easeInOut, 1);
			tweensyGroup.scaleTo(_arrow, 1 + Math.random() * 4, 2, Bounce.easeOut, 2);
			tweensyGroup.rotateTo(_arrow, targetRotation, 4, Elastic.easeOut);
			tweensyGroup.alphaTo(_arrow, 0.5 + Math.random() * 0.5, 1, Linear.easeNone, 3);

			tweensyGroup.onUpdate = onTweensyGroupUpdate;
			tweensyGroup.onComplete = onTweensyGroupComplete;
		}

		private function onTweensyGroupUpdate():void{
			var text:String = '';

			text += '_arrow.x = ' + _arrow.x + '\n';
			text += '_arrow.y = ' + _arrow.y + '\n';
			text += '_arrow.scaleX = ' + _arrow.scaleX + '\n';
			text += '_arrow.scaleY = ' + _arrow.scaleY + '\n';
			text += '_arrow.rotation = ' + _arrow.rotation + '\n';
			text += '_arrow.alpha = ' + _arrow.alpha;

			_textField.text = text;
		}

		private function onTweensyGroupComplete():void{
			startTweensyGroup();
		}


	}

}
  1. package  {
  2.     import com.flashdynamix.motion.TweensyGroup;
  3.     import fl.motion.easing.Bounce;
  4.     import fl.motion.easing.Elastic;
  5.     import fl.motion.easing.Linear;
  6.     import fl.motion.easing.Quadratic;
  7.     import flash.display.Graphics;
  8.     import flash.display.Sprite;
  9.     import flash.text.TextField;
  10.     import flash.text.TextFieldAutoSize;
  11.     import flash.text.TextFormat;
  12.  
  13.     [SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
  14.     public class TestTweensy_11 extends Sprite {
  15.  
  16.         private var _arrow:Sprite;
  17.         private var _textField:TextField;
  18.  
  19.         public function TestTweensy_11() {
  20.             initArrow();
  21.             initTextField();
  22.  
  23.             startTweensyGroup();
  24.         }
  25.  
  26.         private function initArrow():void {
  27.             _arrow = createArrow();
  28.             _arrow.x = stage.stageWidth / 2;
  29.             _arrow.y = stage.stageHeight / 2;
  30.             addChild(_arrow);
  31.         }
  32.  
  33.         private function createArrow():Sprite {
  34.             var arrow:Sprite = new Sprite();
  35.             var graphics:Graphics = arrow.graphics;
  36.             var commands:Vector.<int> = new Vector.<int>(8, true);
  37.             var data:Vector.<number> = new Vector.<number>(16, true);
  38.  
  39.             commands[0] = 1;
  40.             commands[1] = commands[2] = commands[3] = commands[4] = commands[5] = commands[6] = commands[7] = 2;
  41.             data[0] = 10; data[1] = 0;
  42.             data[2] = 0; data[3] = -10;
  43.             data[4] = 0; data[5] = -5;
  44.             data[6] = -10; data[7] = -5;
  45.             data[8] = -10; data[9] = 5;
  46.             data[10] = 0; data[11] = 5;
  47.             data[12] = 0; data[13] = 10;
  48.             data[14] = 10; data[15] = 0;
  49.  
  50.             graphics.beginFill(0x0099cc);
  51.             graphics.drawPath(commands, data);
  52.             graphics.endFill();
  53.  
  54.             return arrow;
  55.         }
  56.  
  57.         private function initTextField():void{
  58.             _textField = createTextField();
  59.             _textField.x = 10;
  60.             _textField.y = 10;
  61.             addChild(_textField);
  62.         }
  63.  
  64.         private function createTextField():TextField {
  65.             var textField:TextField = new TextField();
  66.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  67.  
  68.             textField.defaultTextFormat = textFormat;
  69.             textField.autoSize = TextFieldAutoSize.LEFT;
  70.  
  71.             return textField;
  72.         }
  73.  
  74.         private function startTweensyGroup():void {
  75.             var tweensyGroup:TweensyGroup = new TweensyGroup();
  76.             var targetX:Number = Math.random() * stage.stageWidth;
  77.             var targetY:Number = Math.random() * stage.stageHeight;
  78.             var targetRotation:Number = Math.atan2(targetY - _arrow.y, targetX - _arrow.x) / Math.PI * 180;
  79.  
  80.             tweensyGroup.slideTo(_arrow, targetX, targetY, 3, Quadratic.easeInOut, 1);
  81.             tweensyGroup.scaleTo(_arrow, 1 + Math.random() * 4, 2, Bounce.easeOut, 2);
  82.             tweensyGroup.rotateTo(_arrow, targetRotation, 4, Elastic.easeOut);
  83.             tweensyGroup.alphaTo(_arrow, 0.5 + Math.random() * 0.5, 1, Linear.easeNone, 3);
  84.  
  85.             tweensyGroup.onUpdate = onTweensyGroupUpdate;
  86.             tweensyGroup.onComplete = onTweensyGroupComplete;
  87.         }
  88.  
  89.         private function onTweensyGroupUpdate():void{
  90.             var text:String = '';
  91.  
  92.             text += '_arrow.x = ' + _arrow.x + '\n';
  93.             text += '_arrow.y = ' + _arrow.y + '\n';
  94.             text += '_arrow.scaleX = ' + _arrow.scaleX + '\n';
  95.             text += '_arrow.scaleY = ' + _arrow.scaleY + '\n';
  96.             text += '_arrow.rotation = ' + _arrow.rotation + '\n';
  97.             text += '_arrow.alpha = ' + _arrow.alpha;
  98.  
  99.             _textField.text = text;
  100.         }
  101.  
  102.         private function onTweensyGroupComplete():void{
  103.             startTweensyGroup();
  104.         }
  105.  
  106.  
  107.     }
  108.  
  109. }

]]> http://ferv.jp/blog/2009/05/20/tweensy_11/feed/ 0 TweensyGroup - to http://ferv.jp/blog/2009/05/19/tweensy_10/ http://ferv.jp/blog/2009/05/19/tweensy_10/#comments Mon, 18 May 2009 16:29:32 +0000 dsk http://flabo.org/?p=670 Tweensyで色々なプロパティを動かすんだけど、それらを一括のトゥィーンとして管理したい。そんな時に使うのがTweensyGroupクラス。

下の例では、Spriteを大きくしながら回転させるアニメーションをTweensy.to()とTweensyGroup.to()で動かしてみる。両者とも動きは同じ。Tweensy.to()の場合は、scaleX/scaleYのonUpdate/onCompleteとrotationのonUpdate/onCompleteがそれぞれバラバラにイベント処理される。TweensyGroup.to()の場合はscaleX/scaleY/rotationのonUpdate/onCompleteが一括でイベント処理される。

TestTweensy_10.swf

  • ActionScript
  • TestTweensy_10.as
  • Source
package  {
	import com.flashdynamix.motion.Tweensy;
	import com.flashdynamix.motion.TweensyGroup;
	import com.flashdynamix.motion.TweensyTimeline;
	import fl.motion.easing.Quadratic;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	[SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
	public class TestTweensy_10 extends Sprite {

		private var _boxTweensy:Sprite;
		private var _boxTweensyGroup:Sprite;
		private var _tweensyTimeline0TextField:TextField;
		private var _tweensyTimeline1TextField:TextField;
		private var _tweensyGroupTextField:TextField;

		public function TestTweensy_10() {
			initInstances();
			initTextFields();
			initButton();
		}

		private function initInstances():void{
			_boxTweensy = createBox();
			_boxTweensy.x = 300;
			_boxTweensy.y = 100;
			addChild(_boxTweensy);

			_boxTweensyGroup = createBox();
			_boxTweensyGroup.x = 300;
			_boxTweensyGroup.y = 300;
			addChild(_boxTweensyGroup);
		}

		private function createBox():Sprite {
			var box:Sprite = new Sprite();
			var graphics:Graphics = box.graphics;

			graphics.beginFill(0x0099cc);
			graphics.drawRect(-5, -5, 10, 10);
			graphics.endFill();

			return box;
		}

		private function initTextFields():void {
			_tweensyTimeline0TextField = createTextField();
			_tweensyTimeline0TextField.x = 10;
			_tweensyTimeline0TextField.y = 50;
			addChild(_tweensyTimeline0TextField);

			_tweensyTimeline1TextField = createTextField();
			_tweensyTimeline1TextField.x = 10;
			_tweensyTimeline1TextField.y = 100;
			addChild(_tweensyTimeline1TextField);

			_tweensyGroupTextField = createTextField();
			_tweensyGroupTextField.x = 10;
			_tweensyGroupTextField.y = 250;
			addChild(_tweensyGroupTextField);
		}

		private function createTextField():TextField {
			var textField:TextField = new TextField();
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);

			textField.defaultTextFormat = textFormat;
			textField.autoSize = TextFieldAutoSize.LEFT;

			return textField;
		}

		private function initButton():void {
			var button:Button = new Button();
			button.label = 'start';
			button.addEventListener(MouseEvent.CLICK, onButtonClick);
			addChild(button);
		}

		private function onButtonClick(e:MouseEvent):void {
			startTweensy();
			startTweensyGroup();
		}

		private function startTweensy():void {
			_boxTweensy.scaleX = 1;
			_boxTweensy.scaleY = 1;
			_boxTweensy.rotation = 0;
			_tweensyTimeline0TextField.text = '';
			_tweensyTimeline1TextField.text = '';

			var tweensyTimeline0:TweensyTimeline = Tweensy.to(_boxTweensy, { scaleX: 5, scaleY: 5 }, 3, Quadratic.easeOut, 1);
			var tweensyTimeline1:TweensyTimeline = Tweensy.to(_boxTweensy, { rotation: 90 }, 3, Quadratic.easeOut, 2);

			tweensyTimeline0.onUpdate = logTweensyTimeline0;
			tweensyTimeline0.onUpdateParams = ['onUpdate'];
			tweensyTimeline0.onComplete = logTweensyTimeline0;
			tweensyTimeline0.onCompleteParams = ['onComplete'];
			tweensyTimeline1.onUpdate = logTweensyTimeline1;
			tweensyTimeline1.onUpdateParams = ['onUpdate'];
			tweensyTimeline1.onComplete = logTweensyTimeline1;
			tweensyTimeline1.onCompleteParams = ['onComplete'];
		}

		private function startTweensyGroup():void{
			_boxTweensyGroup.scaleX = 1;
			_boxTweensyGroup.scaleY = 1;
			_boxTweensyGroup.rotation = 0;
			_tweensyGroupTextField.text = '';

			var tweensyGroup:TweensyGroup = new TweensyGroup();

			tweensyGroup.to(_boxTweensyGroup, { scaleX: 5, scaleY: 5 }, 3, Quadratic.easeOut, 1);
			tweensyGroup.to(_boxTweensyGroup, { rotation: 90 }, 3, Quadratic.easeOut, 2);

			tweensyGroup.onUpdate = logTweensyGroup;
			tweensyGroup.onUpdateParams = ['onUpdate'];
			tweensyGroup.onComplete = logTweensyGroup;
			tweensyGroup.onCompleteParams = ['onComplete'];
		}

		private function logTweensyTimeline0(text:String):void {
			text += '\n';
			text += 'scaleX = ' + _boxTweensy.scaleX.toString() + '\n';
			text += 'scaleY = ' + _boxTweensy.scaleY.toString();

			_tweensyTimeline0TextField.text = text;
		}

		private function logTweensyTimeline1(text:String):void{
			text += '\n';
			text += 'rotation = ' + _boxTweensy.rotation.toString();

			_tweensyTimeline1TextField.text = text;
		}

		private function logTweensyGroup(text:String):void {
			text += '\n';
			text += 'scaleX = ' + _boxTweensyGroup.scaleX.toString() + '\n';
			text += 'scaleY = ' + _boxTweensyGroup.scaleY.toString() + '\n';
			text += 'rotation = ' + _boxTweensyGroup.rotation.toString();

			_tweensyGroupTextField.text = text;
		}


	}

}


import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.BevelFilter;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;

internal class Button extends Sprite {

	private var _textField:TextField;

	public function get label():String { return _textField.text; }
	public function set label(value:String):void {
		_textField.text = value;
		updateFill();
	}

	public function Button() {
		_textField = new TextField();
		_textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
		_textField.autoSize = TextFieldAutoSize.LEFT;
		_textField.x = 8;
		_textField.y = 4;
		addChild(_textField);

		filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
		buttonMode = true;
		mouseChildren = false;
		addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
		addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
	}

	private function onButtonMouseUp(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
	}

	private function onButtonMouseDown(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
	}

	private function updateFill():void {
		graphics.clear();
		graphics.beginFill(0xCCCCCC);
		graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
		graphics.endFill();
	}

}
  1. package  {
  2.     import com.flashdynamix.motion.Tweensy;
  3.     import com.flashdynamix.motion.TweensyGroup;
  4.     import com.flashdynamix.motion.TweensyTimeline;
  5.     import fl.motion.easing.Quadratic;
  6.     import flash.display.Graphics;
  7.     import flash.display.Sprite;
  8.     import flash.events.MouseEvent;
  9.     import flash.text.TextField;
  10.     import flash.text.TextFieldAutoSize;
  11.     import flash.text.TextFormat;
  12.  
  13.     [SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
  14.     public class TestTweensy_10 extends Sprite {
  15.  
  16.         private var _boxTweensy:Sprite;
  17.         private var _boxTweensyGroup:Sprite;
  18.         private var _tweensyTimeline0TextField:TextField;
  19.         private var _tweensyTimeline1TextField:TextField;
  20.         private var _tweensyGroupTextField:TextField;
  21.  
  22.         public function TestTweensy_10() {
  23.             initInstances();
  24.             initTextFields();
  25.             initButton();
  26.         }
  27.  
  28.         private function initInstances():void{
  29.             _boxTweensy = createBox();
  30.             _boxTweensy.x = 300;
  31.             _boxTweensy.y = 100;
  32.             addChild(_boxTweensy);
  33.  
  34.             _boxTweensyGroup = createBox();
  35.             _boxTweensyGroup.x = 300;
  36.             _boxTweensyGroup.y = 300;
  37.             addChild(_boxTweensyGroup);
  38.         }
  39.  
  40.         private function createBox():Sprite {
  41.             var box:Sprite = new Sprite();
  42.             var graphics:Graphics = box.graphics;
  43.  
  44.             graphics.beginFill(0x0099cc);
  45.             graphics.drawRect(-5, -5, 10, 10);
  46.             graphics.endFill();
  47.  
  48.             return box;
  49.         }
  50.  
  51.         private function initTextFields():void {
  52.             _tweensyTimeline0TextField = createTextField();
  53.             _tweensyTimeline0TextField.x = 10;
  54.             _tweensyTimeline0TextField.y = 50;
  55.             addChild(_tweensyTimeline0TextField);
  56.  
  57.             _tweensyTimeline1TextField = createTextField();
  58.             _tweensyTimeline1TextField.x = 10;
  59.             _tweensyTimeline1TextField.y = 100;
  60.             addChild(_tweensyTimeline1TextField);
  61.  
  62.             _tweensyGroupTextField = createTextField();
  63.             _tweensyGroupTextField.x = 10;
  64.             _tweensyGroupTextField.y = 250;
  65.             addChild(_tweensyGroupTextField);
  66.         }
  67.  
  68.         private function createTextField():TextField {
  69.             var textField:TextField = new TextField();
  70.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  71.  
  72.             textField.defaultTextFormat = textFormat;
  73.             textField.autoSize = TextFieldAutoSize.LEFT;
  74.  
  75.             return textField;
  76.         }
  77.  
  78.         private function initButton():void {
  79.             var button:Button = new Button();
  80.             button.label = 'start';
  81.             button.addEventListener(MouseEvent.CLICK, onButtonClick);
  82.             addChild(button);
  83.         }
  84.  
  85.         private function onButtonClick(e:MouseEvent):void {
  86.             startTweensy();
  87.             startTweensyGroup();
  88.         }
  89.  
  90.         private function startTweensy():void {
  91.             _boxTweensy.scaleX = 1;
  92.             _boxTweensy.scaleY = 1;
  93.             _boxTweensy.rotation = 0;
  94.             _tweensyTimeline0TextField.text = '';
  95.             _tweensyTimeline1TextField.text = '';
  96.  
  97.             var tweensyTimeline0:TweensyTimeline = Tweensy.to(_boxTweensy, { scaleX: 5, scaleY: 5 }, 3, Quadratic.easeOut, 1);
  98.             var tweensyTimeline1:TweensyTimeline = Tweensy.to(_boxTweensy, { rotation: 90 }, 3, Quadratic.easeOut, 2);
  99.  
  100.             tweensyTimeline0.onUpdate = logTweensyTimeline0;
  101.             tweensyTimeline0.onUpdateParams = ['onUpdate'];
  102.             tweensyTimeline0.onComplete = logTweensyTimeline0;
  103.             tweensyTimeline0.onCompleteParams = ['onComplete'];
  104.             tweensyTimeline1.onUpdate = logTweensyTimeline1;
  105.             tweensyTimeline1.onUpdateParams = ['onUpdate'];
  106.             tweensyTimeline1.onComplete = logTweensyTimeline1;
  107.             tweensyTimeline1.onCompleteParams = ['onComplete'];
  108.         }
  109.  
  110.         private function startTweensyGroup():void{
  111.             _boxTweensyGroup.scaleX = 1;
  112.             _boxTweensyGroup.scaleY = 1;
  113.             _boxTweensyGroup.rotation = 0;
  114.             _tweensyGroupTextField.text = '';
  115.  
  116.             var tweensyGroup:TweensyGroup = new TweensyGroup();
  117.  
  118.             tweensyGroup.to(_boxTweensyGroup, { scaleX: 5, scaleY: 5 }, 3, Quadratic.easeOut, 1);
  119.             tweensyGroup.to(_boxTweensyGroup, { rotation: 90 }, 3, Quadratic.easeOut, 2);
  120.  
  121.             tweensyGroup.onUpdate = logTweensyGroup;
  122.             tweensyGroup.onUpdateParams = ['onUpdate'];
  123.             tweensyGroup.onComplete = logTweensyGroup;
  124.             tweensyGroup.onCompleteParams = ['onComplete'];
  125.         }
  126.  
  127.         private function logTweensyTimeline0(text:String):void {
  128.             text += '\n';
  129.             text += 'scaleX = ' + _boxTweensy.scaleX.toString() + '\n';
  130.             text += 'scaleY = ' + _boxTweensy.scaleY.toString();
  131.  
  132.             _tweensyTimeline0TextField.text = text;
  133.         }
  134.  
  135.         private function logTweensyTimeline1(text:String):void{
  136.             text += '\n';
  137.             text += 'rotation = ' + _boxTweensy.rotation.toString();
  138.  
  139.             _tweensyTimeline1TextField.text = text;
  140.         }
  141.  
  142.         private function logTweensyGroup(text:String):void {
  143.             text += '\n';
  144.             text += 'scaleX = ' + _boxTweensyGroup.scaleX.toString() + '\n';
  145.             text += 'scaleY = ' + _boxTweensyGroup.scaleY.toString() + '\n';
  146.             text += 'rotation = ' + _boxTweensyGroup.rotation.toString();
  147.  
  148.             _tweensyGroupTextField.text = text;
  149.         }
  150.  
  151.  
  152.     }
  153.  
  154. }
  155.  
  156.  
  157. import flash.display.Graphics;
  158. import flash.display.Sprite;
  159. import flash.events.MouseEvent;
  160. import flash.filters.BevelFilter;
  161. import flash.text.TextField;
  162. import flash.text.TextFieldAutoSize;
  163. import flash.text.TextFormat;
  164.  
  165. internal class Button extends Sprite {
  166.  
  167.     private var _textField:TextField;
  168.  
  169.     public function get label():String { return _textField.text; }
  170.     public function set label(value:String):void {
  171.         _textField.text = value;
  172.         updateFill();
  173.     }
  174.  
  175.     public function Button() {
  176.         _textField = new TextField();
  177.         _textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
  178.         _textField.autoSize = TextFieldAutoSize.LEFT;
  179.         _textField.x = 8;
  180.         _textField.y = 4;
  181.         addChild(_textField);
  182.  
  183.         filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  184.         buttonMode = true;
  185.         mouseChildren = false;
  186.         addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
  187.         addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
  188.     }
  189.  
  190.     private function onButtonMouseUp(e:MouseEvent):void {
  191.         var button:Sprite = e.currentTarget as Sprite;
  192.  
  193.         button.filters = null;
  194.         button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  195.     }
  196.  
  197.     private function onButtonMouseDown(e:MouseEvent):void {
  198.         var button:Sprite = e.currentTarget as Sprite;
  199.  
  200.         button.filters = null;
  201.         button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
  202.     }
  203.  
  204.     private function updateFill():void {
  205.         graphics.clear();
  206.         graphics.beginFill(0xCCCCCC);
  207.         graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
  208.         graphics.endFill();
  209.     }
  210.  
  211. }

]]> http://ferv.jp/blog/2009/05/19/tweensy_10/feed/ 0 Tweensy - sound http://ferv.jp/blog/2009/05/18/tweensy_9/ http://ferv.jp/blog/2009/05/18/tweensy_9/#comments Mon, 18 May 2009 06:31:49 +0000 dsk http://flabo.org/?p=665 TweensyでSoundTransformのプロパティをアニメーションしてみる。SoundTransformオブジェクトを作ってそのSoundTransformオブジェクトのプロパティをTweensyでTweenするイメージ。で、updateパラメータにそのSoundTransformを適用するSoundChannelインスタンスを指定する。

mp3ファイルはFLASH KITからFreewareを選んで拝借。

TestTweensy_9.swf（音が出ます。）

  • ActionScript
  • TestTweensy_9.as
  • Source
package  {
	import com.flashdynamix.motion.Tweensy;
	import com.flashdynamix.motion.TweensyTimeline;
	import fl.motion.easing.Linear;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.media.Sound;
	import flash.media.SoundChannel;
	import flash.media.SoundTransform;
	import flash.net.URLRequest;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	[SWF(backgroundColor = 0x000000, width = 600, height = 100, frameRate = 30)]
	public class TestTweensy_9 extends Sprite {

		private var _sound:Sound;
		private var _soundChannel:SoundChannel;
		private var _textField:TextField;

		public function TestTweensy_9() {
			initSound();
			initTextField();
			initButtons();
		}

		private function initSound():void{
			var urlRequest:URLRequest = new URLRequest('*.mp3');    // パスは省略

			_sound = new Sound();
			_sound.load(urlRequest);

			_soundChannel = _sound.play();
			_soundChannel.addEventListener(Event.SOUND_COMPLETE, onSoundComplete);
		}

		private function onSoundComplete(e:Event):void {
			_soundChannel.removeEventListener(Event.SOUND_COMPLETE, onSoundComplete);
			_soundChannel = null;

			_soundChannel = _sound.play();
			_soundChannel.addEventListener(Event.SOUND_COMPLETE, onSoundComplete);
		}

		private function initTextField():void {
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);

			_textField = new TextField();
			_textField.defaultTextFormat = textFormat;
			_textField.autoSize = TextFieldAutoSize.LEFT;
			_textField.y = 50;

			addChild(_textField);
		}

		private function initButtons():void {
			var labels:Array = ['VolumeOn', 'VolumeOff', 'PanLeft', 'PanRight'];
			var clickHandlers:Array = [onVolumeOnClick, onVolumeOffClick, onPanLeftClick, onPanRightClick];

			var i:int, button:Button, x:Number;
			for (i = 0; i < 4; i ++) {
				x = (button == null)? 0: button.x + button.width;
				button = new Button();
				button.label = labels[i];
				button.x = x;
				button.addEventListener(MouseEvent.CLICK, clickHandlers[i]);
				addChild(button);
			}
		}

		private function onVolumeOnClick(e:MouseEvent):void {
			var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { volume: 1 }, 3, Linear.easeNone, 0, _soundChannel);
			timeline.onUpdate = onSoundTransformUpdate;
		}

		private function onVolumeOffClick(e:MouseEvent):void {
			var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { volume: 0 }, 3, Linear.easeNone, 0, _soundChannel);
			timeline.onUpdate = onSoundTransformUpdate;
		}

		private function onPanLeftClick(e:MouseEvent):void {
			var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { pan: -1 }, 3, Linear.easeNone, 0, _soundChannel);
			timeline.onUpdate = onSoundTransformUpdate;
		}

		private function onPanRightClick(e:MouseEvent):void {
			var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { pan: 1 }, 3, Linear.easeNone, 0, _soundChannel);
			timeline.onUpdate = onSoundTransformUpdate;
		}

		private function onSoundTransformUpdate():void{
			var soundTransform:SoundTransform = _soundChannel.soundTransform;
			var text:String = '';

			text += '_soundChannel.soundTransform.volume = ' + _soundChannel.soundTransform.volume.toString() + '\n';
			text += '_soundChannel.soundTransform.pan = ' + _soundChannel.soundTransform.pan.toString();

			_textField.text = text;
		}


	}

}


import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.BevelFilter;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;

internal class Button extends Sprite {

	private var _textField:TextField;

	public function get label():String { return _textField.text; }
	public function set label(value:String):void {
		_textField.text = value;
		updateFill();
	}

	public function Button() {
		_textField = new TextField();
		_textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
		_textField.autoSize = TextFieldAutoSize.LEFT;
		_textField.x = 8;
		_textField.y = 4;
		addChild(_textField);

		filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
		buttonMode = true;
		mouseChildren = false;
		addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
		addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
	}

	private function onButtonMouseUp(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
	}

	private function onButtonMouseDown(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
	}

	private function updateFill():void {
		graphics.clear();
		graphics.beginFill(0xCCCCCC);
		graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
		graphics.endFill();
	}

}
  1. package  {
  2.     import com.flashdynamix.motion.Tweensy;
  3.     import com.flashdynamix.motion.TweensyTimeline;
  4.     import fl.motion.easing.Linear;
  5.     import flash.display.Sprite;
  6.     import flash.events.Event;
  7.     import flash.events.MouseEvent;
  8.     import flash.media.Sound;
  9.     import flash.media.SoundChannel;
  10.     import flash.media.SoundTransform;
  11.     import flash.net.URLRequest;
  12.     import flash.text.TextField;
  13.     import flash.text.TextFieldAutoSize;
  14.     import flash.text.TextFormat;
  15.  
  16.     [SWF(backgroundColor = 0x000000, width = 600, height = 100, frameRate = 30)]
  17.     public class TestTweensy_9 extends Sprite {
  18.  
  19.         private var _sound:Sound;
  20.         private var _soundChannel:SoundChannel;
  21.         private var _textField:TextField;
  22.  
  23.         public function TestTweensy_9() {
  24.             initSound();
  25.             initTextField();
  26.             initButtons();
  27.         }
  28.  
  29.         private function initSound():void{
  30.             var urlRequest:URLRequest = new URLRequest('*.mp3');    // パスは省略
  31.  
  32.             _sound = new Sound();
  33.             _sound.load(urlRequest);
  34.  
  35.             _soundChannel = _sound.play();
  36.             _soundChannel.addEventListener(Event.SOUND_COMPLETE, onSoundComplete);
  37.         }
  38.  
  39.         private function onSoundComplete(e:Event):void {
  40.             _soundChannel.removeEventListener(Event.SOUND_COMPLETE, onSoundComplete);
  41.             _soundChannel = null;
  42.  
  43.             _soundChannel = _sound.play();
  44.             _soundChannel.addEventListener(Event.SOUND_COMPLETE, onSoundComplete);
  45.         }
  46.  
  47.         private function initTextField():void {
  48.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  49.  
  50.             _textField = new TextField();
  51.             _textField.defaultTextFormat = textFormat;
  52.             _textField.autoSize = TextFieldAutoSize.LEFT;
  53.             _textField.y = 50;
  54.  
  55.             addChild(_textField);
  56.         }
  57.  
  58.         private function initButtons():void {
  59.             var labels:Array = ['VolumeOn', 'VolumeOff', 'PanLeft', 'PanRight'];
  60.             var clickHandlers:Array = [onVolumeOnClick, onVolumeOffClick, onPanLeftClick, onPanRightClick];
  61.  
  62.             var i:int, button:Button, x:Number;
  63.             for (i = 0; i < 4; i ++) {
  64.                 x = (button == null)? 0: button.x + button.width;
  65.                 button = new Button();
  66.                 button.label = labels[i];
  67.                 button.x = x;
  68.                 button.addEventListener(MouseEvent.CLICK, clickHandlers[i]);
  69.                 addChild(button);
  70.             }
  71.         }
  72.  
  73.         private function onVolumeOnClick(e:MouseEvent):void {
  74.             var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { volume: 1 }, 3, Linear.easeNone, 0, _soundChannel);
  75.             timeline.onUpdate = onSoundTransformUpdate;
  76.         }
  77.  
  78.         private function onVolumeOffClick(e:MouseEvent):void {
  79.             var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { volume: 0 }, 3, Linear.easeNone, 0, _soundChannel);
  80.             timeline.onUpdate = onSoundTransformUpdate;
  81.         }
  82.  
  83.         private function onPanLeftClick(e:MouseEvent):void {
  84.             var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { pan: -1 }, 3, Linear.easeNone, 0, _soundChannel);
  85.             timeline.onUpdate = onSoundTransformUpdate;
  86.         }
  87.  
  88.         private function onPanRightClick(e:MouseEvent):void {
  89.             var timeline:TweensyTimeline = Tweensy.to(_soundChannel.soundTransform, { pan: 1 }, 3, Linear.easeNone, 0, _soundChannel);
  90.             timeline.onUpdate = onSoundTransformUpdate;
  91.         }
  92.  
  93.         private function onSoundTransformUpdate():void{
  94.             var soundTransform:SoundTransform = _soundChannel.soundTransform;
  95.             var text:String = '';
  96.  
  97.             text += '_soundChannel.soundTransform.volume = ' + _soundChannel.soundTransform.volume.toString() + '\n';
  98.             text += '_soundChannel.soundTransform.pan = ' + _soundChannel.soundTransform.pan.toString();
  99.  
  100.             _textField.text = text;
  101.         }
  102.  
  103.  
  104.     }
  105.  
  106. }
  107.  
  108.  
  109. import flash.display.Graphics;
  110. import flash.display.Sprite;
  111. import flash.events.MouseEvent;
  112. import flash.filters.BevelFilter;
  113. import flash.text.TextField;
  114. import flash.text.TextFieldAutoSize;
  115. import flash.text.TextFormat;
  116.  
  117. internal class Button extends Sprite {
  118.  
  119.     private var _textField:TextField;
  120.  
  121.     public function get label():String { return _textField.text; }
  122.     public function set label(value:String):void {
  123.         _textField.text = value;
  124.         updateFill();
  125.     }
  126.  
  127.     public function Button() {
  128.         _textField = new TextField();
  129.         _textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
  130.         _textField.autoSize = TextFieldAutoSize.LEFT;
  131.         _textField.x = 8;
  132.         _textField.y = 4;
  133.         addChild(_textField);
  134.  
  135.         filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  136.         buttonMode = true;
  137.         mouseChildren = false;
  138.         addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
  139.         addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
  140.     }
  141.  
  142.     private function onButtonMouseUp(e:MouseEvent):void {
  143.         var button:Sprite = e.currentTarget as Sprite;
  144.  
  145.         button.filters = null;
  146.         button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  147.     }
  148.  
  149.     private function onButtonMouseDown(e:MouseEvent):void {
  150.         var button:Sprite = e.currentTarget as Sprite;
  151.  
  152.         button.filters = null;
  153.         button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
  154.     }
  155.  
  156.     private function updateFill():void {
  157.         graphics.clear();
  158.         graphics.beginFill(0xCCCCCC);
  159.         graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
  160.         graphics.endFill();
  161.     }
  162.  
  163. }

]]> http://ferv.jp/blog/2009/05/18/tweensy_9/feed/ 0 Tweensy - filter http://ferv.jp/blog/2009/05/16/tweensy_8/ http://ferv.jp/blog/2009/05/16/tweensy_8/#comments Fri, 15 May 2009 16:26:11 +0000 dsk http://flabo.org/?p=617 tweensy_8

TweensyでFilterのプロパティをアニメーションしてみる。Filterオブジェクトを作ってそのFilterオブジェクトのプロパティをTweensyでTweenするイメージ。で、updateパラメータにそのFilterを適用するインスタンスを指定する。

  • ActionScript
  • TestTweensy_8.as
  • Source
package  {
	import com.flashdynamix.motion.extras.ColorMatrix;
	import com.flashdynamix.motion.Tweensy;
	import fl.motion.easing.Linear;
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.display.BitmapDataChannel;
	import flash.display.GradientType;
	import flash.display.Graphics;
	import flash.display.Shape;
	import flash.display.SpreadMethod;
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import flash.filters.BevelFilter;
	import flash.filters.BlurFilter;
	import flash.filters.ColorMatrixFilter;
	import flash.filters.ConvolutionFilter;
	import flash.filters.DisplacementMapFilter;
	import flash.filters.DisplacementMapFilterMode;
	import flash.filters.DropShadowFilter;
	import flash.filters.GlowFilter;
	import flash.filters.GradientBevelFilter;
	import flash.filters.GradientGlowFilter;
	import flash.geom.Matrix;
	import flash.geom.Point;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	[SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
	public class TestTweensy_8 extends Sprite {

		[Embed (source="fl_64.png")]
		private var SampleImage:Class;

		private var _bitmaps:Array;

		public function TestTweensy_8() {
			initInstances();
			initButton();
		}

		private function initInstances():void {
			_bitmaps = [];

			var texts:Array = [
				'BevelFilter', 'BlurFilter', 'ColorMatrixFilter',
				'ConvolutionFilter', 'DisplacementMapFilter', 'DropShadowFilter',
				'GlowFilter', 'GradientBevelFilter', 'GradientGlowFilter'
			];
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
			var i:int, bitmap:Bitmap, textField:TextField;
			for (i = 0; i < 9; i ++) {
				bitmap = new SampleImage();
				bitmap.x = 100 + 200 * Math.floor(i / 3);
				bitmap.y = 60 + (bitmap.height + 50) * (i % 3);
				addChild(bitmap);
				_bitmaps[i] = bitmap;

				textField = new TextField();
				textField.defaultTextFormat = textFormat;
				textField.autoSize = TextFieldAutoSize.RIGHT;
				textField.x = bitmap.x - textField.width;
				textField.y = bitmap.y;
				textField.text = texts[i];
				addChild(textField);
			}
		}

		private function initButton():void {
			var button:Button = new Button();

			button.label = 'Tweensy.to()';
			button.addEventListener(MouseEvent.CLICK, onButtonClick);

			addChild(button);
		}

		private function onButtonClick(e:MouseEvent):void {
			startTweensy();
		}

		private function startTweensy():void {
			startBevelFilter(_bitmaps[0]);
			startBlurFilter(_bitmaps[1]);
			startColorMatrixFilter(_bitmaps[2]);
			startConvolutionFilter(_bitmaps[3]);
			startDisplacementMapFilter(_bitmaps[4]);
			startDropShadowFilter(_bitmaps[5]);
			startGlowFilter(_bitmaps[6]);
			startGradientBevelFilter(_bitmaps[7]);
			startGradientGlowFilter(_bitmaps[8]);
		}

		private function startBevelFilter(bitmap:Bitmap):void {
			bitmap.filters = null;

			var bevelFilter:BevelFilter = new BevelFilter(5, 45, 0xbf1424, 1, 0x500710, 1, 10, 10);
			Tweensy.to(bevelFilter, { angle: 225 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startBlurFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var blurFilter:BlurFilter = new BlurFilter(0, 0, 1);
			Tweensy.to(blurFilter, { blurX: 10, blurY: 10 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startColorMatrixFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var colorMatrix:ColorMatrix = new ColorMatrix(0, 1);
			var colorMatrixFilter:ColorMatrixFilter = new ColorMatrixFilter(colorMatrix);
			Tweensy.to(colorMatrixFilter, new ColorMatrix(0, 0), 3, Linear.easeNone, 1, bitmap);
		}

		private function startConvolutionFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var convolutionFilter:ConvolutionFilter = new ConvolutionFilter(3, 3, [1, 1, 1, 1, -8, 1, 1, 1, 1], 0.30);
			Tweensy.to(convolutionFilter, { divisor: 0.01 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startDisplacementMapFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var shape:Shape = new Shape();
			var graphics:Graphics = shape.graphics;
			var matrix:Matrix = new Matrix();
			matrix.createGradientBox(32, 0, 0, 0, 0);
			graphics.beginGradientFill(GradientType.LINEAR, [0x000000, 0xff0000], [1, 1], [0, 255], matrix, SpreadMethod.REFLECT);
			graphics.drawRect(0, 0, 64, 64);
			graphics.endFill();
			var bitmapData:BitmapData = new BitmapData(64, 64);
			bitmapData.draw(shape);

			var displacementMapFilter:DisplacementMapFilter = new DisplacementMapFilter(bitmapData, new Point(), 0, BitmapDataChannel.RED, 0, 0, DisplacementMapFilterMode.CLAMP);
			Tweensy.to(displacementMapFilter, { scaleY: 30 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startDropShadowFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var dropShadowFilter:DropShadowFilter = new DropShadowFilter(4, 45, 0x666666);
			Tweensy.to(dropShadowFilter, { angle:225 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startGlowFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var glowFilter:GlowFilter = new GlowFilter(0xbf1424, 1, 0, 0, 3);
			Tweensy.to(glowFilter, { blurX: 10, blurY: 10 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startGradientBevelFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var gradientBevelFilter:GradientBevelFilter = new GradientBevelFilter(4, 45, [0xbf1424, 0x500710, 0x000000], [1, 0, 1], [0, 128, 255], 10, 10);
			Tweensy.to(gradientBevelFilter, { angle: 225 }, 3, Linear.easeNone, 1, bitmap);
		}

		private function startGradientGlowFilter(bitmap:Bitmap):void{
			bitmap.filters = null;

			var gradientGlowFilter:GradientGlowFilter = new GradientGlowFilter(0, 0, [0xbf1424, 0x500710, 0xbf1424], [0, 1, 0], [0, 128, 255], 0, 0);
			Tweensy.to(gradientGlowFilter, { blurX: 10, blurY: 10 }, 3, Linear.easeNone, 1, bitmap);
		}


	}

}


import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.BevelFilter;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;

internal class Button extends Sprite {

	private var _textField:TextField;

	public function get label():String { return _textField.text; }
	public function set label(value:String):void {
		_textField.text = value;
		updateFill();
	}

	public function Button() {
		_textField = new TextField();
		_textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
		_textField.autoSize = TextFieldAutoSize.LEFT;
		_textField.x = 8;
		_textField.y = 4;
		addChild(_textField);

		filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
		buttonMode = true;
		mouseChildren = false;
		addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
		addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
	}

	private function onButtonMouseUp(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
	}

	private function onButtonMouseDown(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
	}

	private function updateFill():void {
		graphics.clear();
		graphics.beginFill(0xCCCCCC);
		graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
		graphics.endFill();
	}

}
  1. package  {
  2.     import com.flashdynamix.motion.extras.ColorMatrix;
  3.     import com.flashdynamix.motion.Tweensy;
  4.     import fl.motion.easing.Linear;
  5.     import flash.display.Bitmap;
  6.     import flash.display.BitmapData;
  7.     import flash.display.BitmapDataChannel;
  8.     import flash.display.GradientType;
  9.     import flash.display.Graphics;
  10.     import flash.display.Shape;
  11.     import flash.display.SpreadMethod;
  12.     import flash.display.Sprite;
  13.     import flash.events.MouseEvent;
  14.     import flash.filters.BevelFilter;
  15.     import flash.filters.BlurFilter;
  16.     import flash.filters.ColorMatrixFilter;
  17.     import flash.filters.ConvolutionFilter;
  18.     import flash.filters.DisplacementMapFilter;
  19.     import flash.filters.DisplacementMapFilterMode;
  20.     import flash.filters.DropShadowFilter;
  21.     import flash.filters.GlowFilter;
  22.     import flash.filters.GradientBevelFilter;
  23.     import flash.filters.GradientGlowFilter;
  24.     import flash.geom.Matrix;
  25.     import flash.geom.Point;
  26.     import flash.text.TextField;
  27.     import flash.text.TextFieldAutoSize;
  28.     import flash.text.TextFormat;
  29.  
  30.     [SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
  31.     public class TestTweensy_8 extends Sprite {
  32.  
  33.         [Embed (source="fl_64.png")]
  34.         private var SampleImage:Class;
  35.  
  36.         private var _bitmaps:Array;
  37.  
  38.         public function TestTweensy_8() {
  39.             initInstances();
  40.             initButton();
  41.         }
  42.  
  43.         private function initInstances():void {
  44.             _bitmaps = [];
  45.  
  46.             var texts:Array = [
  47.                 'BevelFilter', 'BlurFilter', 'ColorMatrixFilter',
  48.                 'ConvolutionFilter', 'DisplacementMapFilter', 'DropShadowFilter',
  49.                 'GlowFilter', 'GradientBevelFilter', 'GradientGlowFilter'
  50.             ];
  51.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  52.             var i:int, bitmap:Bitmap, textField:TextField;
  53.             for (i = 0; i < 9; i ++) {
  54.                 bitmap = new SampleImage();
  55.                 bitmap.x = 100 + 200 * Math.floor(i / 3);
  56.                 bitmap.y = 60 + (bitmap.height + 50) * (i % 3);
  57.                 addChild(bitmap);
  58.                 _bitmaps[i] = bitmap;
  59.  
  60.                 textField = new TextField();
  61.                 textField.defaultTextFormat = textFormat;
  62.                 textField.autoSize = TextFieldAutoSize.RIGHT;
  63.                 textField.x = bitmap.x - textField.width;
  64.                 textField.y = bitmap.y;
  65.                 textField.text = texts[i];
  66.                 addChild(textField);
  67.             }
  68.         }
  69.  
  70.         private function initButton():void {
  71.             var button:Button = new Button();
  72.  
  73.             button.label = 'Tweensy.to()';
  74.             button.addEventListener(MouseEvent.CLICK, onButtonClick);
  75.  
  76.             addChild(button);
  77.         }
  78.  
  79.         private function onButtonClick(e:MouseEvent):void {
  80.             startTweensy();
  81.         }
  82.  
  83.         private function startTweensy():void {
  84.             startBevelFilter(_bitmaps[0]);
  85.             startBlurFilter(_bitmaps[1]);
  86.             startColorMatrixFilter(_bitmaps[2]);
  87.             startConvolutionFilter(_bitmaps[3]);
  88.             startDisplacementMapFilter(_bitmaps[4]);
  89.             startDropShadowFilter(_bitmaps[5]);
  90.             startGlowFilter(_bitmaps[6]);
  91.             startGradientBevelFilter(_bitmaps[7]);
  92.             startGradientGlowFilter(_bitmaps[8]);
  93.         }
  94.  
  95.         private function startBevelFilter(bitmap:Bitmap):void {
  96.             bitmap.filters = null;
  97.  
  98.             var bevelFilter:BevelFilter = new BevelFilter(5, 45, 0xbf1424, 1, 0x500710, 1, 10, 10);
  99.             Tweensy.to(bevelFilter, { angle: 225 }, 3, Linear.easeNone, 1, bitmap);
  100.         }
  101.  
  102.         private function startBlurFilter(bitmap:Bitmap):void{
  103.             bitmap.filters = null;
  104.  
  105.             var blurFilter:BlurFilter = new BlurFilter(0, 0, 1);
  106.             Tweensy.to(blurFilter, { blurX: 10, blurY: 10 }, 3, Linear.easeNone, 1, bitmap);
  107.         }
  108.  
  109.         private function startColorMatrixFilter(bitmap:Bitmap):void{
  110.             bitmap.filters = null;
  111.  
  112.             var colorMatrix:ColorMatrix = new ColorMatrix(0, 1);
  113.             var colorMatrixFilter:ColorMatrixFilter = new ColorMatrixFilter(colorMatrix);
  114.             Tweensy.to(colorMatrixFilter, new ColorMatrix(0, 0), 3, Linear.easeNone, 1, bitmap);
  115.         }
  116.  
  117.         private function startConvolutionFilter(bitmap:Bitmap):void{
  118.             bitmap.filters = null;
  119.  
  120.             var convolutionFilter:ConvolutionFilter = new ConvolutionFilter(3, 3, [1, 1, 1, 1, -8, 1, 1, 1, 1], 0.30);
  121.             Tweensy.to(convolutionFilter, { divisor: 0.01 }, 3, Linear.easeNone, 1, bitmap);
  122.         }
  123.  
  124.         private function startDisplacementMapFilter(bitmap:Bitmap):void{
  125.             bitmap.filters = null;
  126.  
  127.             var shape:Shape = new Shape();
  128.             var graphics:Graphics = shape.graphics;
  129.             var matrix:Matrix = new Matrix();
  130.             matrix.createGradientBox(32, 0, 0, 0, 0);
  131.             graphics.beginGradientFill(GradientType.LINEAR, [0x000000, 0xff0000], [1, 1], [0, 255], matrix, SpreadMethod.REFLECT);
  132.             graphics.drawRect(0, 0, 64, 64);
  133.             graphics.endFill();
  134.             var bitmapData:BitmapData = new BitmapData(64, 64);
  135.             bitmapData.draw(shape);
  136.  
  137.             var displacementMapFilter:DisplacementMapFilter = new DisplacementMapFilter(bitmapData, new Point(), 0, BitmapDataChannel.RED, 0, 0, DisplacementMapFilterMode.CLAMP);
  138.             Tweensy.to(displacementMapFilter, { scaleY: 30 }, 3, Linear.easeNone, 1, bitmap);
  139.         }
  140.  
  141.         private function startDropShadowFilter(bitmap:Bitmap):void{
  142.             bitmap.filters = null;
  143.  
  144.             var dropShadowFilter:DropShadowFilter = new DropShadowFilter(4, 45, 0x666666);
  145.             Tweensy.to(dropShadowFilter, { angle:225 }, 3, Linear.easeNone, 1, bitmap);
  146.         }
  147.  
  148.         private function startGlowFilter(bitmap:Bitmap):void{
  149.             bitmap.filters = null;
  150.  
  151.             var glowFilter:GlowFilter = new GlowFilter(0xbf1424, 1, 0, 0, 3);
  152.             Tweensy.to(glowFilter, { blurX: 10, blurY: 10 }, 3, Linear.easeNone, 1, bitmap);
  153.         }
  154.  
  155.         private function startGradientBevelFilter(bitmap:Bitmap):void{
  156.             bitmap.filters = null;
  157.  
  158.             var gradientBevelFilter:GradientBevelFilter = new GradientBevelFilter(4, 45, [0xbf1424, 0x500710, 0x000000], [1, 0, 1], [0, 128, 255], 10, 10);
  159.             Tweensy.to(gradientBevelFilter, { angle: 225 }, 3, Linear.easeNone, 1, bitmap);
  160.         }
  161.  
  162.         private function startGradientGlowFilter(bitmap:Bitmap):void{
  163.             bitmap.filters = null;
  164.  
  165.             var gradientGlowFilter:GradientGlowFilter = new GradientGlowFilter(0, 0, [0xbf1424, 0x500710, 0xbf1424], [0, 1, 0], [0, 128, 255], 0, 0);
  166.             Tweensy.to(gradientGlowFilter, { blurX: 10, blurY: 10 }, 3, Linear.easeNone, 1, bitmap);
  167.         }
  168.  
  169.  
  170.     }
  171.  
  172. }
  173.  
  174.  
  175. import flash.display.Graphics;
  176. import flash.display.Sprite;
  177. import flash.events.MouseEvent;
  178. import flash.filters.BevelFilter;
  179. import flash.text.TextField;
  180. import flash.text.TextFieldAutoSize;
  181. import flash.text.TextFormat;
  182.  
  183. internal class Button extends Sprite {
  184.  
  185.     private var _textField:TextField;
  186.  
  187.     public function get label():String { return _textField.text; }
  188.     public function set label(value:String):void {
  189.         _textField.text = value;
  190.         updateFill();
  191.     }
  192.  
  193.     public function Button() {
  194.         _textField = new TextField();
  195.         _textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
  196.         _textField.autoSize = TextFieldAutoSize.LEFT;
  197.         _textField.x = 8;
  198.         _textField.y = 4;
  199.         addChild(_textField);
  200.  
  201.         filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  202.         buttonMode = true;
  203.         mouseChildren = false;
  204.         addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
  205.         addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
  206.     }
  207.  
  208.     private function onButtonMouseUp(e:MouseEvent):void {
  209.         var button:Sprite = e.currentTarget as Sprite;
  210.  
  211.         button.filters = null;
  212.         button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  213.     }
  214.  
  215.     private function onButtonMouseDown(e:MouseEvent):void {
  216.         var button:Sprite = e.currentTarget as Sprite;
  217.  
  218.         button.filters = null;
  219.         button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
  220.     }
  221.  
  222.     private function updateFill():void {
  223.         graphics.clear();
  224.         graphics.beginFill(0xCCCCCC);
  225.         graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
  226.         graphics.endFill();
  227.     }
  228.  
  229. }

]]> http://ferv.jp/blog/2009/05/16/tweensy_8/feed/ 0 Tweensy - color http://ferv.jp/blog/2009/05/15/tweensy_7/ http://ferv.jp/blog/2009/05/15/tweensy_7/#comments Fri, 15 May 2009 02:57:00 +0000 dsk http://flabo.org/?p=611 tweensy_7

TweensyでColorTransformのプロパティをアニメーションしてみる。ColorTransformオブジェクトを作ってそのColorTransformオブジェクトのプロパティをTweensyでTweenするイメージ。で、updateパラメータにそのColorTransformを適用するインスタンスを指定する。

  • ActionScript
  • TestTweensy_7.as
  • Source
package  {
	import com.flashdynamix.motion.Tweensy;
	import fl.motion.easing.Linear;
	import flash.display.Bitmap;
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import flash.geom.ColorTransform;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	[SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
	public class TestTweensy_7 extends Sprite {

		[Embed (source="fl_64.png")]
		private var SampleImage:Class;

		private var _bitmaps:Array;

		public function TestTweensy_7() {
			initBitmaps();
			initButton();
		}

		private function initBitmaps():void{
			_bitmaps = [];

			var texts:Array = [
				'redMultiplier: 0.5', 'greenMultiplier: 0.5', 'blueMultiplier: 0.5',
				'alphaMultiplier: 0.5', 'redOffset: 100', 'greenOffset: 100',
				'blueOffset: 100', 'alphaOffset: -100', 'color: 0x0099cc'
			];
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
			var i:int, bitmap:Bitmap, textField:TextField;
			for (i = 0; i < texts.length; i ++) {
				bitmap = new SampleImage();
				bitmap.x = 120 + 200 * Math.floor(i / 3);
				bitmap.y = 60 + (bitmap.height + 50) * (i % 3);
				addChild(bitmap);
				_bitmaps[i] = bitmap;

				textField = new TextField();
				textField.defaultTextFormat = textFormat;
				textField.autoSize = TextFieldAutoSize.RIGHT;
				textField.x = bitmap.x - textField.width - 10;
				textField.y = bitmap.y;
				textField.text = texts[i];
				addChild(textField);
			}
		}

		private function initButton():void {
			var button:Button = new Button();

			button.label = 'Tweensy.to()';
			button.addEventListener(MouseEvent.CLICK, onButtonClick);

			addChild(button);
		}

		private function onButtonClick(e:MouseEvent):void {
			Tweensy.to(new ColorTransform(), { redMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[0]);
			Tweensy.to(new ColorTransform(), { greenMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[1]);
			Tweensy.to(new ColorTransform(), { blueMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[2]);
			Tweensy.to(new ColorTransform(), { alphaMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[3]);
			Tweensy.to(new ColorTransform(), { redOffset: 100 }, 3, Linear.easeNone, 1, _bitmaps[4]);
			Tweensy.to(new ColorTransform(), { greenOffset: 100 }, 3, Linear.easeNone, 1, _bitmaps[5]);
			Tweensy.to(new ColorTransform(), { blueOffset: 100 }, 3, Linear.easeNone, 1, _bitmaps[6]);
			Tweensy.to(new ColorTransform(), { alphaOffset: -100 }, 3, Linear.easeNone, 1, _bitmaps[7]);

			// 色を指定してアニメーションする場合
			var colorTransform:ColorTransform = new ColorTransform();
			colorTransform.color = 0x0099cc;
			Tweensy.to(new ColorTransform(), colorTransform, 3, Linear.easeNone, 1, _bitmaps[8]);
		}


	}

}


import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.BevelFilter;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;

internal class Button extends Sprite {

	private var _textField:TextField;

	public function get label():String { return _textField.text; }
	public function set label(value:String):void {
		_textField.text = value;
		updateFill();
	}

	public function Button() {
		_textField = new TextField();
		_textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
		_textField.autoSize = TextFieldAutoSize.LEFT;
		_textField.x = 8;
		_textField.y = 4;
		addChild(_textField);

		filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
		buttonMode = true;
		mouseChildren = false;
		addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
		addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
	}

	private function onButtonMouseUp(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
	}

	private function onButtonMouseDown(e:MouseEvent):void {
		var button:Sprite = e.currentTarget as Sprite;

		button.filters = null;
		button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
	}

	private function updateFill():void {
		graphics.clear();
		graphics.beginFill(0xCCCCCC);
		graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
		graphics.endFill();
	}

}
  1. package  {
  2.     import com.flashdynamix.motion.Tweensy;
  3.     import fl.motion.easing.Linear;
  4.     import flash.display.Bitmap;
  5.     import flash.display.Sprite;
  6.     import flash.events.MouseEvent;
  7.     import flash.geom.ColorTransform;
  8.     import flash.text.TextField;
  9.     import flash.text.TextFieldAutoSize;
  10.     import flash.text.TextFormat;
  11.  
  12.     [SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
  13.     public class TestTweensy_7 extends Sprite {
  14.  
  15.         [Embed (source="fl_64.png")]
  16.         private var SampleImage:Class;
  17.  
  18.         private var _bitmaps:Array;
  19.  
  20.         public function TestTweensy_7() {
  21.             initBitmaps();
  22.             initButton();
  23.         }
  24.  
  25.         private function initBitmaps():void{
  26.             _bitmaps = [];
  27.  
  28.             var texts:Array = [
  29.                 'redMultiplier: 0.5', 'greenMultiplier: 0.5', 'blueMultiplier: 0.5',
  30.                 'alphaMultiplier: 0.5', 'redOffset: 100', 'greenOffset: 100',
  31.                 'blueOffset: 100', 'alphaOffset: -100', 'color: 0x0099cc'
  32.             ];
  33.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  34.             var i:int, bitmap:Bitmap, textField:TextField;
  35.             for (i = 0; i < texts.length; i ++) {
  36.                 bitmap = new SampleImage();
  37.                 bitmap.x = 120 + 200 * Math.floor(i / 3);
  38.                 bitmap.y = 60 + (bitmap.height + 50) * (i % 3);
  39.                 addChild(bitmap);
  40.                 _bitmaps[i] = bitmap;
  41.  
  42.                 textField = new TextField();
  43.                 textField.defaultTextFormat = textFormat;
  44.                 textField.autoSize = TextFieldAutoSize.RIGHT;
  45.                 textField.x = bitmap.x - textField.width - 10;
  46.                 textField.y = bitmap.y;
  47.                 textField.text = texts[i];
  48.                 addChild(textField);
  49.             }
  50.         }
  51.  
  52.         private function initButton():void {
  53.             var button:Button = new Button();
  54.  
  55.             button.label = 'Tweensy.to()';
  56.             button.addEventListener(MouseEvent.CLICK, onButtonClick);
  57.  
  58.             addChild(button);
  59.         }
  60.  
  61.         private function onButtonClick(e:MouseEvent):void {
  62.             Tweensy.to(new ColorTransform(), { redMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[0]);
  63.             Tweensy.to(new ColorTransform(), { greenMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[1]);
  64.             Tweensy.to(new ColorTransform(), { blueMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[2]);
  65.             Tweensy.to(new ColorTransform(), { alphaMultiplier: 0.5 }, 3, Linear.easeNone, 1, _bitmaps[3]);
  66.             Tweensy.to(new ColorTransform(), { redOffset: 100 }, 3, Linear.easeNone, 1, _bitmaps[4]);
  67.             Tweensy.to(new ColorTransform(), { greenOffset: 100 }, 3, Linear.easeNone, 1, _bitmaps[5]);
  68.             Tweensy.to(new ColorTransform(), { blueOffset: 100 }, 3, Linear.easeNone, 1, _bitmaps[6]);
  69.             Tweensy.to(new ColorTransform(), { alphaOffset: -100 }, 3, Linear.easeNone, 1, _bitmaps[7]);
  70.  
  71.             // 色を指定してアニメーションする場合
  72.             var colorTransform:ColorTransform = new ColorTransform();
  73.             colorTransform.color = 0x0099cc;
  74.             Tweensy.to(new ColorTransform(), colorTransform, 3, Linear.easeNone, 1, _bitmaps[8]);
  75.         }
  76.  
  77.  
  78.     }
  79.  
  80. }
  81.  
  82.  
  83. import flash.display.Graphics;
  84. import flash.display.Sprite;
  85. import flash.events.MouseEvent;
  86. import flash.filters.BevelFilter;
  87. import flash.text.TextField;
  88. import flash.text.TextFieldAutoSize;
  89. import flash.text.TextFormat;
  90.  
  91. internal class Button extends Sprite {
  92.  
  93.     private var _textField:TextField;
  94.  
  95.     public function get label():String { return _textField.text; }
  96.     public function set label(value:String):void {
  97.         _textField.text = value;
  98.         updateFill();
  99.     }
  100.  
  101.     public function Button() {
  102.         _textField = new TextField();
  103.         _textField.defaultTextFormat = new TextFormat('_等幅', 10, 0x333333, true);
  104.         _textField.autoSize = TextFieldAutoSize.LEFT;
  105.         _textField.x = 8;
  106.         _textField.y = 4;
  107.         addChild(_textField);
  108.  
  109.         filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  110.         buttonMode = true;
  111.         mouseChildren = false;
  112.         addEventListener(MouseEvent.MOUSE_UP, onButtonMouseUp);
  113.         addEventListener(MouseEvent.MOUSE_DOWN, onButtonMouseDown);
  114.     }
  115.  
  116.     private function onButtonMouseUp(e:MouseEvent):void {
  117.         var button:Sprite = e.currentTarget as Sprite;
  118.  
  119.         button.filters = null;
  120.         button.filters = [new BevelFilter(1, 45, 0xdddddd, 0xbbbbbb)];
  121.     }
  122.  
  123.     private function onButtonMouseDown(e:MouseEvent):void {
  124.         var button:Sprite = e.currentTarget as Sprite;
  125.  
  126.         button.filters = null;
  127.         button.filters = [new BevelFilter(1, 225, 0xdddddd, 0xbbbbbb)];
  128.     }
  129.  
  130.     private function updateFill():void {
  131.         graphics.clear();
  132.         graphics.beginFill(0xCCCCCC);
  133.         graphics.drawRect(0, 0, _textField.textWidth + 20, _textField.textHeight + 14);
  134.         graphics.endFill();
  135.     }
  136.  
  137. }

]]> http://ferv.jp/blog/2009/05/15/tweensy_7/feed/ 0 Tweensy - repeatType http://ferv.jp/blog/2009/05/15/tweensy_6/ http://ferv.jp/blog/2009/05/15/tweensy_6/#comments Thu, 14 May 2009 15:28:33 +0000 dsk http://flabo.org/?p=597 Tweensyはアニメーションをリピートすることができる。この辺からいよいよTweenerにはない独自機能な香り。

TweensyTimelineオブジェクトのrepeatTypeにリピートの種類を設定することができる。項目は

  • TweensyTimeline.NONE - デフォルト値。リピートしない。
  • TweensyTimeline.REPLAY - 終点に到達後、すぐに始点に戻って終点へアニメーションする。
  • TweensyTimeline.YOYO - 終点に到達後、delayを挟んで始点へアニメーションする。
  • TweensyTimeline.LOOP - 終点に到達後、すぐに始点へアニメーションし、その後delayする。
の4種類。TweensyTimeline.NONEはリピートしないので、実質3種類のリピートが用意されている。YOYOとLOOPはdelayするタイミングが折り返し前か後かの差がある。delay入れなかったら両者は同じ挙動をする。

TestTweensy_6.swf

  • ActionScript
  • TestTweensy_6.as
  • Source
package  {
	import com.flashdynamix.motion.Tweensy;
	import com.flashdynamix.motion.TweensyTimeline;
	import fl.motion.easing.Quadratic;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;
	import flash.text.TextFormatAlign;

	[SWF(backgroundColor = 0x000000, width = 600, height = 200, frameRate = 30)]
	public class TestTweensy_6 extends Sprite {

		private var _boxes:Array;

		public function TestTweensy_6() {
			initInstances();

			startTweensy();
		}

		private function initInstances():void {
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
			var graphics:Graphics = graphics;
			graphics.lineStyle(1, 0xffffff, 0.5);

			_boxes = [];
			var strings:Array = [
				'NONE',
				'REPLAY',
				'YOYO',
				'LOOP'
			];
			var i:int, j:int, y:Number, box:Sprite, textField:TextField;
			for (i = 0; i < strings.length; i ++) {
				y = 60 + 15 * i;

				box = createBox();
				box.x = 100;
				box.y = y;
				_boxes[i] = box;

				addChild(box);

				graphics.moveTo(100, y);
				graphics.lineTo(500, y);
				for (j = 0; j < 2; j ++) {
					textFormat.align = (j == 0)? TextFormatAlign.RIGHT: TextFormatAlign.LEFT;
					textField = new TextField();
					textField.defaultTextFormat = textFormat;
					textField.text = strings[i];
					textField.x = (j == 0)? 10: 510;
					textField.y = y - 8;
					textField.width = 80;
					addChild(textField);
				}
			}
		}

		private function createBox():Sprite {
			var box:Sprite = new Sprite();
			var graphics:Graphics = box.graphics;

			graphics.beginFill(0x0099cc);
			graphics.drawRect(-5, -5, 10, 10);
			graphics.endFill();

			return box;
		}

		private function startTweensy():void{
			var repeatTypes:Array = [
				TweensyTimeline.NONE,
				TweensyTimeline.REPLAY,
				TweensyTimeline.YOYO,
				TweensyTimeline.LOOP
			];

			var i:int, box:Sprite, timeline:TweensyTimeline;
			for (i = 0; i < _boxes.length; i ++) {
				box = _boxes[i];
				timeline = Tweensy.to(box, { x: 500 }, 3, Quadratic.easeOut, 1);
				timeline.repeatType = repeatTypes[i];
			}
		}


	}

}
  1. package  {
  2.     import com.flashdynamix.motion.Tweensy;
  3.     import com.flashdynamix.motion.TweensyTimeline;
  4.     import fl.motion.easing.Quadratic;
  5.     import flash.display.Graphics;
  6.     import flash.display.Sprite;
  7.     import flash.text.TextField;
  8.     import flash.text.TextFieldAutoSize;
  9.     import flash.text.TextFormat;
  10.     import flash.text.TextFormatAlign;
  11.  
  12.     [SWF(backgroundColor = 0x000000, width = 600, height = 200, frameRate = 30)]
  13.     public class TestTweensy_6 extends Sprite {
  14.  
  15.         private var _boxes:Array;
  16.  
  17.         public function TestTweensy_6() {
  18.             initInstances();
  19.  
  20.             startTweensy();
  21.         }
  22.  
  23.         private function initInstances():void {
  24.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  25.             var graphics:Graphics = graphics;
  26.             graphics.lineStyle(1, 0xffffff, 0.5);
  27.  
  28.             _boxes = [];
  29.             var strings:Array = [
  30.                 'NONE',
  31.                 'REPLAY',
  32.                 'YOYO',
  33.                 'LOOP'
  34.             ];
  35.             var i:int, j:int, y:Number, box:Sprite, textField:TextField;
  36.             for (i = 0; i < strings.length; i ++) {
  37.                 y = 60 + 15 * i;
  38.  
  39.                 box = createBox();
  40.                 box.x = 100;
  41.                 box.y = y;
  42.                 _boxes[i] = box;
  43.  
  44.                 addChild(box);
  45.  
  46.                 graphics.moveTo(100, y);
  47.                 graphics.lineTo(500, y);
  48.                 for (j = 0; j < 2; j ++) {
  49.                     textFormat.align = (j == 0)? TextFormatAlign.RIGHT: TextFormatAlign.LEFT;
  50.                     textField = new TextField();
  51.                     textField.defaultTextFormat = textFormat;
  52.                     textField.text = strings[i];
  53.                     textField.x = (j == 0)? 10: 510;
  54.                     textField.y = y - 8;
  55.                     textField.width = 80;
  56.                     addChild(textField);
  57.                 }
  58.             }
  59.         }
  60.  
  61.         private function createBox():Sprite {
  62.             var box:Sprite = new Sprite();
  63.             var graphics:Graphics = box.graphics;
  64.  
  65.             graphics.beginFill(0x0099cc);
  66.             graphics.drawRect(-5, -5, 10, 10);
  67.             graphics.endFill();
  68.  
  69.             return box;
  70.         }
  71.  
  72.         private function startTweensy():void{
  73.             var repeatTypes:Array = [
  74.                 TweensyTimeline.NONE,
  75.                 TweensyTimeline.REPLAY,
  76.                 TweensyTimeline.YOYO,
  77.                 TweensyTimeline.LOOP
  78.             ];
  79.  
  80.             var i:int, box:Sprite, timeline:TweensyTimeline;
  81.             for (i = 0; i < _boxes.length; i ++) {
  82.                 box = _boxes[i];
  83.                 timeline = Tweensy.to(box, { x: 500 }, 3, Quadratic.easeOut, 1);
  84.                 timeline.repeatType = repeatTypes[i];
  85.             }
  86.         }
  87.  
  88.  
  89.     }
  90.  
  91. }

]]> http://ferv.jp/blog/2009/05/15/tweensy_6/feed/ 0 Tweensy - onUpdate/onComplete http://ferv.jp/blog/2009/05/14/tweensy_5/ http://ferv.jp/blog/2009/05/14/tweensy_5/#comments Thu, 14 May 2009 06:53:12 +0000 dsk http://flabo.org/?p=594 onUpdate/onCompleteイベントをTweensyで設定してみる。

Tweenerと大きく違う部分は、Tweensy.to()/Tweensy.from()/Tweensy.fromTo()の戻り値のTweensyTimelineオブジェクトに対して、onUpdate/onCompleteをFunction型で設定すること。 また、TweensyTimelineオブジェクトに対して、onUpdateParams/onCompleteParamsをArray型で設定することができ、onUpdate/onCompleteで設定したfunctionに引数として渡される。

今回は円を描いたSpriteをランダムな座標に動かし、scaleX/scaleYもランダムに変化させる。
onUpdateParams/onCompleteParamsにスタート時と現在と目標の座標とscaleを引数として設定し、onUpdate時とonComplete時にスタート時と現在と目標の座標とscaleをTextFieldに表示することにする。onComplete時に再度Tweensy.to()を設定しているので、再帰的に動き続ける。

TestTweensy_5.swf

  • ActionScript
  • TestTweensy_5.as
  • Source
package  {
	import com.flashdynamix.motion.Tweensy;
	import com.flashdynamix.motion.TweensyTimeline;
	import fl.motion.easing.Quadratic;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	[SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
	public class TestTweensy_5 extends Sprite {

		private var _circle:Sprite;
		private var _textField:TextField;

		public function TestTweensy_5() {
			initTextField();
			initCircle();

			startCircleTweensy();
		}

		private function initTextField():void {
			_textField = new TextField();

			var textField:TextField = _textField;
			var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);

			textField.defaultTextFormat = textFormat;
			textField.autoSize = TextFieldAutoSize.LEFT;

			addChild(textField);
		}

		private function initCircle():void {
			_circle = new Sprite();

			var circle:Sprite = _circle;
			var graphics:Graphics = circle.graphics;

			graphics.beginFill(0x0099cc);
			graphics.drawCircle(0, 0, 10);
			graphics.endFill();
			circle.x = Math.random() * stage.stageWidth;
			circle.y = Math.random() * stage.stageHeight;

			addChildAt(circle, 0);
		}

		private function startCircleTweensy():void {
			var circle:Sprite = _circle;
			var targetX:Number = Math.random() * stage.stageWidth;
			var targetY:Number = Math.random() * stage.stageHeight;
			var targetScaleX:Number = 1 + Math.random() * 3;
			var targetScaleY:Number = 1 + Math.random() * 3;

			var timeline:TweensyTimeline = Tweensy.to(circle, { x: targetX, y: targetY, scaleX: targetScaleX, scaleY: targetScaleY }, 3, Quadratic.easeOut, 1);
			timeline.onUpdate = onCircleUpdate;
			timeline.onUpdateParams = [circle.x, circle.y, circle.scaleX, circle.scaleY, targetX, targetY, targetScaleX, targetScaleY];
			timeline.onComplete = onCircleComplete;
			timeline.onCompleteParams = [circle.x, circle.y, circle.scaleX, circle.scaleY, targetX, targetY, targetScaleX, targetScaleY];
		}

		private function onCircleUpdate(startX:Number, startY:Number, startScaleX:Number, startScaleY:Number, targetX:Number, targetY:Number, targetScaleX:Number, targetScaleY:Number):void {
			updateTextField('onCircleUpdate\n', startX, startY, startScaleX, startScaleY, targetX, targetY, targetScaleX, targetScaleY);
		}

		private function onCircleComplete(startX:Number, startY:Number, startScaleX:Number, startScaleY:Number, targetX:Number, targetY:Number, targetScaleX:Number, targetScaleY:Number):void {
			updateTextField('onCircleComplete\n', startX, startY, startScaleX, startScaleY, targetX, targetY, targetScaleX, targetScaleY);
			startCircleTweensy();
		}

		private function updateTextField(text:String, startX:Number, startY:Number, startScaleX:Number, startScaleY:Number, targetX:Number, targetY:Number, targetScaleX:Number, targetScaleY:Number):void {
			var circle:Sprite = _circle;

			text += 'START   x = ' + startX.toString() + '\n';
			text += '        y = ' + startY.toString() + '\n';
			text += '        scaleX = ' + startScaleX.toString() + '\n';
			text += '        scaleY = ' + startScaleY.toString() + '\n';
			text += 'CURRENT x = ' + circle.x.toString() + '\n';
			text += '        y = ' + circle.y.toString() + '\n';
			text += '        scaleX = ' + circle.scaleX.toString() + '\n';
			text += '        scaleY = ' + circle.scaleY.toString() + '\n';
			text += 'TARGET  x = ' + targetX.toString() + '\n';
			text += '        y = ' + targetY.toString() + '\n';
			text += '        scaleX = ' + targetScaleX.toString() + '\n';
			text += '        scaleY = ' + targetScaleY.toString();

			_textField.text = text;
		}


	}

}
  1. package  {
  2.     import com.flashdynamix.motion.Tweensy;
  3.     import com.flashdynamix.motion.TweensyTimeline;
  4.     import fl.motion.easing.Quadratic;
  5.     import flash.display.Graphics;
  6.     import flash.display.Sprite;
  7.     import flash.text.TextField;
  8.     import flash.text.TextFieldAutoSize;
  9.     import flash.text.TextFormat;
  10.  
  11.     [SWF(backgroundColor = 0x000000, width = 600, height = 400, frameRate = 30)]
  12.     public class TestTweensy_5 extends Sprite {
  13.  
  14.         private var _circle:Sprite;
  15.         private var _textField:TextField;
  16.  
  17.         public function TestTweensy_5() {
  18.             initTextField();
  19.             initCircle();
  20.  
  21.             startCircleTweensy();
  22.         }
  23.  
  24.         private function initTextField():void {
  25.             _textField = new TextField();
  26.  
  27.             var textField:TextField = _textField;
  28.             var textFormat:TextFormat = new TextFormat('_等幅', 10, 0xffffff);
  29.  
  30.             textField.defaultTextFormat = textFormat;
  31.             textField.autoSize = TextFieldAutoSize.LEFT;
  32.  
  33.             addChild(textField);
  34.         }
  35.  
  36.         private function initCircle():void {
  37.             _circle = new Sprite();
  38.  
  39.             var circle:Sprite = _circle;
  40.             var graphics:Graphics = circle.graphics;
  41.  
  42.             graphics.beginFill(0x0099cc);
  43.             graphics.drawCircle(0, 0, 10);
  44.             graphics.endFill();
  45.             circle.x = Math.random() * stage.stageWidth;
  46.             circle.y = Math.random() * stage.stageHeight;
  47.  
  48.             addChildAt(circle, 0);
  49.         }
  50.  
  51.         private function startCircleTweensy():void {
  52.             var circle:Sprite = _circle;
  53.             var targetX:Number = Math.random() * stage.stageWidth;
  54.             var targetY:Number = Math.random() * stage.stageHeight;
  55.             var targetScaleX:Number = 1 + Math.random() * 3;
  56.             var targetScaleY:Number = 1 + Math.random() * 3;
  57.  
  58.             var timeline:TweensyTimeline = Tweensy.to(circle, { x: targetX, y: targetY, scaleX: targetScaleX, scaleY: targetScaleY }, 3, Quadratic.easeOut, 1);
  59.             timeline.onUpdate = onCircleUpdate;
  60.             timeline.onUpdateParams = [circle.x, circle.y, circle.scaleX, circle.scaleY, targetX, targetY, targetScaleX, targetScaleY];
  61.             timeline.onComplete = onCircleComplete;
  62.             timeline.onCompleteParams = [circle.x, circle.y, circle.scaleX, circle.scaleY, targetX, targetY, targetScaleX, targetScaleY];
  63.         }
  64.  
  65.         private function onCircleUpdate(startX:Number, startY:Number, startScaleX:Number, startScaleY:Number, targetX:Number, targetY:Number, targetScaleX:Number, targetScaleY:Number):void {
  66.             updateTextField('onCircleUpdate\n', startX, startY, startScaleX, startScaleY, targetX, targetY, targetScaleX, targetScaleY);
  67.         }
  68.  
  69.         private function onCircleComplete(startX:Number, startY:Number, startScaleX:Number, startScaleY:Number, targetX:Number, targetY:Number, targetScaleX:Number, targetScaleY:Number):void {
  70.             updateTextField('onCircleComplete\n', startX, startY, startScaleX, startScaleY, targetX, targetY, targetScaleX, targetScaleY);
  71.             startCircleTweensy();
  72.         }
  73.  
  74.         private function updateTextField(text:String, startX:Number, startY:Number, startScaleX:Number, startScaleY:Number, targetX:Number, targetY:Number, targetScaleX:Number, targetScaleY:Number):void {
  75.             var circle:Sprite = _circle;
  76.  
  77.             text += 'START   x = ' + startX.toString() + '\n';
  78.             text += '        y = ' + startY.toString() + '\n';
  79.             text += '        scaleX = ' + startScaleX.toString() + '\n';
  80.             text += '        scaleY = ' + startScaleY.toString() + '\n';
  81.             text += 'CURRENT x = ' + circle.x.toString() + '\n';
  82.             text += '        y = ' + circle.y.toString() + '\n';
  83.             text += '        scaleX = ' + circle.scaleX.toString() + '\n';
  84.             text += '        scaleY = ' + circle.scaleY.toString() + '\n';
  85.             text += 'TARGET  x = ' + targetX.toString() + '\n';
  86.             text += '        y = ' + targetY.toString() + '\n';
  87.             text += '        scaleX = ' + targetScaleX.toString() + '\n';
  88.             text += '        scaleY = ' + targetScaleY.toString();
  89.  
  90.             _textField.text = text;
  91.         }
  92.  
  93.  
  94.     }
  95.  
  96. }

]]> http://ferv.jp/blog/2009/05/14/tweensy_5/feed/ 0 Tweensy - ease http://ferv.jp/blog/2009/05/14/tweensy_4/ http://ferv.jp/blog/2009/05/14/tweensy_4/#comments Wed, 13 May 2009 15:51:49 +0000 dsk http://flabo.org/?p=587

Tweensy.to()/Tweensy.from()の第四引数とTweensy.fromTo()の第五引数にease:Functionって引数がある。Tweenerでいうtransitionで指定したようなイージングのカーブの指定をする引数と同様のものだ。
ease:Functionには、fl.motion.easingパッケージ内の各クラスのeaseIn/easeOut/easeInOut関数を渡してあげる。fl.motion.easingパッケージは

というクラスで構成されている。意味とかはTransitionの意味を参照。

下のサンプルでは、全クラスのeaseIn/easeOut/easeInOutを試してみた。LinearクラスだけはeaseNone/easeIn/easeOut/easeInOutの四つの関数があるけど、計算内容は同じなのでeaseNoneを渡してある。

QuadraticクラスのeaseIn関数をTweensy.toの第四引数で渡すとこだけ例を挙げておく。

  • ActionScript
  • TestTweensy_4.as
  • Source
Tweensy.to(box, { x: 500 }, 3, Quadratic.easeIn);
  1. Tweensy.to(box, { x: 500 }, 3, Quadratic.easeIn);

]]> http://ferv.jp/blog/2009/05/14/tweensy_4/feed/ 0