TweensyGroup - to

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. }


About this entry