Introducing Starling

Touch Events

As we mentioned earlier, Starling is Sparrow’s cousin, and as a result, the touch event mechanism in Starling is really tailored for mobile and therefore for touch interactions, which can be quite confusing at first sight when using Starling on desktop applications designed for mouse interactions.

First, if you take a look at the Figure 1-2, you will notice that in contrary of the native display list, with Starling there is no InteractiveObject class in the hierarchy, all display objects are by default interactive. To say it differently, the DisplayObject class defines interactive behaviors.

We have been using touch events quickly in the past examples. We started with some very basic stuff, like reacting when the mouse touches the quad. For this, we used the TouchEvent.TOUCH event:

// when the sprite is touched
_customSprite.addEventListener(TouchEvent.TOUCH, onTouchedSprite);

You may think that this is pretty limited right? Actually it is very powerful cause you can detect a lot of different states through this single event. Everytime a mouse or fingers are interacting with a graphical object, a TouchEvent.TOUCH event is dispatched.

Let’s have a closer look. In the following code, we trace the phase property available on the Touch object in our onTouch event handler:

private function onTouch (e:TouchEvent):void
{
    // get the mouse location related to the stage
    var touch:Touch = e.getTouch(stage);
    var pos:Point = touch.getLocation(stage);

    trace ( touch.phase );

    // store the ...