Starling中的拖拽

在这个简单的教程中,我将提供基于Starling框架实现拖拽的代码。我将使用Quad类来做演示。这是我的主类代码:

package 
{
 import starling.core.Starling;
 import flash.display.Sprite;
 import flash.display.StageAlign;
 import flash.display.StageScaleMode;
 
 [SWF(width="550", height="400", frameRate="60", backgroundColor="#CCCCCC")]
 
 public class Main extends Sprite
 {
  private var mStarling:Starling;
 
  public function Main()
  {
   stage.scaleMode = StageScaleMode.NO_SCALE;
   stage.align = StageAlign.TOP_LEFT;
 
   mStarling = new Starling(Game, stage);
   mStarling.antiAliasing = 2;
   mStarling.start();
  }
 }
}

我添加了一个Quad显示对象到stage的中心位置,并添加了触碰事件侦听。touchHandler方法将侦听鼠标按下和鼠标移动事件,并且移动Quad对象到光标的x和y坐标。同时我也添加了一个偏移量(Quad宽度和高度的一半),所以我在拖拽的时候,始终围绕对象的中心点进行操作。

package {
 
 import starling.events.TouchPhase;
 import flash.geom.Point;
 import starling.events.Touch;
 import starling.events.TouchEvent;
 import starling.events.Event;
 import starling.display.Quad;
 import starling.display.Sprite;
 
 public class Game extends Sprite {
 
  public function Game() {
   addEventListener(Event.ADDED_TO_STAGE, onAdded);
  }
 
  private function onAdded (e:Event):void { 
   var q:Quad = new Quad(50,50);
   q.x = stage.stageWidth/2 - q.width/2;
   q.y = stage.stageHeight/2 - q.height/2;
   q.addEventListener(TouchEvent.TOUCH, touchHandler); 
   addChild(q);
  }
 
  private function touchHandler(e : TouchEvent) : void 
  {
   var touch:Touch = e.getTouch(stage);
   var position:Point = touch.getLocation(stage);
   var target:Quad = e.target as Quad;
 
   if(touch.phase == TouchPhase.MOVED ){
    target.x = position.x - target.width/2;
    target.y = position.y - target.height/2;
   }
  }
 }
}

这种方法也同样适用于您处理多个对象的拖拽。下面的代码使用了for循环增加了10个Quad对象,并随机放置在stage某处,然后同样也具备touch事件侦听。

for(var i:uint = 0; i < 10; i++){
 var q:Quad = new Quad(50,50);
 q.color = Math.random() * 0xFFFFFF;
 q.x = Math.random() * stage.stageWidth - q.width;
 q.y = Math.random() * stage.stageHeight - q.height;
 q.addEventListener(TouchEvent.TOUCH, touchHandler); 
 addChild(q);
}
点击打开链接
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值