トップページ > Flash入門 > マウス・キーボード関係（３）
次のFlashでは，青い正方形をドラッグして動かすことができます。 １度Flash窓をクリックしてアクティブにしてから動かしてください。
前ページまではstage（表示画面）にマウスのイベントリスナを登録していましたが， 今回は動かしたい対象（"sp"という名前のスプライト）にイベントリスナを登録しています。 ドラッグを実装すること自体は簡単で，マウスの左ボタンを押された時の処理でstartDrag()関数を呼び， 左ボタンが離された時の処理でstopDrag()関数を呼ぶだけです。
package
{
import flash.display.Loader;
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.events.Event;
import flash.events.MouseEvent;
//画面サイズと背景色，フレームレートを設定
[SWF(width="300", height="300", frameRate = "60", backgroundColor="0xffffcc")]
public class Main extends Sprite
{
//スプライトを用意
public var sp:Sprite = new Sprite();
//main関数
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
//コンストラクタ
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
//============================================================
//スプライトを青い四角に塗りつぶす
sp.graphics.beginFill(0x0000FF);
sp.graphics.drawRect(0, 0, 60, 60);
sp.graphics.endFill();
//============================================================
//スプライトを登録
this.stage.addChild(sp);
//============================================================
//スプライトにMOUSE_DOWNイベントとMOUSE_UPイベントを登録
sp.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
sp.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
//============================================================
}
//================================================================
//マウスの左ボタンが押された時に呼ばれる関数
private function onMouseDown(e:MouseEvent):void
{
//ドラッグ開始
sp.startDrag();
}
//マウスの左ボタンが離された時に呼ばれる関数
private function onMouseUp(e:MouseEvent):void
{
//ドラッグ終了
sp.stopDrag();
}
//================================================================
}
}
上でやったのと同様に，今度は画像を表示して，そこにマウスのイベントリスナを登録してみます。 （このFlashで画像は動きません）
このFlashではBitmapクラスとしてインスタンス化した画像をドラッグすることができません。。。 どうやら，Bitmapとして読み込んだ画像にはイベントリスナを登録できないようです。 さらに，Bitmapクラスには先ほど使ったstartDrag(),stopDrag()関数が登録されていないようです。 一応，ソースコードを以下に示します。
package
{
import flash.display.Loader;
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.events.Event;
//Mouse関係のイベントクラスを読み込んでおく
import flash.events.MouseEvent;
//画面サイズと背景色，フレームレートを設定
[SWF(width="300", height="300", frameRate = "60", backgroundColor="0xffffcc")]
public class Main extends Sprite
{
//画像ファイルを読み込む
[Embed(source = "./ClearBall_pink.png")]
public var ballImg:Class;
//"ball"をクラス変数として定義
public var ball:Bitmap = new ballImg();
//================================================================
//ドラッグ用のダミーのスプライト
public var sp:Sprite = new Sprite();
//================================================================
//main関数
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
//コンストラクタ
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
//画像を表示
addChild(ball)
//============================================================
//画像にイベントリスナを登録 （登録しても，呼ばれません・・・）
ball.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
//============================================================
}
//================================================================
//マウスの左ボタンが押された時に呼ばれる関数
//Bitmapの場合，呼ばれません。。。
private function onMouseDown(e:MouseEvent):void
{
//試しに，マウスのx座標まで移動するようにしてみます
ball.x = this.stage.mouseX;
//以下のコードを書くとエラーになります
//BitmapクラスにはstartDrag()メソッドが使えません
//ball.startDrag();
}
//================================================================
}
}
スプライトにはイベントリスナを登録できたので，画像をスプライトの上に貼りつけて， スプライトごと動かすようにしてみます。 画像の回転の時と似た手法です。 例のごとく，まずはスプライトにわざと色を付けてやってみます。
上のFlashではスプライトの形を四角形にしているので，画像からはみ出たスプライト部分をドラッグしても動いてしまいます。 これに対しては，スプライトの形を円にするなどの方法で対処できると思います。 以下，ソースコードです。
package
{
import flash.display.Loader;
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.events.Event;
//Mouse関係のイベントクラスを読み込んでおく
import flash.events.MouseEvent;
//画面サイズと背景色，フレームレートを設定
[SWF(width="300", height="300", frameRate = "60", backgroundColor="0xffffcc")]
public class Main extends Sprite
{
//画像ファイルを読み込む
[Embed(source = "./ClearBall_pink.png")]
public var ballImg:Class;
//"ball"をクラス変数として定義
public var ball:Bitmap = new ballImg();
//================================================================
//ドラッグ用のダミーのスプライト
public var sp:Sprite = new Sprite();
//================================================================
//main関数
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
//コンストラクタ
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
//スプライトに色を付ける
sp.graphics.beginFill(0x0000FF);
sp.graphics.drawRect(0, 0, 60, 60);
sp.graphics.endFill();
//スプライトの上にball画像を貼る
sp.addChild(ball)
//============================================================
//下地のスプライトにイベントリスナを登録
sp.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
sp.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
//============================================================
//スプライトを登録
this.stage.addChild(sp);
}
//================================================================
//マウスの左ボタンが押された時に呼ばれる関数
private function onMouseDown(e:MouseEvent):void
{
//ドラッグ開始
sp.startDrag();
}
//マウスの左ボタンが離された時に呼ばれる関数
private function onMouseUp(e:MouseEvent):void
{
//ドラッグ終了
sp.stopDrag();
}
//================================================================
}
}
スプライトを置く際に，特に色を付けなければ画像自体をドラッグしているように見せることができます。
package
{
import flash.display.Loader;
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.events.Event;
import flash.events.MouseEvent;
//画面サイズと背景色，フレームレートを設定
[SWF(width="300", height="300", frameRate = "60", backgroundColor="0xffffcc")]
public class Main extends Sprite
{
//画像ファイルを読み込む
[Embed(source = "./ClearBall_pink.png")]
public var ballImg:Class;
//"ball"をクラス変数として定義
public var ball:Bitmap = new ballImg();
//================================================================
//ドラッグ用のダミーのスプライト
public var sp:Sprite = new Sprite();
//================================================================
//main関数
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
//コンストラクタ
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
//スプライトの上にball画像を貼る
sp.addChild(ball)
//============================================================
//下地のスプライトにイベントリスナを登録
sp.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
sp.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
//============================================================
//スプライトを登録
this.stage.addChild(sp);
}
//================================================================
//マウスの左ボタンが押された時に呼ばれる関数
private function onMouseDown(e:MouseEvent):void
{
//ドラッグ開始
sp.startDrag();
}
//マウスの左ボタンが離された時に呼ばれる関数
private function onMouseUp(e:MouseEvent):void
{
//ドラッグ終了
sp.stopDrag();
}
//================================================================
}
}