Abbildung 3.22: Änderung des Farbverlaufs von blau nach grün
Die Systematik von Animationen in WPF wird bei Betrachtung des
XAML-Quelltextes deutlich. Im Rumpf des XAML-Quelltextes unseres
Fensters ist innerhalb des Grids die in Listing 3.6 abgebildete
Passage zu finden.
Listing 3.6: XAML-Quelltext eines Rechtecks mit Verlaufsfüllung
Diese Passage lässt das Rechteck in seinem blauen Ursprungszustand
erscheinen. Weiter oben im XAML-Quelltext unserer Seite
und in Listing 3.7 ist die erstellte Animation auszumachen.
Listing 3.7: XAML-Quellcode einer animierten Farbe in einem Farbverlauf
Das in Listing 3.7 gezeigte Storyboard definiert die Werte, die
bestimmte Eigenschaften eines Elements an einern bestimmten
Zeitpunkt haben sollen.
Die Systematik von Animation in WPF beschreibt also nur Zeitpunkte,
an welchen beliebige Eigenschaften einen bestimmten Wert
angenommen haben sollen. Es sind keine Anfangswerte erforderlich!
Einzige Voraussetzung zur Animation einer Eigenschaft ist,
dass zuvor irgendein Wert gesetzt wurde.
Eine auf Auto gesetzte Höhe lässt sich nicht direkt animieren.
Doch Sie können mit einem Trick arbeiten, um es doch zu ermöglichen:
Belassen Sie die Höhe auf Auto und animieren Sie die
MinHeight. Dadurch erreichen Sie nahezu den gleichen Effekt,
ohne die automatische Höhe fest setzen zu müssen.
Auslöser in WPF
Wenn Sie die Anwendung mit der animierten Füllung des Rechtecks
im jetzigen Stadium über den Menübefehl Projekt/Projektmappe
testen oder die Taste [F5] starten, so wird die Animation, obwohl
wir noch keinen Startauslöser definiert haben, sofort automatisch
gestartet.
Dies ist ein Automatismus von Expression Blend, der für jedes neues
Storyboard sofort einen sogenannten Ausläser erstellt, der die Anwendung
anweist, direkt nach dem Start das Storyboard zu starten.
Zu sehen ist dieser automatisch erstellte Auslöser im Interaktionspanel
im Bereich Ausläser. Dort aufgeführt finden Sie das auslösende
Ereignis, nämlich Window.Loaded. Wenn Sie darauf klicken,
werden, wie in Abbildung 3.23 dargestellt, die mit diesem Ereignis
verknüpften Anweisungen angezeigt.
Zum Arbeiten mit den Auslösern empfiehlt es sich, über den Menübefehl
Fenster/Aktiver Arbeitsbereich/Designarbeitsbereich oder die
Taste [F6] in den Designarbeitsbereich zu wechseln.
SELFPHP
SELFPHP OHG, info@selfphp.de, Impressum, Kontakt