Name Thema Von
Menu_101_(c) Menü-Buttons über Animationen AFRLme


Dieses Tutorial zeigt dir, wie du Menü-Buttons über Animationen baust, indem du einem einzigen Szenenobjekt mehrere Animationen gibst. Ob die Animationen einen oder mehrere Frames haben, ist dir überlassen. Diese Methode ist deutlich eleganter als die Variante mit Bedingungen.

Anleitung

1. Lege zuerst eine neue Menüszene an.

2. Lege dann neue Szenenobjekte an, eines pro Button. Vergiss nicht, ihnen passende Namen zu geben.

Menu 101 c (1).png

Kurzer Tipp: Erstelle ein vorläufiges Hintergrundbild, das zeigt, wie das Menü mit allen Elementen aussehen soll, und setze es als Szenenhintergrund. Damit kannst du alle Bilder und Animationen leichter platzieren. Ersetze es am Ende durch den endgültigen Hintergrund.

3. Wähle eines der neuen Szenenobjekte, öffne den Reiter Animation und lege 2 Animationen an: eine für den inaktiven und eine für den aktiven Zustand des Buttons. Eine Animation mit einem Frame fügst du über dasAdd.pngSymbol hinzu, eine mit mehreren Frames über diesesAnim loadseq.pngSymbol.

4. Öffne die Eigenschaften (Anim properties disabled.png) der Animation und setze die Pause auf 999 (bei einer Animation mit einem Frame; bei mehreren Frames auf den Wert, den du brauchst). Hake unbedingt unendlich an, sonst wird die Animation nach der eingestellten Zahl an Wiederholungen automatisch entladen.

5. Vergiss zum Schluss nicht, jede Animation an die gewünschte Stelle auf dem Bildschirm zu schieben. Wie das geht, weißt du inzwischen sicher!

Menu 101 c (2).png Menu 101 c (3).png Menu 101 c (4).png

Kurzer Tipp Nr. 1: Nach einem Linksklick auf ein Bild oder eine Animation kannst du es mit den Pfeiltasten pixelgenau verschieben. Das geht viel leichter als nur mit der Maus.

Kurzer Tipp Nr. 2: Gibst du deinen Bildern fortlaufende Namen wie walk_left_(1), walk_left_(2), walk_left_(3) usw., kannst du sie über das Symbol Animationssequenz laden (Anim loadseq.png) als Folge von Frames in die Animation laden.

6. Öffne dann wieder den Reiter Eigenschaften jedes Szenenobjekts und lege die Animation für den inaktiven Zustand als Standard-Animation des Buttons fest.

Menu 101 c (5).png

7. Lege als Nächstes für jedes Szenenobjekt den Interaktionsbereich (Objektbereich) an. Klicke in der Werkzeugleiste auf Objektbereiche erstellen und bearbeiten und zeichne für jedes Szenenobjekt ein Polygon, möglichst einfach.

Menu 101 c (6).png

Kurzer Tipp: Hältst du beim Zeichnen der Polygone die Umschalttaste gedrückt, rasten die Linien in festen Winkeln ein. So ziehst du leicht gerade oder schräge Linien.

8. Zum Schluss legst du die Mausaktionen an, die zwischen aktivem und inaktivem Zustand wechseln. Wähle ein Szenenobjekt, öffne seinen Reiter Aktionen und lege eine Aktion Cursor betritt Objektbereich an. Füge darin die Aktionsteile Animation 'button-name_(inactive)' ausblenden und Animation 'button-name_(active)' abspielen ein. Lege dann eine Aktion Cursor verlässt Objektbereich an und mach dasselbe umgekehrt: Beim Verlassen blendest du den aktiven Zustand aus und zeigst wieder den inaktiven. Wiederhole das für jeden Button deines Menüs.

Menu 101 c (7).png Menu 101 c (8).png

Referenzvideo

Ressourcen

Name Beschreibung
menu_101_(c).zip (Datei nicht mehr verfügbar) Ein funktionierendes Beispiel zum Tutorial. Für die enthaltene .ved-Datei brauchst du Visionaire Studio 4.2.5+.