« Blogger's Lounge chumby Night | メイン | F-site行ってきたよ »

ユーザーが拡大縮小移動回転などできるオブジェクトをAS3で

del.icio.us it!   hatena bookmark
まーあれですPhotoShopとかでオブジェクト移動したりするやつ。
以前AS2で作ったことあるんですが、AS3で必要になり移植だるいなーと思ってたらふとそんなライブラリがあったなーということで試してみました。

TransformTool
http://www.senocular.com/demo/TransformToolAS3/TransformTool.html

使い方は超簡単。newしてaddChildしてtarget決めるだけ。
var tTool:TransformTool = new TransformTool();
addChild(tTool);
tTool.target = container;
クリックされたらtargetを入れ替えるようにすればそれっぽく使えそうです。
しかもいろいろな設定ができて至れり尽くせりな感じ。
tTool.registration = new Point(container.width/2, container.height/2); // 中心点            
tTool.controlSize = 30; コントロールポイントの大きさ
tTool.moveEnabled = false; // 移動できるかどうか
tTool.registrationEnabled = false; // 中心点の表示
tTool.rotationEnabled = false; // 回転できるかどうか
tTool.scaleEnabled = false; // 拡大縮小できるか
tTool.skewEnabled = false; // 菱形に変形できるかどうか
tTool.outlineEnabled = false; // 枠をの表示
tTool.cursorsEnabled = false; // カーソル変更するかどうか
tTool.constrainScale = true; // 比率を保つかどうか
tTool.constrainRotation = true; //constrainRotationで設定した角度ずつ回転
tTool.constrainRotationAngle = 10;
tTool.maxScaleX = 2; // scaleXの最大値
tTool.maxScaleY = 2; // scaleYの最大値
他にもよく分からないプロパティがいくつかあったのでいろいろできそう。
あとコントロールポイントの見た目もカスタマイズできるっぽい。

サンプル
このコンテンツには最新のFlashPlayerが必要です
いちおうサンプルのソース全文
package
{    
    import flash.display.*;
    import flash.events.*;
    import flash.geom.*;
    import com.senocular.display.TransformTool;
    
    [SWF(width="500", height="400", frameRate="30", backgroundColor="0xffffff")]    
    public class TransformTest01 extends Sprite
    {
        
        [Embed(source='photo.jpg')] private var Photo:Class;
        
        public function TransformTest01()
        {

            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.align = StageAlign.TOP_LEFT;            

            init();
        }

        private function init():void
        {
            var container:Sprite = new Sprite();
            var photo:Bitmap = new Photo() as Bitmap;
            container.addChild(photo);
            addChild(container);

            var tTool:TransformTool = new TransformTool();
            addChild(tTool);

            tTool.target = container;

            tTool.registration = new Point(container.width/2, container.height/2); // 中心点            
            //tTool.controlSize = 30; コントロールポイントの大きさ
            //tTool.moveEnabled = false; // 移動できるかどうか
            //tTool.registrationEnabled = false; // 中心点の表示
            //tTool.rotationEnabled = false; // 回転できるかどうか
            //tTool.scaleEnabled = false; // 拡大縮小できるか
            //tTool.skewEnabled = false; // 菱形に変形できるかどうか
            //tTool.outlineEnabled = false; // 枠をの表示
            //tTool.cursorsEnabled = false; // カーソル変更するかどうか
            //tTool.constrainScale = true; // 比率を保つかどうか
            //tTool.constrainRotation = true; //constrainRotationで設定した角度ずつ回転
            //tTool.constrainRotationAngle = 10;
            //tTool.maxScaleX = 2; // scaleXの最大値
            //tTool.maxScaleY = 2; // scaleYの最大値
        }
    }
}


Flash Math & Physics Design:ActionScript 3.0による数学・物理学表現[入門編] 集合知プログラミング ビジュアライジング・データ —Processingによる情報視覚化手法 御岳百草丸 1200T

トラックバック

このエントリーのトラックバックURL:
http://un-q.net/mt-tb.cgi/354

コメントを投稿

書いたよ!