Homepage-Webhilfe Event-Banner

Event-Handling

Unter Event-Handling versteht man das Reagieren auf verschiedene Ereignisse. Bei einem Ereignis kann es sich z. B. um einen Mausklick, eine Mausbewegung, einen Tastendruck oder etwas anderes handeln. Registriert werden diese Events mittels der Funktion addEventListener() des jeweiligen Objekts. Vielleicht erinnern Sie sich noch an folgende Zeile, welche sich im Konstruktor der Main-Klasse befindet:

addEventListener(Event.ADDED_TO_STAGE, init);

Dabei handelt es sich um die sogenannte Registrierung des Events. Der Funktion addEventListener() wird eine Zeichenkette übergeben, welche den Namen des Ereignisses trägt. Dabei wird zumeist nicht die Zeichenkette direkt angegeben, sondern lediglich eine statische Konstante verwendet. Der zweite Parameter gibt eine Referenz zu einer Funktion an. Bei einer Funktionsreferenz wird lediglich der Name der Funktion (ohne runde Klammern) angegeben. Aus diesem Grund haben die Event-Funktionen (auch als Event-Handler bezeichnet) und auch andere Funktionen, die mit einer Referenz angegeben bzw. übergeben werden, immer einen festgelegten Aufbau an Parametern und dem Rückgabewert. Alle Event-Funktionen haben keinen Rückgabewert und besitzen einen Parameter, der sich je nach Event vom Typ unterscheidet. Bei allen Event-Funktionen handelt es sich jedoch um ein Objekt der Basisklasse Event. In dem Objekt der Klasse Event lässt sich über die Eigenschaft target das Element, welches das Ereignis ausgelöst hat, abfragen.

Um ein Event zur Laufzeit zu deregistrieren, können wir die Funktion removeEventListener() aufrufen. Als Parameter werden der Funktion die gleichen Parameter wie der Funktion addEventListener() übergeben. Auch einen solchen Aufruf haben wir bereits in der Event-Funktion init() gesehen:

removeEventListener(Event.ADDED_TO_STAGE, init);

Wichtig: Wird z. B. für einen Button ein Klick-Event registriert, so löst das Ereignis nur aus, wenn auf den Button geklickt wurde, nicht aber, wenn außerhalb des Buttons geklickt wird.


Die Maus bietet einige Events, welche sich generell in zwei Gruppen aufteilen lassen: Maustasten und Mausbewegung. Für die Maustasten gibt es die Events CLICK, MOUSE_DOWN und MOUSE_UP. Alle diese genannten Konstanten sind statische Konstanten der Klasse MouseEvent, von welcher auch ein Objekt des Event-Handlers als Parameter übergeben wird. MOUSE_DOWN löst aus, sobald die Taste einer Maus gedrückt wurde. MOUSE_UP löst beim Loslassen der Maustaste aus. Das CLICK-Ereignis tritt nach diesen beiden Ereignissen auf und wird am häufigsten verwendet (z. B. bei Buttons). Alle diese drei Ereignisse lösen leidglich bei Verwendung der linken Maustaste aus. Für die rechte Maustaste gibt es stattdessen die Events RIGHT_CLICK, RIGHT_MOUSE_DOWN und RIGHT_MOUSE_UP. Für die mittlere Maustaste stehen uns die Events MIDDLE_CLICK, MIDDLE_MOUSE_DOWN und MIDDLE_MOUSE_UP zur Verfügung.

Um die Bewegung der Maus zu erkennen, stehen uns die Events MOUSE_MOVE und MOUSE_OUT zur Verfügung. Das Ereignis des MOUSE_MOVE-Events tritt ein, wenn Sie den Mauszeiger innerhalb eines Elements bewegen. MOUSE_OUT tritt ein, wenn der Cursor das Element verlässt. MOUSE_OUT kann im unteren Beispiel nicht verwendet werden, da wir im Beispiel die Events an die stage-Variable knüpfen. Die stage-Variable verweist auf das Objekt der Stage-Klasse und stellt die Präsentationsoberfläche bzw. die sogenannte Bühne dar. Um festzustellen, ob unsere Maus die Bühne verlassen hat, können wir das Event MOUSE_LEAVE registrieren. Das MOUSE_LEAVE-Event gehört zu den Basis-Events (Klasse Event). Das MOUSE_OUT-Event kann also lediglich dann verwendet werden, wenn es in Kombination mit einem Element verwendet wird, welches nicht die gesamte Fläche der Bühne ausfüllt. Somit könnte das Event auch nicht an die Main-Klasse registriert werden, da dieses Sprite-Element die gesamte Bühne ausfüllt.

