当前位置: > > > AS手机项目 - 触摸和手势的例子(触摸绘制矩形,手势移动)

AS手机项目 - 触摸和手势的例子(触摸绘制矩形,手势移动)

flash或flex开发移动项目的时候,既支持触摸,也支持手势。

1,如果要使用手势,则只需把Multitouch.inputMode设置为MultitouchInputMode.GESTURE即可。

2,使用Multitouch.supportedGestures可以返回设备所支持的所有手势类型(返回一个字符串Vector集合)

3,对于用户发起的手势类型,分别有如下三种手势事件
(1)GestureEvent:只有一个事件类型属性GestureEvent.GESTURE_TWO_FINGER_TAP(表示两个手指轻击)
(2)PressAndTapGestureEvent:只有一个事件类型属性PressAndTapGestureEvent.GESTURE_PRESS_AND_TAP(一指按住一指轻击)
(3)TransformGestureEvent:有4个事件类型属性
TransformGestureEvent.GESTURE_PAN:平移手势
TransformGestureEvent.GESTURE_ROTATE:旋转手势
TransformGestureEvent.GESTURE_SWIPE:滑动手势
TransformGestureEvent.GESTURE_ZOOM:缩放手势
4,下面是一个触摸和手势的例子
(1)在舞台空白除拖拽绘制矩形(触摸模式)
(2)两个手指在矩形上可以进行手势移动
(3)由于触摸手势只能同时存在一种,加了个定时器,手势模式下如果一段时间不活动就改回触摸模式。

 效果图如下:
  

 代码如下:
package
{
	import flash.display.Sprite;
	import flash.display.Stage;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.GesturePhase;
	import flash.events.TimerEvent;
	import flash.events.TouchEvent;
	import flash.events.TransformGestureEvent;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.ui.Multitouch;
	import flash.ui.MultitouchInputMode;
	import flash.utils.Timer;
	
	[SWF( backgroundColor="0xFFFFFF", frameRate="25")]
	public class MultitouchAndGestures extends Sprite
	{	
		private var offsetX:Number;  //记录第一次按下的x坐标
		private var offsetY:Number; //记录第一次按下的y坐标
		private var resetTouchTimer:Timer; //重置触摸模式计时器
		private var currentTarget:String; //当前选中对象
		
		public function MultitouchAndGestures()
		{
			super();
			
			// 支持 autoOrient
			stage.align = StageAlign.TOP_LEFT;
			stage.scaleMode = StageScaleMode.NO_SCALE;
			
			//创建文本框(显示触摸点个数和支持的触摸类型)
			var textField:TextField = new TextField();
			textField.autoSize = TextFieldAutoSize.LEFT;
			
			//判断是否支持触摸
			var touchEnabled:Boolean = Multitouch.supportsTouchEvents;
			
			//初始化重置模式计时器
			resetTouchTimer = new Timer(1000, 0);
			resetTouchTimer.addEventListener(TimerEvent.TIMER, onTimer); 
			
			switch(touchEnabled)
			{ 
				case true:
				{
					//设置触摸模式
					Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;
					
					textField.text = "支持的触摸点个数:"+ Multitouch.maxTouchPoints;
					textField.text += "\n支持触摸类型:" +Multitouch.supportedGestures ;
						
					// 注册触摸事件
					stage.addEventListener(TouchEvent.TOUCH_BEGIN, onTouch);
					stage.addEventListener(TouchEvent.TOUCH_MOVE, onTouch);
					stage.addEventListener(TouchEvent.TOUCH_END, onTouch);
				}
					break;
				case false:
				{
					textField.text = "不支持触摸";
				}
					break;
			} 
			
			stage.addChild(textField);
		}    
		
		/**
		 *	触摸事件响应 
		 */
		private function onTouch(touchEvent:TouchEvent):void
		{
			var id:Number = touchEvent.touchPointID;
			var x:Number = touchEvent.stageX;
			var y:Number = touchEvent.stageY;
			
			switch(touchEvent.type)
			{ 
				case TouchEvent.TOUCH_BEGIN:
					//判断触摸对象是舞台,还是图形
					if(touchEvent.target is Stage)
					{	
						offsetX = x;
						offsetY = y;
						drawShape(id, x, y);
					} else {
						currentTarget = touchEvent.target.name;    
						initializeGestures(); //开启手势
					}                              
					break;
				case TouchEvent.TOUCH_MOVE:
					drawShape(id, x, y); 
					break;
				default:
					break;
			} 
		}
		
		/**
		 * 绘制矩形
		 */
		private function drawShape(id:Number, x:Number, y:Number):void
		{
			
			var shape:Sprite;
			var name:String = id.toString(); 
			
			if(!stage.getChildByName(name))
			{
				shape = new Sprite(); 
				shape.name = id.toString();
				shape.addEventListener(TransformGestureEvent.GESTURE_PAN, onPan);
				stage.addChild(shape);
			} else {
				shape = stage.getChildByName(name) as Sprite; 
			} 
			
			shape.graphics.clear(); 
			shape.graphics.lineStyle(2, 0x00ff00,0.7); 
			shape.graphics.beginFill(0x00ff00,0.3); 
			shape.graphics.drawRect(offsetX, offsetY, x-offsetX, y-offsetY); 
			shape.graphics.endFill(); 
		}
		
		/**
		 * 手势事件响应函数
		 */
		private function onPan(event:TransformGestureEvent):void
		{
			switch(event.phase)
			{
				case GesturePhase.UPDATE:
					initializeReset();
					stage.getChildByName(currentTarget).x = stage.getChildByName(currentTarget).x + event.offsetX;
					stage.getChildByName(currentTarget).y = stage.getChildByName(currentTarget).y + event.offsetY;
					break;
			}
		}
		
		/**
		 * 开始计时器
		 */
		private function initializeReset():void
		{
			resetTouchTimer.delay = 1000;
			
			if(!resetTouchTimer.running)
				resetTouchTimer.start();
		}
		
		/**
		 * 计时器结束,变成触摸模式
		 */
		private function onTimer(e:TimerEvent):void
		{
			resetTouchTimer.stop();
			initializeTouches(); 
		}
		
		/**
		 * 转为触摸模式
		 */
		private function initializeTouches():void
		{
			if(Multitouch.supportsTouchEvents)
			{
				Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT; 
				TransformGestureEvent.GESTURE_ZOOM
			}
		}
		
		/**
		 * 转为手势模式
		 */
		private function initializeGestures():void
		{
			if(Multitouch.supportsGestureEvents)
			{
				Multitouch.inputMode = MultitouchInputMode.GESTURE; 
				initializeReset(); 
			}
		}
		
		
	}
}
评论0