ジェスチャーイベントの属性

GestureEvent の属性

GestureEvent クラスにはジェスチャーイベントの基本的な属性が定義されています。これらの属性はおおまかに、押されているキー、操作の行われた座標、ジェスチャー固有の情報、の 3 つのカテゴリーに分けられます。

  • altKey : Boolean (Windows, Linux のみ)
    Alt キーが押されているかを示す
  • commandKey : Boolean (Mac & AIR のみ)
    Control キー か Command キー が押されているかを示す
  • controlKey : Boolean
    Ctrl キー (Windows, Linux) もしくは Control キー (Mac) が押されているかを示す
  • ctrlKey : Boolean
    Ctrl キー (Windows, Linux) もしくは Control キー か Command キーのいずれか (Mac) が押されているかを示す
  • shiftKey : Boolean
    Shift キーが押されているかを示す
  • localX : Number
    イベントの発生したオブジェクトを基準としたイベント発生位置の x 座標
  • localY : Number
    イベントの発生したオブジェクトを基準としたイベント発生位置の y 座標
  • stageX : Number [read-only]
    グローバルなステージの座標を基準としたイベント発生位置の x 座標
  • stageY : Number [read-only]
    グローバルなステージの座標を基準としたイベント発生位置の y 座標
  • phase : String
    ジェスチャーの進行状況を示す値

最後の phase 属性以外は MouseEvent にあるものと基本的に同様に考えてよさそうです。その他の主な MouseEvent との違いは buttonDown 属性が無いこと (当たり前ですが) や、controlKey 属性が Flash Player からも利用可能になっていること (MouseEvent では AIR からのみ) あたりです。

GestureEvent.GESTURE_TWO_FINGER_TAP イベント処理のときは以上のプロパティを使って処理します。もちろん親クラスである Event クラスの属性 (target 等) も利用できます。Event クラスの属性のみで十分な場合は、MouseEvent.DOUBLE_CLICK イベントとイベントハンドラーの共有も簡単そうです。

addEventListener(MouseEvent.DOUBLE_CLICK, onDoubleClick);
addEventListener(GestureEvent.GESTURE_TWO_FINGER_TAP, onDoubleClick);
 
function onDoubleClick(e:Event):void {
  trace("ダブルクリックイベント発生", e.target);
}
 

PressAndTapGestureEvent と TransformGestureEvent の属性

GestureEvent のサブクラスである PressAndTapGestureEvent と TransformGestureEvent は、それぞれ固有の属性を持っています。

まず、PressAndTapGestureEvent は 1 本目の指が触れた状態で 2 本目の指でタップするという動作です。そのため、2 本目の指に関する情報を提供する属性が追加されています。

  • tapLocalX : Number
    イベントの発生したオブジェクトを基準としたタップ位置の x 座標
  • tapLocalY : Number
    イベントの発生したオブジェクトを基準としたタップ位置の y 座標
  • tapStageX : Number [read-only]
    グローバルなステージの座標を基準としたタップ位置の x 座標
  • tapStageY : Number [read-only]
    グローバルなステージの座標を基準としたタップ位置の y 座標

また、TransformGestureEvent はオブジェクトの状態の変更を指示するイベントです。そのため、位置、角度、大きさ、と全部で 5 種類の変更に必要な情報が属性として追加されています。

  • offsetX : Number
  • offsetY : Number
  • rotation : Number
  • scaleX : Number
  • scaleY : Number

これらの属性はイベントの種類により意味が多少異なります (意味を持たないものもあります)。4 つのイベントそれぞれについて、以下のように使い分けます。

  • GESTURE_SWIPE
    offsetX : 1 なら右方向、 -1 なら左方向
    offsetY : 1 なら下方向、 -1 なら上方向
  • GESTURE_PAN
    offsetX : 前回のイベント時の位置からの水平方向の移動
    offsetY : 前回のイベント時の位置からの垂直方向の移動
  • GESTURE_ZOOM と GESTURE_ROTATE
    offsetX : 前回のイベント時の位置からの水平方向の移動
    offsetY : 前回のイベント時の位置からの垂直方向の移動
    rotation : 前回のイベント時の z 軸周りの角度からの回転 (単位は度)
    scaleX : 前回のイベント時の大きさからの水平方向の拡大率
    scaleY : 前回のイベント時の大きさからの垂直方向の拡大率

下は、GESTURE_ZOOM と GESTURE_ROTATE イベントを扱うサンプルです。

Multitouch.inputMode = MultitouchInputMode.GESTURE;
 
var mySprite = new Sprite();
mySprite.graphics.beginFill(0xFF6600);
mySprite.graphics.drawRect(0, 0, 200, 200);
addChild(mySprite);
 
mySprite.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);
mySprite.addEventListener(TransformGestureEvent.GESTURE_ROTATE, onRotate);
 
function onZoom(e:TransformGestureEvent):void {
	var myTarget:Sprite = e.target as Sprite;
	myTarget.scaleX *= e.scaleX;
	myTarget.scaleY *= e.scaleY;
}
 
function onRotate(e:TransformGestureEvent):void {
	var myTarget:Sprite = e.target as Sprite;
	myTarget.rotation += e.rotation;
}
 

トラックバック(0)

トラックバックURL: http://cuaoar.jp/mt4/mt-tb.cgi/56

コメントする

2014年1月

Sun Mon Tue Wed Thu Fri Sat
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31  
レンタルサーバー

月別 アーカイブ

Powered by Movable Type 4.261