Der perfekte Button mit Flash3

Thema:
Der perfekte Button mit Flash3
Description:
Verbesserte animierte Schaltflächen
Keywords:
Flash, Schaltflächen, Button, Tell Target
Author:
Dominik Förderreuther
Date:
22.12.1999
Doc-ID:
25-001
URL:
http://www.flashworker.de/tutorial/25/001.html
Version:
1.0
Änderungen:
keine
Anforderungen:
Flash 3
Vorkenntnisse:
Flash Grundkenntnisse


Download:
PC: "perfectbutton.zip", 47 kB
FLA: "perfectbutton.fla", 29 kB

Einleitung

Das Tutorial




Einleitung

Normalerweise macht man bei einem animierten Button eine unsichtbare Schaltfläche über eine Animation. Die Schaltfläche steuert dann per tell target die Animation. Allerdings springt die Animation dann immer an den Anfang und läuft vorwärts ab, oder ans Ende und läuft rückwärts ab (gespiegelte Frames). Das wird leider bei schnellerem hin- und herfahren der Maus sehr ruckelig und wirkt nur im "Idealfall" harmonisch, nämlich wenn der User über den Button fährt, und diesen erst verlässt, wenn die Animation bis zum Ende abgelaufen ist.

Macht man allerdings einen Steuerungsfilm, der einen "play reverse" Befehl simuliert, lässt sich der Button sehr gleichmäßig animieren. Da die einzelnen Bilder der Animation für das Rückwärtsspielen hier nicht gespiegelt werden, wird die Dateigröße auch etwas kleiner.









Das Tutorial

Wir erstellen den gewünschten Button als Animation. Das erste und das letzte Schlüsselbild der Animation muß den Befehl Stop erhalten (es empfiehlt sich grundsätzlich, alle Befehle in eine extra Ebene zu platzieren). Der Animation geben wir den Instanznamen "button1". Eine Ebene höher zeichnen wir eine Fläche, in Form des gewünschten Hit Bereichs. Diese Fläche definieren wir als Schaltfläche und schieben im Bearbeitungsmodus der Schaltfläche das Schlüsselbild in der Zeitleiste von "Normal" nach "Aktiv", damit ist die Schaltfläche unsichtbar. Der Schaltfläche geben wir den Befehl


On (Roll Over)

      Begin Tell Target ("/button1")

            Play

      End Tell Target

End On

womit der erste Schritt zum perfekten Button erledigt ist. Jetzt brauchen wir den Steuerungsfilm, der den "play reverse" Befehl simuliert. Dazu erstellen wir eine Animation aus drei Bildern. Das erste Bild erhält den Befehl

Stop
, das zweite

Begin Tell Target ("/button1")

      Go to Previous Frame

End Tell Target

und das dritte

Go to and Play (2)

. Dieser Animation geben wir den Instanznamen "rückwärts".

 

Die unsichtbare Schaltfläche erweitern wir jetzt um die Befehle


On (Roll Over)

      Begin Tell Target ("/rückwärts")

            Go to and Stop (1)

      End Tell Target

End On

On (Roll Out)

      Begin Tell Target ("/rückwärts")

            Go to and Play (2)

      End Tell Target

End On

und fertig ist der perfekte Button :)