Bei allen Maus-Events (ausgenommen MOUSE_LEAVE) wird dem Event-Handler ein MouseEvent-Objekt als Parameter übergeben. Mittels dessen Eigenschaften stageX und stageY können wir die Position der Maus innerhalb der Bühne feststellen. Über die Eigenschaften altKey, ctrlKey und shiftKey kann der Status der Tasten ALT, CTRL / STRG und SHIFT abgefragt werden.

private function init(e:Event = null):void 
{
	removeEventListener(Event.ADDED_TO_STAGE, init);
	
	stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
	stage.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
	stage.addEventListener(Event.MOUSE_LEAVE, onMouseLeave);
	stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
	stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
	stage.addEventListener(MouseEvent.CLICK, onMouseClick);
}

private function onMouseMove(e:MouseEvent):void
{
	trace("Maus wurde bewegt (X: " + e.stageX + ", Y: " + e.stageY + ")");
}

private function onMouseOut(e:MouseEvent):void
{
	// Dieses Ereignis tritt im obigen Fall niemals ein!
	trace("Maus hat Bereich verlassen");
}

private function onMouseLeave(e:Event):void
{
	trace("Maus hat Applikation verlassen");
}

private function onMouseDown(e:MouseEvent):void
{
	trace("Maustaste wurde gedrückt");
}

private function onMouseUp(e:MouseEvent):void
{
	trace("Maustaste wurde losgelassen");
}

private function onMouseClick(e:MouseEvent):void
{
	trace("Mausklick wurde ausgeführt");
}

Ausgabe:

Maus wurde bewegt (X: 2, Y: 5)
Maus wurde bewegt (X: 7, Y: 7)
[...]
Maustaste wurde gedrückt
Maustaste wurde losgelassen
Mausklick wurde ausgeführt
Maus wurde bewegt (X: 57, Y: 22)
Maus wurde bewegt (X: 58, Y: 22)
Maus wurde bewegt (X: 60, Y: 22)
[...]
Maus wurde bewegt (X: 90, Y: 5)
Maus wurde bewegt (X: 92, Y: 3)
Maus hat Applikation verlassen
Download

Für die Tastatur bzw. deren Tasten gibt es zwei wichtige Ereignisse: KEY_DOWN und KEY_UP. KEY_DOWN tritt ein, wenn eine Taste gedrückt wird, KEY_UP hingegen, wenn diese wieder losgelassen wird. Wie Ihnen ja sicherlich schon aufgefallen ist, werden Zeichen doppelt in einem Dokument eingegeben, wenn Sie auf der Taste bleiben (ohne diese zwischenzeitlich loszulassen). Dies ist nicht nur beim Schreiben von Dokumenten so, sondern es handelt sich vielmehr um eine Standardfunktion vom Betriebssystem. Man spricht hier auch von der Anschlagverzögerung. Dies wendet sich auch auf die Ereignisse aus, so wird z. B. das KEY_DOWN-Event auch öfters ausgelöst, wenn Sie auf der Taste bleiben. KEY_UP dagegen löst lediglich einmal aus (nachdem die Taste losgelassen wird).

Bei beiden Ereignissen wird als Event-Objekt ein Objekt der Klasse KeyboardEvent übergeben. Die Eigenschaft charCode enthält den Code des Zeichens, welches eingegeben wurde. Die Eigenschaft keyCode hingegen enthält den Code der Taste, welche gedrückt bzw. losgelassen wurde. Mittels der Eigenschaften altKey, ctrlKey und shiftKey lässt sich der Status der Tasten ALT, CTRL / STRG und SHIFT abfragen.

private function init(e:Event = null):void 
{
	removeEventListener(Event.ADDED_TO_STAGE, init);
	
	stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
	stage.addEventListener(KeyboardEvent.KEY_UP, onKeyUp);
}

private function onKeyDown(e:KeyboardEvent):void
{
	trace("onKeyDown: " + String.fromCharCode(e.charCode) + " (" + e.charCode + ") " + (e.ctrlKey ? "CTRL " : "") + (e.altKey ? "ALT " : "") + (e.shiftKey ? "SHIFT " : ""));
}

private function onKeyUp(e:KeyboardEvent):void
{
	trace("onKeyUp: " + String.fromCharCode(e.charCode) + " (" + e.charCode + ") " + (e.ctrlKey ? "CTRL " : "") + (e.altKey ? "ALT " : "") + (e.shiftKey ? "SHIFT " : ""))
}

Ausgabe:

onKeyDown: H (72) SHIFT
onKeyUp: H (72) SHIFT
onKeyUp:  (0)
onKeyDown: a (97)
onKeyUp: a (97)
onKeyDown: l (108)
onKeyUp: l (108)
onKeyDown: l (108)
onKeyUp: l (108)
onKeyDown: o (111)
onKeyUp: o (111)
onKeyDown:  (0) SHIFT
onKeyDown: ! (33) SHIFT
onKeyUp: ! (33) SHIFT
onKeyUp:  (0)
Download
Um unsere Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu. Weitere Informationen OK