ドラッグ&ドロップ

| comment (0) | trackback (0)

Sprite クラスのサブクラスであれば Sprite.stopDrag メソッドを使用してドラッグを実装することができます。また、Sprite.stopDrag() メソッドを呼び出せばドラッグを停止(startDrag() メソッドを終了)させることができます。

次のコードは、単純なドラッグ処理の例です。Sprite クラスのインスタンス sp をドラッグ&ドロップ可能にします。

sp.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);

function startDragging(event:MouseEvent):void {
	sp.startDrag();
	sp.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
}

function stopDragging(event:MouseEvent):void {
	sp.stopDrag();
}

一般的なドラッグ&ドロップ操作では、ドラッグされるオブジェクトを画面の手前に表示させることが多くあります。これはドラッグされるオブジェクトの表示リストを操作することで可能です。
次に示すコードは、2 つのドラッグ可能なスプライトのインスタンスを生成し、ドラッグされるオブジェクトが他の表示オブジェクトより手前に来るようにします。

var rect:Sprite = new Sprite();
rect.x = 150; 
rect.y = 150; 
addChild(rect); 

rect.graphics.beginFill(0x000000); 
rect.graphics.moveTo(0, 0); 
rect.graphics.lineTo(100, 0); 
rect.graphics.lineTo(100, 100); 
rect.graphics.lineTo(0, 100); 
rect.graphics.endFill(); 

var circle:Sprite = new Sprite(); 
circle.x = 100; 
circle.y = 100;
addChild(circle); 

circle.graphics.beginFill(0xff0000); 
circle.graphics.drawCircle(50, 50, 50); 
circle.graphics.endFill(); 

var draggedObject:DisplayObjectContainer;

circle.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
rect.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);


function startDragging(event:MouseEvent):void {
	draggedObject = DisplayObjectContainer(event.target);
	addChild(draggedObject);
	event.target.startDrag();
	event.target.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
}

function stopDragging(event:MouseEvent):void {
	event.target.removeEventListener(MouseEvent.MOUSE_UP, stopDragging);
	event.target.stopDrag();
}

ドラッグが開始されるたびにドラッグされるオブジェクトを DisplayObjectContainer にキャスト(明示的な型変換)して addChild() メソッドを実行しています。

表示リストに入っている表示オブジェクトに対し、同じ表示リストに addChild() メソッドを実行した場合すでにある表示リストの位置からそのオブジェクトが削除され、表示リストの最後尾の位置に追加されます。

trackback (0)

trackback URL: http://gelsol.sub.jp/core/mt-tb.cgi/20

Post your comment