Multitouch-Unterstützung

Einführung¶

Die Computermaus ist seit etwa 30 Jahren das vorherrschende Eingabegerät für grafische Benutzeroberflächen. Die interaktive Komponente von Cinderella ist darauf angewiesen, da sie eine Eins-zu-eins-Entsprechung zwischen den Bewegungen eines physischen Geräts und einem Punkt auf dem Bildschirm bietet. Andererseits beschränkt die Maus die gestische Ausdrucksfähigkeit eines Menschen auf eine zweidimensionale Translation. Wir haben uns an diese Beschränkung gewöhnt, aber im echten Leben arbeiten wir lieber mit beiden Händen und mehreren Fingern.

Die Technologie schreitet voran, und ein großer Fortschritt sind Multitouch-Schnittstellen wie sie in modernen Smartphones oder Tablet-Computern zu finden sind. Selbst die Touchpads von Laptops können mehrere Finger gleichzeitig erkennen, und Bildschirme mit Berührungserkennung sind erschwinglicher geworden und werden von den neuesten Betriebssystemen unterstützt.

Für ein Geometrie-Tool ist Multitouch mehr als eine nützliche Zusatzfunktion. Mathematisch gesprochen ändert sich die Schnittstelle von „nur Translation" zu „Multi-Transformation-fähig". Es gibt gute Gründe, warum es in Cinderella keinen Modus zum Hinzufügen einer „freien Linie" gibt. Stattdessen müssen Sie Linien durch zwei Punkte oder Linien durch einen Punkt verwenden. Wenn Sie eine Maus als Eingabegerät verwenden, definieren nur diese beiden Werkzeuge eine aussagekräftige Interaktion zwischen dem Benutzer und der Konstruktion. Die Situation ändert sich drastisch in einer Multitouch-Umgebung. Bewegungen von zwei Fingern sind bereits mächtig genug, um eine Ähnlichkeitstransformation zu kodieren. In einem solchen Szenario ist es physisch möglich, mit zwei Fingern die vollständige Interaktion für eine Linie zu erreichen: Sie können sie gleichzeitig drehen und verschieben.

Aus Programmiersicht führt Multitouch einige Komplexität ein. Bei der Maus gibt es zu jedem Zeitpunkt eine definierte Zeigerposition, und die Schaltflächeninteraktion ist immer eine Druck-Ziehen-Freigabe-Sequenz. Dies gilt nicht mehr für Multitouch-Interaktion; offensichtlich kann es eine beliebige Anzahl von aktuellen Positionen geben (auch keine, wenn Sie nicht berühren), und die Berührungs-Bewegungs-Freigabe-Sequenzen können sich überlappen. Als Benutzer sollten Sie sich nicht darum kümmern müssen, aber wenn Sie mit CindyScript arbeiten möchten, wird dies wichtig sein. Siehe [KD10] für eine detailliertere Diskussion.

Multitouch mit Cinderella verwenden¶

Derzeit unterstützt Cinderella Multitouch-Ereignisse über das Community-Standard TUIO-Protokoll [KBBC05], siehe auch http://www.tuio.org. Dieser plattformübergreifende Standard hat den Vorteil, dass es entsprechende Treiber für fast jedes Multitouch-Gerät gibt. Für Smartphones und Tablets finden Sie auf der TUIO-Homepage Apps, die die Multitouch-Ereignisse an Ihren Computer senden.

Sie können TUIO-Unterstützung in den Modus- und Spracheinstellungen des Inspector aktivieren. Aktivieren Sie das Kontrollkästchen TUIO-Unterstützung und Cinderella lauscht auf den Standardport 3333 auf TUIO-Ereignisse im Bewegungsmodus. Wenn TUIO-Unterstützung aktiviert ist, werden reguläre Mausereignisse im Bewegungsmodus ignoriert, um doppelte Eingaben zu vermeiden, wenn sie mit Standard-TUIO-Treibern unter Windows oder Mac OS X verwendet werden. Andere Modi von Cinderella erfordern immer noch Mausbetrieb und unterstützen keine TUIO-Ereignisse. Wenn Sie Erstellungsgesten aktivieren, können Sie Punkte und Linien durch Berührung der Ebene mit einem oder zwei Fingern erstellen. Da dies zu vielen unerwünschten Punkten und Linien führen kann, ist diese Option standardmäßig deaktiviert und sollte als experimentell betrachtet werden.

Die Option Nur frontmost window sollte je nach Gerät, das Sie für Multitouch-Gesten verwenden, aktiviert oder deaktiviert sein. Wenn das Gerät den Bildschirminhalt anzeigt, sollte es normalerweise deaktiviert sein, da die Berührungen auf dem Bildschirm automatisch den einzelnen Cinderella-Fenstern zugeordnet werden. Wenn das Gerät keinen Bildschirm hat oder die Cinderella-Fenster nicht anzeigt, wie es bei Touchpads auf Laptop-Computern oder TUIO-Apps auf Mobiltelefonen der Fall ist, ist es möglicherweise besser, diese Option zu aktivieren. In diesem Fall werden alle Ereignisse auf der Touch-Oberfläche dem sichtbaren Ansichtsbereich des frontmost window von Cinderella zugeordnet.

Multitouch mit CindyScript programmieren¶

