Making the Gamerecent

Making The Game – Teil 5: Multi-Touch Frameworks (für Adobe Flash/Air) – Part 1

Sobald man anfängt Multi-Touch Anwendungen in ActionScript zu schreiben fällt einem sehr schnell, auf dass sich Touch-fähige Applikationen doch in einigen Punkten von herkömmlichen mit Maus und Tastatur bedienbaren Programmen unterscheiden.
 
Wie man sich bereits denken kann ist es nicht üblich auf Maus-Klicks zu warten um eine Aktion zu starten, da die Maus üblicherweise nicht verwendet wird. Seitdem Adobe ende 2009 den Flash Player 10.1 veröffentlicht hat besitzt er die Fähigkeit sogenannte Touch Events zu erkennen.
 

Touch Event: Drag
Touch Event: Drag

Diese Touch Events verhalten sich ähnlich wie die üblichen Ereignisse die man mit der Maus auslösen kann. So gibt es als Beispiel, äquivalent zum Drücken der Maustaste, dem MOUSE_DOWN Ereignis, das TOUCH_BEGIN Ereignis. Mit diesen neuen Ereignis-Typen lassen sich somit alte Anwendungen einfach und schnell in berührungsempfindliche Programme umschreiben.
Doch Touch-Anwendungen sind im Gegensatz zu mit der Maus steuerbaren Anwendungen nicht auf einen Berührpunkt, welcher bei gewöhnlichen Anwendungen durch den Mauszeiger dargestellt wird, beschränkt. Touch-Anwendungen können, je nach der vorhandenen Hardware, eine Vielzahl von Berührungspunkten übermittelt bekommen, die verarbeitet werden müssen.
Um diese große Anzahl an Eingabepunkten zu managen besitzt jeder Touch-Punkt und jedes Touch-Ereignis, im Gegensatz zum herkömmlichen Maus-Ereignis, neben den XY-Koordinaten noch eine eindeutige Bezeichnung, die touchPointID, sowie Informationen über die Größe des Berührungspunktes (sizeX, sizeY) sowie den Druck, der von dem Benutzer auf den Touchscreen ausgeübt wird (pressure). Durch die eindeutige Zuweisung eines Events zu einer ID kann bei sorgfältiger Programmierung genau erkannt werden auf welchen Berührungspunkt ein Objekt ansprechen soll. Darüberhinaus kann mittels der Eigenschaft isPrimaryTouchPoint eines Punktes, welche angibt ob bereits ein anderer Punkt existiert oder nicht, zum Beispiel ein herkömmlicher Rechtsklick realisiert werden.
 

Gesture Events: Rotate and Scale
Gesture Events: Rotate and Scale

Neben dem einfachen Weitergeben der momentan existierenden Berührpunkte existieren in Flash darüber hinaus noch sogenannte Gesten. Diese werden ausgelöst sobald der Benutzer mit den Fingern spezifische Bewegungsabläufe macht. Zu den bekanntesten Gesten gehören die zoomen Geste, bei der zwei Finger auf einem Objekt positioniert und danach voneinander weg bzw. zueinander hin bewegt werden, oder die rotieren Geste, bei der man seinen Fingern die Form eines Kreises nachfährt.
 
 
Aber nicht nur diese zwei Konzepte zur Auswertung von Berührpunkten muss man als Programmierer beachten. Momentan gibt es auch noch Unterschiede in den vom jeweiligen System verwendeten Touch Methode.
Während auf Smartphones und Multi-Touch-Computern meistens betriebssysteminterne Methoden verwendet werden, die Flash direkt, wie oben beschrieben, auswerten kann, existiert darüber hinaus noch das sogenannte TUIO-Protokoll, welches meistens von Systemen mit optischen Erkennungsmethoden, wie Multi-Touch Tische, verwendet werden.
TUIO steht dabei für Table-Top User Interfaces Objects und ist ein XML-artiges Protokoll. Der „Tracker“, der die Berührpunkte erkennt und verfolgt, stellt bei dieser Methode eine Schnittstelle zu der sich die Flash-Anwendung zuerst Verbinden muss. Über XMLsocket gelangt das Flash-Programm an die Daten der einzelnen Punkte, welche dann durch spezielle Funktionen ausgewertet und weiterverarbeitet werden. Normale Touch-Events können somit nicht auf Multi-Touch Hardware verwendet werden die ausschließlich über das TUIO-Protokoll kommuniziert.
 
Damit ein Programm nun komplett hardwareunabhängig, z.B. auch an normalen Rechnern ohne Touch-Bildschirm, funktioniert müsste der Entwickler auf Mausklicks, native Touch Events sowie TUIO-Daten reagieren. Da dies jedoch einen sehr hohen Aufwand mit sich bringt existieren diverse Frameworks, die den Programmierern einen Großteil der Verwaltung von Berührpunkten abnehmen.
 
 
GestureWorks / Open Exhibits
Eines der größten und bekanntesten, Touch-Frameworks für Flash ist das kommerzielle GestureWorks. Mit mehr als 20 verschiedenen Touch Events und über 180 verschiedenen Gesten bietet es darüber hinaus ein riesiges Repertoire an abrufbaren Ereignissen. Diese große Auswahl kostet in der single-user Variante jedoch bereits $249 USD. Eine Gute alternative zu diesem kostenpflichtigen Framework bietet das für wissenschaftliche Einrichtungen und die schulische Verwendung kostenlose und Quellcode offene Open Exhibits, das auf demselben Grundgerüst wie GestureWorks aufbaut. Open Exhibits bietet dafür jedoch nur 20 vordefinierte Gesten, die von Haus aus angesteuert werden können.
 
