Home > papervision3d > Papervision3DでTweenerを使ってオブジェクトを滑らかに拡大する

Papervision3DでTweenerを使ってオブジェクトを滑らかに拡大する

前回のエントリで導入したTweenerというライブラリを使ってPapervision3Dのオブジェクトに滑らかな動きを付けます。

Tweenerの基本

Tweenerに関するドキュメントが少ないのですが、どうやらaddTweenというメソッドがメインであり、ほぼそれに尽きるようです。

TweenerのaddTweenメソッドの定義は以下の通りです。

Tweener.addTween(obj1:Object [, obj2:Object, ..., objN:Object] ,
                 tweeningOptions:Object
                );

staticメソッドなので、Tweenerのインスタンスを作成する必要はありません。
第一引数に対象となるオブジェクトを指定し、それ以降は連想配列でオプションを指定します。

Tweenerで拡大する

今回はTweenerのテストを兼ねて、滑らかにオブジェクトを拡大します。
導入は非常に簡単です。

Tweener.addTween(container, 
                 {_scale:2,
                  time:1.0,
                  transition:"easeOutElastic"
                 });

たったコレだけです。
第一引数のcontainerはオブジェクトを格納するルートノードです。

第二引数の連想配列の中身を説明します。
「_scale」は対象となるオブジェクトの拡大率です。2となっているのは2倍です。
「time」は対象オブジェクトの変形時間です。
「transition」は変形の軌跡です。具体的にはコチラをご覧下さい。

実装結果はこうなります。オブジェクトをクリックすると滑らかに拡大・縮小します。

ソースコード

上のSWFをコンパイルできるASソースコードです。

package {
  import flash.display.*;
  import flash.events.*;
 
  import org.papervision3d.core.proto.*;
  import org.papervision3d.scenes.*;
  import org.papervision3d.objects.*;
  import org.papervision3d.cameras.*;
  import org.papervision3d.materials.*;
 
  import caurina.transitions.*;
 
  [SWF(
       backgroundColor="0xffffff",
       frameRate="45"
      )]
 
  public class MyTweenPlane extends Sprite
  {
    private var container : Sprite;
    private var scene     : Scene3D;
    private var camera    : Camera3D;
    private var rootNode  : DisplayObject3D;
    private var obj       : DisplayObject3D ; //オブジェクト
    private var size      : int = 200;//オブジェクトの長さ
    private var segment   : int = 1;  //面の分割数
    private var material  : MaterialObject3D;
    private var isTween   : Boolean;
 
    //--------------------------------------------Constructor
    public function MyTweenPlane():void
    {
      //ステージ
      this.stage.quality   = "MEDIUM";
      this.stage.scaleMode = "noScale";
      this.stage.align = StageAlign.TOP_LEFT;
      this.stage.addEventListener(Event.ENTER_FRAME, loop);
      this.stage.addEventListener(Event.RESIZE, resize);
 
      //コンテナ生成
      container = new Sprite();
      container.x = this.stage.stageWidth  / 2;
      container.y = this.stage.stageHeight / 2;
      addChild(container);
 
      //シーン生成
      scene = new Scene3D(container);
 
      //rootNode生成
      rootNode = new DisplayObject3D("rootNode");
      scene.addChild(rootNode);
 
      //マテリアル設定
      material = new ColorMaterial(0xcccccc);
      material.name = "gray";
      material.doubleSided = true;
 
      //オブジェクト生成
      obj = new Plane(material, size, size, segment, segment);
      rootNode.addChild(obj);
 
      //camera設定
      camera = new Camera3D();
      camera.z = -size;
      camera.focus = 300;
      camera.zoom = 1;
 
      //Tweenの状態フラグ
      isTween = false;
 
      //イベントリスナの登録			
      container.addEventListener(MouseEvent.CLICK, clickObj);
    }
 
    //--------------------------------------------loop 
    private function loop(event:Event):void
    {
      // 回転
      obj.rotationY += container.mouseY / 100;
      obj.rotationX += container.mouseX / 100;
 
      //再レンダリング
      scene.renderCamera(camera);
    }
 
    //--------------------------------------------stage
    private function resize(e:Event):void{
      container.x = this.stage.stageWidth  / 2;
      container.y = this.stage.stageHeight / 2;
    }
 
    //--------------------------------------------mouse click	
    private function clickObj (e:MouseEvent):void {
      if(isTween) {
        Tweener.addTween(container, {_scale:1,time:1.0,transition:"easeOutElastic"});
        isTween = false;
      } else {
        Tweener.addTween(container, {_scale:2,time:1.0,transition:"easeOutElastic"});
        isTween = true;
      }
      scene.renderCamera(camera);
    }
  }
}
関連のありそうなエントリ

Comments:0

Comment Form
Remember personal info

*
To prove that you're not a bot, enter this code
Anti-Spam Image

Trackbacks:0

Trackback URL for this entry
http://www.adamrocker.com/blog/144/papervision_tweener_scale.html/trackback/
Listed below are links to weblogs that reference
Papervision3DでTweenerを使ってオブジェクトを滑らかに拡大する from throw Life

Home > papervision3d > Papervision3DでTweenerを使ってオブジェクトを滑らかに拡大する

Search
Feeds
Meta

Return to page top