Multitouch-Eingabe für Geometrie-Software ist immer noch ein Forschungsbereich, und neben dem offensichtlichen Verhalten im Bewegungsmodus gibt es noch keine Benutzerinteraktionsstandards. Während wir an der Multitouch-Integration in anderen Modi für zukünftige Cinderella-Updates arbeiten werden, haben wir uns auch entschieden, die Multitouch-Ereignisse für CindyScript zugänglich zu machen.

Wenn Sie TUIO-Unterstützung im Inspector aktivieren, werden die Mausereignis-Slots Mouse Down, Mouse Up und Mouse Drag durch TUIO-Ereignisse statt durch reguläre Mausereignisse ausgelöst. Die mouse-Funktion meldet den Ort des Berührungsereignisses. Der mouse()-Ort ist eindeutig definiert, da jedes Berührungsereignis nur einen der mehreren Touches meldet. Dies impliziert, dass Sie sich nicht darauf verlassen können, dass aufeinanderfolgende Mausereignisse zur gleichen Geste gehören. Das ist ein Programmiereralptraum: Wie können Sie die verschiedenen Touches nachverfolgen und ihnen die richtigen Aktionen zuweisen? Für Ihre Bequemlichkeit enthält CindyScript das notwendige Werkzeug, wie wir unten beschreiben.

Variablen auf Touch-Ebene deklarieren: mtlocal(<var1>,<var2>,...)¶

Beschreibung: Alle Variablen, die als mtlocal deklariert sind, sind lokale Variablen für eine Berührungssequenz. Diese Funktion ist nur im Mouse Down-Slot nützlich. Wenn eine Variable als Touch-lokal definiert ist, wird für alle Berührungssequenzen eine eindeutige Instanz dieser Variablen erstellt. Wenn Sie dieselbe Variable im Mouse Drag-Slot oder Mouse Up-Slot verwenden, arbeiten Sie mit der Instanz dieser Variablen, die der Berührungs-Bewegungs-Freigabe-Sequenz zugewiesen ist.

Beispiel: Wir werden die Verwendung der mtlocal-Funktion mit einem kleinen Beispiel illustrieren. Durch Platzierung des folgenden Codes in den Draw-, Mouse Down-, Mouse Up- und Mouse Drag-Slots können Sie Polygone mit der Maus zeichnen. Während die Maus gedrückt ist, wird das neue Polygon rot gezeichnet, wenn die Maus freigegeben wird, wird das neue Polygon zu einer Liste von Polygonen hinzugefügt, die blau gezeichnet werden.

// In Draw:
forall(polygons,drawpoly(#));

// In Mouse Down:
polygon=[mouse()];

// In Mouse Drag:
polygon=polygon++[mouse()];
drawpoly(polygon,color->red(1));

// In Mouse Up:
polygons=polygons++[polygon];

Dieser Code beruht darauf, dass zuerst ein Polygon in Mouse Down erstellt wird, dann Punkte in Mouse Drag hinzugefügt werden, und schließlich ist das Polygon vollständig und wird zur Liste der Polygone in Mouse Up hinzugefügt.

Wenn derselbe Code in einer Multi-Touch-Umgebung ausgeführt wird, wird die (globale) Variable polygon für alle Touches verwendet. Auch wenn ein beliebiger Touch freigegeben wird, wird das neue Polygon zur Liste der Polygone hinzugefügt, aber immer noch werden andere Drag-Ereignisse Punkte dazu hinzufügen. Der Code ist nicht multitouch-kompatibel und wird kläglich fehlschlagen.

Durch das Hinzufügen eines einzelnen Aufrufs von mtlocal können wir den Code beheben:

// In Draw:
forall(polygons,drawpoly(#));

// In Mouse Down:
mtlocal(polygon); // make sure every touch gets its own polygon
polygon=[mouse()];

// In Mouse Drag:
polygon=polygon++[mouse()];
drawpoly(polygon,color->red(1));

// In Mouse Up:
polygons=polygons++[polygon];

Jetzt wird ein neues Polygon für jeden Touch erstellt, und die Drag- und Up-Ereignisse verwenden die korrekte Polygon-Variable, die der Geste zugeordnet ist.

Wenn Sie dieses Code-Beispiel ausprobieren, werden Sie feststellen, dass das Neuzeichnen der roten Polygone nicht wie erwartet funktioniert, da der Bildschirm bei jedem Ereignis automatisch gelöscht wird. Wir können das beheben, indem wir explizit eine Liste neuer Polygone speichern und sie nur im Draw-Ereignis zeichnen. Den fertigen Code finden Sie unten.

// In Draw:

forall(polygons,drawpoly(#));
forall(newpolygons,drawpoly(#,color->red(1)));

// In Mouse Down:
mtlocal(polygon);
polygon=[mouse()];
newpolygons=newpolygons++[polygon];

// In Mouse Up:
newpolygons=newpolygons--[polygon];
polygons=polygons++[polygon];

// In Mouse Drag:
newpolygons=newpolygons--[polygon];
polygon=polygon++[mouse()];
newpolygons=newpolygons++[polygon];

Alternativ könnten Sie Ebenen und das autoclear-Flag verwenden, um denselben Effekt zu erzielen, ohne alle neuen Polygone zu speichern.

Diese Seite wurde automatisch mit KI (Claude) übersetzt und wartet noch auf Überprüfung. → Alle KI-übersetzten Seiten