Bewegungslehre
-> Verwendung von Bezierkurven
Eine Bezierkurve ist mathematisch gesehen eine relationale Funktion
3.Grades.
Wir kennen sie vorallem durch Vektorgrafiken: eine Kurve, die durch
2 Endpunkte und 2 Handlern bestimmt wird.
Bezierkurven eignen sich hervorragend für Animationen! Um ein Sprite
entlang einer Bezierkurve entlang maschieren zu lassen, braucht man sich
gar nicht tief in die Mathematik einarbeiten.
4 Formeln kopieren, und das wars auch schon. |
|
Aber zunächst mal ein Blick auf die Formeln:
Ein Punkt Pt auf der Kurve wird duch den Wert t bestimmt, der von 0
bis 1.0 gesetzt werden darf.
Die Werte A, B und C werden durch die Punkte der Bezierkurve P0, P1,
P2 und P3 errechnet.
In weiterer Folge habe ich ein Parent-Script gebastelt,
welches diese Formeln enthält, aber für den täglichen Hausgebrauch
in einfachere Handler umgebaut ist:
"StartBezier" -- um eine neue Bewegung entlang einer
Bezierkurve zu initialisieren
"FollowBezier" -- um die Animation fortschreiten zu lassen
(Das Parent-Script ist in den folgenden Beispielen enthalten,
falls es jemand verwenden möchte.)
Die erste Übung sollte darin bestehen, die Formel einmal
simpel anzuwenden, also das Sprite einmal korrekt entlang der Kurve wandern
zu lassen.
|
|
|
In weiterer Folge ist es schon recht einfach, an jede Bezierkurve eine
neue anzuhängen: der neue Arm P0-P1 ist lediglich ein Spiegelbild
vom letzen Arm P3-P2. Läßt man den neuen Endpunkt random-mäßig
berechnen, so erhält man eine endlose Bewegung am Bildschirm.
Anwendungsgebiete: Bienenschwärme, Wubberblasen, gelangweilte Cursor,
was auch immer... :-)
|
|
|
Ein weiteres Anwendungsbeispiel ohne Worte...
|
|
Natürlich müssen die notwendigen Punkte einer
Bezierkurve nicht frei erfunden sein, sondern man kann vorhandene Vectorshapes
als Vorlage benutzen:
Ebenso ist es auch möglich, eine Bezierkurve bzw. einen vorhandenen
Vectorshape als "Slider" zu verwenden.
Ein möglicher Trick dabei ist, sich zu Beginn
eine betimmte Anzahl von Punkten auf der Kurve ausrechnen zu lassen und
in einer linearen Liste aufzubewahren.
In weiterer Folge wird überprüft, ob der nächste
oder vorherige Punkt in der Liste näher zur Maus ist, um das Sprite
in die entsprechende Richtung zu bewegen.
|
|
|