Der größte Vorteil dieser zwei Frameworks ist die Kompatibilität. Wie bereits erwähnt existiert neben den nativen Windows Touch-Events auch noch die Möglichkeit über das TUIO-Protokoll Berührungspunkt-Daten zu übermitteln. Mithilfe eines entsprechenden Bridge-Programms, welches die TUIO-Daten umwandelt, können beide Frameworks sowohl diese als auch native Touch-Events und sogar auch normale Mausklicks verarbeiten. Somit können alle drei Varianten auf der Programmiererebene mit einem einzigen EventListener angesprochen werden, wobei ohne Framework drei separate benötigt werden würden.
 

  1. // GestureWorks / Open Exhibits
  2. addEventListener(TouchEvent.TOUCH_DOWN, toucheDown);
  3.  
  4. // Alle drei Listener einzeln
  5. addEventListener(MouseEvent.MOUSE_DOWN, mouseDown);// mouse click
  6. addEventListener(TouchEvent.TOUCHE_BEGIN, toucheBegin);// native touch
  7. addEventListener(TouchEvent.MOUSE_DOWN, touchBeginTUIO);// TUIO touch

 
Durch dieses Mapping aller drei Möglichkeiten auf eine einzelne Funktion sind Applikationen, die mit GestureWorks als auch Open Exhibit erstellt werden, auf vielen Systemen ohne Anpassung des Codes lauffähig. Und aus programmiertechnischer Sicht übersichtlicher.
 

GestureWorks: Rotate-Gesture with 2 to X fingers
GestureWorks: Rotate-Gesture with 2 to X fingers

Die bereits integrierten Gesten (GestureWorks: 200 Gesten / Open Exhibit: 20 Gesten) decken bereits eine große Anzahl der bekannten Bewegungen aus anderen Multi-Touch Anwendungen ab. Es ist darüber hinaus dennoch möglich weitere eigene Bewegungsabläufe hinzuzufügen. Inwiefern alle 200 Gesten in GestureWorks sinnvoll sind, hängt von dem jeweiligen Projekt ab, da nicht jede Applikation 1,2,3,4 …n-Finger Gesten benötigt bzw. es aus hardwaretechnischen Limitierungen nicht kann.
 
Darüber hinaus existieren bereits vorgefertigte Module, die frei verfügbar bzw. hinzugekauft werden können. Diese Module können wie Bausteine in die eigene Applikation eingebunden und verwendet werden. So existieren bereits Module die zum Beispiele simple, virtuelle Tastaturen generieren, die darüber hinaus frei dreh und skalierbar sind. Durch diese Module können ganze Abschnitte der eigenen Anwendung durch bereits vorgefertigte Bausteine ersetzt werden.
Natürlich muss bei der Verwendung der Module auf die entsprechenden Lizenzvereinbarungen der Modul-Eigentümer geachtet werden, damit diese entsprechend eingehalten werden.
 
Diese simple Erweiterbarkeit der Gesten und Module verdanken die zwei Frameworks ihrer Architektur. So werden nicht alle Touch-Punkte einzeln betrachtet und verarbeitet, sondern direkt beim Auftreten in einen Vektor gespeichert. Dieser Vektor enthält alle wichtigen Daten der momentan vorhandenen Berührungspunkte. Sobald der Benutzer einen Finger von der Touch-Oberfläche nimmt, wird auch der entsprechende Punkt aus dem Vektor entfernt.
Der Vektor mit seinen Daten wird erst beim eigentlichen Frameaufruf (ENTER_FRAME) abgearbeitet. Dabei werden alle Touch-Punkte nacheinander abgearbeitet, geschaut welche Touchpunkte zu welchem Objekt auf der Bühne gehören und entsprechende Verschiebungen sowie Drehungen ermittelt. Durch diese Vorgehensweise lassen sich auch mehrere Gesten, wie das Skalieren und Rotieren, in einem Frameaufruf abarbeiten. Da eine Applikation 15-30 Mal in der Sekunde, je nach Einstellungen, ihr Bild aktualisiert, wirkt es für den Benutzer als würden beide Aktionen gleichzeitig ausgeführt werden.
Dies ist ein gewaltiger Vorteil zu der Verwendung der internen Gesten-Events im Flash-Player. Zwar verfügt dieser ebenfalls über die Methoden zum Skalieren und Rotieren, jedoch lassen diese sich nicht simultan ausführen. So ist beispielsweise die Geste zum Skalieren während des Rotierens gesperrt und der Benutzer müsste beide Aktionen hintereinander ausführen, um das gewünschte Ergebnis zu bekommen.
 
Da die Verwaltung der Berührungspunkte Framework-intern vonstattengeht, geben ausgelöste Gesten-Aufrufe keine Informationen über die verantwortlichen Touch-Punkte zurück, sondern nur die daraus ermittelten Daten wie Rotationswinkel oder Skalierungsfaktor.
 
 
To be continued in part 2…
 
 
Kommende Blogeinträge
Making The Game – Teil 5: Multi-Touch Frameworks (für Adobe Flash/Air) – Part 2
Making The Game – Teil 6: Multi-Touch-Geräte und ihre Leistungsgrenzen
Making The Game – Teil 7: Interessante Forschungen im Bereich Multi-Touch
Making The Game – Teil 8: Vor- und Nachteile NUI <=> GUI
Making The Game – Teil 9: Spielekonzeption

 
 
Bilder-Quellen:
Alle in diesem Artikel verwendeten Bilder von Gesten stammen von der GestureWorks Webseite
 
 
 

3 Gedanken zu „Making The Game – Teil 5: Multi-Touch Frameworks (für Adobe Flash/Air) – Part 1

Schreibe einen Kommentar