2010-02-06(Sat) 00:34
【AS3.0】トィーンライブラリTweensyを使ってみる

TweensyはTweenerよりも高速で軽量なトィーンライブラリです。
特徴としてエフェクトが簡単に作れるTweensy FXという機能があります。
今回はよく使いそうな機能をピックアップしていきたいと思います。

  1. まずはダウンロード
    http://code.google.com/p/tweensy/
    「Tweensy 0.2.2.zip」をダウンロードします。
    解凍したら
    「releases」→「source」→「cs4」→「original」
    の中にある「com」フォルダをプロジェクトフォルダにコピーします。
    ちなみにcs3用のファイルも用意されているのでcs3の場合はそちらを使用してください。
  2. ライブラリをインポートします。
    import com.flashdynamix.motion.Tweensy;
  3. 最初は現在の位置から指定位置まで移動するという簡単なものからやってみます。

    package
    {
    	import flash.display.Sprite;
    	import com.flashdynamix.motion.Tweensy;
    	import flash.geom.Rectangle;
    
    	public class Main extends Sprite
    	{
    		function Main() {
    			//四角を作成
    			var rect:Sprite = new Sprite();
    			rect.graphics.beginFill(0x3299FF);
    			rect.graphics.drawRect(0, 0, 50, 50);
    			this.addChild(rect);
    
    			//現在の位置からx=500へ移動
    			Tweensy.to(rect, { x:500 } );
    		}
    	}
    }
    

    実際tweensyの設定は一行ですね。
    tweenerも一行だったので当然かもしれませんが……。
    今回のように指定位置に移動するには「to」メソッドを使用します。
    逆に指定位置からスタートしたい場合は「from」メソッドを、
    スタートもゴールも指定する場合は「fromTo」メソッドを使用します。

  4. このままではあれなので色々やってきましょう。
    ちなみに「to」メソッドの設定はたぶんこんな感じになってます。
    (インスタンス, 目標座標, 秒数,イージング設定,遅延時間)
    なので、10秒後に5秒かけてx500,y200に移動したい場合、

    Tweensy.to(rect, { x:500, y:200 }, 10, null, 1 );
    

    と記述します。

  5. 指定インスタンスの動作を停止させる「stop」メソッドと
    すべてのインスタンスを停止させる「stopAll」というメソッドもあります。

    インスタンスをクリックすると停止するというのを作成してみます。

    package
    {
    	import flash.display.Sprite;
    	import com.flashdynamix.motion.Tweensy;
    	import flash.events.MouseEvent;
    	import flash.geom.Rectangle;
    
    	public class Main extends Sprite
    	{
    		var rect:Sprite;
    
    		function Main() {
    
    			//四角を作成
    			rect = new Sprite();
    			rect.graphics.beginFill(0x3299FF);
    			rect.graphics.drawRect(0, 0, 50, 50);
    			this.addChild(rect);
    
    			//1秒後に10秒かけてx100,y50からx500,y200に移動
    			Tweensy.fromTo(rect, { x:100, y:50 }, { x:500, y:200 }, 10, null, 1 );   
    
    			//マウスイベント
    			rect.addEventListener(MouseEvent.MOUSE_DOWN, MCStop);
    		}
    		//四角をクリックしたとき
    		function MCStop(e:MouseEvent):void{
    			Tweensy.stop(rect);
    		}
    	}
    }
    

category : ActionScript
tag :

Comments(0)Trackbacks(0)