Teil 2: Alternatives Interface-Design

Let's party

Wir realisieren zwei unterschiedliche Anwendungen. Im Fall der Kamera versuchen wir durch möglichst viel Bewegung unsere Tanzlaune zu beweisen. Im zweiten Fall helfen wir durch laute Zurufe einem Basketballer beim Slam Dunk. Legen Sie einen neuen Film an und besorgen Sie sich ein Hintergrundmotiv aus einer Diskothekenszene. Platzieren Sie auf einer neuen Ebene darüber eine Skala auf grünen Strichen. Kopieren Sie die gesamte Skala, fügen Sie sie auf einer neuen Ebene exakt an der gleichen Stelle ein (Strg+Shift+V) und färben Sie sie rot.

Auf einer weiteren Ebene platzieren Sie ein Rechteck unterhalb der Skalen. Es muss so breit sein, dass es als Maske für die gesamte rote Skala dienen kann. Wandeln Sie diese Ebene zur Maskenebene um und das Rechteck zu einem Movieclip mit dem Instanznamen maske. Wechseln Sie jetzt zum Transformieren- Werkzeug und spiegeln Sie das Rechteck vertikal.

Nun erzeugen Sie in der Bibliothek ein neues Video, indem Sie mit der rechten Maustaste in die Bibliotheksfläche klicken. Nennen Sie es meinVideo, lassen Sie es per Actionscript steuern und behalten Sie die Standardmaße von 320 x 240 Pixel bei. Ziehen Sie es in einer weiteren Ebene auf die Bühne. Der Rest ist Actionscript im ersten Frame der Szene 1. Es ist überraschend kurz:

Sie können die anzeige auch auf der Bühne als dynamisches Textfeld sichtbar machen, dann sehen Sie, ob die Messung des aktivityLevel funktioniert.

Die Initialisierung des Video-Objekts enthält den Befehl Camera.get(). Der löst den Dialog aus und startet die Kommunikation mit dem System.

Die Variable wird nicht verwendet, aber ohne den Aufruf von onActivity verweigert die nächste Funktion ihren Dienst.

Der activityLevel schwankt zwischen 0 und 100. Die Höhe der Maske wird vom Wert der Variablen Anzeige bestimmt und vervierfacht. Da eine Vergrößerung der Höhe in Flash nach unten funktioniert, mussten wir die maske vorher spiegeln.

Der Ton macht das Spiel

Einen ganz ähnlichen Ansatz wählt unser drittes Interface-Experiment. Statt mit dem Bild einer Kamera arbeiten wir mit dem Mikrofon-Eingang. Auch in diesem Fall steuern wir die Y-Koordinate eines Objekts auf der Bühne. Wir helfen einem skizzierten Basketball-Spieler durch Zurufen dabei, so hoch zu steigen, dass er beim Slam-Dunk den Korb trifft.

Entwerfen Sie eine Sportszene, vielleicht wiederum mit einem Hintergrundbild von einem Basketballspiel. Zeichnen Sie einen Korb auf einer neuen Ebene und daneben einen Basketballspieler nebst Ball. Wandeln Sie jetzt den Basketballspieler mit dem Ball zu einem Movieclip namens air um und gehen Sie in dessen Bearbeitungsmodus. Nun machen Sie aus dem Ball ein eigenes Clip - aus dem Arm, der den Ball hält, ebenfalls. Da wir für beide Tweenings ansetzen, müssen Sie auf einer eigenen Ebene stehen. Auch der Rest des Körpers wird zum Movieclip.

Nun setzen Sie alle Elemente rechts neben die Bühne. Erzeugen Sie das Tweening so, dass der Spieler von rechts nach links über die Bühne fliegt und im Moment, wenn er den Korb erreicht mit dem Arm nach vorne rotiert. Dabei verlässt der Ball den Arm im 45-Grad-Winkel in Richtung Boden. Setzen Sie im ersten Schlüsselbild des Movieclips folgende drei Zeilen:

Kehren Sie nun zurück zu Szene 1. Um das Spielchen plastischer zu machen, benötigen wir Sound. Am besten vier Klänge: eine Hintergrundkulisse aus einem Sportstadion, einmal Jubel und Applaus, einmal enttäuschte Buh-Rufe und vielleicht noch ein hartes Schlaggeräusch, das den Treffer akustisch untermalt.

Importieren Sie die Sounds. Erzeugen Sie eine neue Ebene namens sound und ziehen Sie die Hintergrundkulisse auf die Bühne. In den Eigenschaften stellen Sie von stream auf Anfang um und definieren 99 Wiederholungen.

Jetzt erzeugen Sie ein neues Movieeclip (Einfügen/Neues Symbol) mit Namen sound. Der erste Frame bleibt leer und bekommt ein stop();. Im zweiten Frame ertönt der Buh-Ruf. Im dritten platzie- ren Sie das Schlaggeräusch und im vierten Schlüsselbild den Applaus. Setzen Sie alle drei Sounds in den Eigenschaften auf Anfang statt Stream.

Verlassen Sie den Bearbeitungsmodus und ziehen Sie den Soundclip auf die Bühne. Geben Sie ihm den Namen soundclip.

Erzeugen Sie nun auf einer neuen Ebene ein kleines Rechteck und wandeln Sie es zum Movieclip um. Das wird unser Treffer-Auslöser. Er bekommt den Instanznamen korbziel und liegt direkt auf dem oberen Rand des Korbs. Setzen Sie seinen Alphawert auf 0, sobald alles funktioniert. Kopieren Sie das Clip und fügen Sie es links unten im Bild erneut ein. Das ist der Auslöser für die Fallunterscheidung, welcher Sound zu spielen ist. Er bekommt den Instanznamen soundziel.

Als letztes Element benötigen wir einen Timer. Es ist ein neues Movieclip mit dem Instanznamen timer. Es hat exakt zwei Schlüsselbilder nämlich in Frame 1 und Frame 50. Auf der Bühne ist ein kleines dynamisches Textfeld zu sehen. Es reagiert auf die Variable zeit. In Frame 1 des Timerclips wird die Variable initialisiert:

In Frame 50 erfolgt der Countdown und die Entscheidung, ob der Basketballer gestartet werden soll. Timer und Basketballer starten sich immer gegenseitig.

Bringen Sie auch dieses Clip mit dem Instanznamen timer auf die Bühne. Nun fehlt noch Code in Frame 1 des Hauptfilms. Fügen Sie Folgendes ein:

Wir erzeugen das Trägerclip nicht in der Bibliothek, sondern per Actionscript.

Wir steuern die Y-Koordinate des Basketballers. Da die nach unten größer wird, müssen wir den Wert von einer gedachten Grundlinie subtrahieren. Die Verfünffachung erzeugt schön viel Bewegung.

Wurde ein Treffer erzielt, spielt das Soundclip die Frames 3 und 4, um dann in Frame 1 vom stop(); anzuhalten.