Siehe auch folgenden Arbeiten mit Inverser Kinematik (Adobe)
Referenzen IK-Armature
Mit dem Bones Tool, welches ab Flash CS4 existiert, kann man ein Knochengerüst mit Gelenken erstellen, ähnlich wie man es von 3D Programmen kennt. Es gibt 2 Arten das Bonestool einzusetzen, einmal auf Formgrafiken, um die Formgrafik zu verbiegen. Die zweite Möglichkeit, man verbindet Movieclips, so dass zwischen den Movieclips Gelenke entstehen.
Die erste, einfache Art funktioniert folgendermaßen. Man erstellt eine ungruppierte Grafik und zieht dann mit dem Bonestool einzelne Strecken von Punkt zu Punkt. Die Punkte bestimmt man selber. Jeder Punkt wird zu einem Gelenk. Die Grafik verformt sich dann entsprechend wenn man sie mit dem Auswahlwerkzeug an einer Stelle anfasst und bewegt. Achtung! Wenn die Formgrafik aus mehreren Farbelementen und Linien besteht, muss man vorher ein Auswahlrechteck aufziehen, bevor man das Bonestool benutzt.
Eine Animation erstellt man indem ein paar Bilder in der Zeitleiste einfügt und dann in einzelnen Bildern/ Frames die Bones verändert, verdreht, verschiebt.
In der kleinen Anleitung unten werden die wichtigsten Schritte erläutert.
Bone mit Auswahlwerkzeug anklicken, um die Form zu verbiegen.
Bone mit Bindunsgwerkzeug (Untermenü des Bonewerkzeugs) anklicken. Alle Punkte, die mit dem Bone verbunden sind, werden gelb dargestellt. Die 4eckigen sind nur mit diesem ausgwählten Bone verbunden, die dreieckigen sind auch mit anderen Bones verbunden. Verbunden heißt, an diesem Kurvenknotenpunkt ändert sich die Form, wenn man den Bone verändert. Klicke mit gedrückter Strg Taste auf einen gelben Punkt, um die Verbindung zu lösen. Um einen nicht verbundenen Punkt hinzuzufügen klicke ihn auch mit gedrückter Strg Taste an.
Mit dem Bindungswerkzeug kann man auch einen Punkt anklicken und man sieht alle Bones, die damit verbunden sind, als gelbe Linie.
Klicke mit dem Unterauswahlwerkzeug auf den Rand und auf einen Punkt. Es erscheint ein roter Punkt mit Anfassern. Diese Anfasser an beiden Seiten kann man verlängern und verkürzen, drehen. Mit gedrückter Alt Taste kann man die Richtung der Anfasser ändern, so dass ein spitzer Knotenpunkt entsteht. Sollte man keine Anfasser haben, kann man den Punkt anklicken und die Anfasser herausziehen. Der Punkt lässt sich auch komplett verschieben oder mit der Entf Taste löschen.
Klicke mit dem Unterauswahlwerkzeug auf das Ende eines Bones und verschiebe den Punkt, um den Bone neu zu positionieren.
Die Bewegung kann einerseits innerhalb einer Tweening Animation stattfinden, oder der User hat die Möglichkeit mit gedrückter Maustaste eine Bewegung auszuführen. Wähle dazu das Bild in der Zeitleiste aus, in der das Skelett hinterlegt ist und wähle im Eigenschaftenfenster: Optionen / Typ / Laufzeit für die Userbewegung, oder stattdessen Authoringzeit wenn die Bewegung per Tweening erzeugt wird.
Bones die einzelne MCs verbinden, lassen sich ohne weiteres zur Laufzeit bewegen. IK-Formen die in ungruppierten Grafiken erstellt werden müssen, wenn Sie zur Laufzeit bewegt werden sollen noch mit Actionscript versehen werden. Siehe unten.
Zum Thema Elastizität bei IK Bones siehe auch die Adobe Hilfe
Um beispielsweise eine bewegliche Figur zu erstellen, erzeuge für jedes Körperteil einen Movieclip. Schiebe Instanzen aller Gliedmaßen und Körperteile auf die Bühne. Verbinde die Körperteile mit dem Bonestool. Benutze auch Platzhaltermovieclips, die lediglich dem Skelettaufbau dienen.
Sobald man mit dem Bonestool eine Verbindung erstellt hat, ändert sich die Reihenfolge der MC Instanzen. Außerdem wird beim ersten Mal eine extra Skelettebene erzeugt, auf dem die verbundenen MC- Instanzen mit den Bones liegen. Ändere die Ebenenreihenfolge, um die Bones besser mit den Instanzen verbinden zu können. Man kann zu jeder Zeit auch die Reihenfolge der übereinanderliegenden Movieclips ändern (Modifizieren, Anordnen, ...)
Man kann auch im Nachhinein weitere Movieclips auf eine andere Ebene legen und dann von der Skelettebene aus einen Bone mit diesem neuen Movieclip verbinden. Der Movieclip wird dann auf die Skelettebene verschoben.
Klicke auf einen Bone, um das Gelenk in der Rotation oder einer anderen Eigenschaft einzuschränken oder zu deaktivieren. Nehme diese Einstellungen im Eigenschaftenfenster vor. Die Option "Geschwindigkeit" simuliert die Schwere eines Gelenks. Ein hoher Geschwindigkeitswert stellt ein Gelenk dar, welches sich leicht bewegen lässt (z.B.: ein Fingergelenk) Ein niedriger Wert wird bei einem Gelenk eingesetzt, welches sich schwerer bewegen lässt (Hüfte, Schulter beispielsweise).
Mittels der Option "Fixieren" kann man ein Gelenk innerhalb einer Animation festsetzen und in einer anderen "Pose" (Schlüsselbild) wieder lösen.
Alle Veränderungen des Skeletts, wie Neupositionierung der Elemente oder der Drehpunkte kann man mit dem Transformieren Werkzeug vornehmen.
Um einen Movieclip samt Bones und Gelenk zu verschieben, benutze das Transformieren Werkzeug
Mehrere Movieclips kann man mit gedrückter Shift Taste auswählen. Anschließend kann man sie mit dem Transformieren Werkzeug verschieben.
Um das gesamte Skelett mit allem Zip und Zap neu zu positionieren, ziehe mit dem Transformieren Werkzeug einen Rahmen auf und verschiebe es.
Um die Position des Gelenk- oder Drehpunktes zu verschieben, klicke den MC mit dem Transformieren Werkzeug an und verschiebe den Dreh- oder Transformationspunkt.
Man kann die Bones mit einer Federung versehen. Dazu klickt man in das erste Schlüsselbild einer Skelettebene und aktiviert im Eigenschaftenfenster ganz unten "Federn". Anschließend kann man die Bones auswählen und ihnen in Eigenschaftenfenster eine Stärke und Dämpfung zuweisen. Durch Doppelklick auf einen Bone sind alle Bones ausgewählt, um allen den gleichen Wert zuzuweisen.
Ich habe festgestellt, dass es am einfachsten ist, die Federung zuerst zu deaktivieren, dann die gewünschte Position der Bones in der Skelettebene in einem Schlüsselbild festzulegen und anschließend die Federung zu aktvieren.
Im folgendem Videotutorial werden die Grundlagen des Flash Bones- tools erkärt und zwar wird eine bewegliche Figur erstellt, wie man sie folgenden Flashfilm sieht.
Erstelle eine Figur wie oben beschrieben. Klicke in ein Bild in der Zeitleiste in der Skelettebene mit rechter Maustaste und wähle Pose hinzufügen und verschiebe die einzelnen Teile der Figur.
Ziehe mit dem Auswahlwerkzeug ein Auswahlrechteck um die gesamte Figur auf. Halte dann die Alt Taste gedrückt, klicke auf einen der Bones mit linker Maustaste und verschiebe die komplette Figur.
Markiere ein einzelnes Posenbild mit gedrückter Strg Taste. Klicke das Bild ohne Strg Taste nochmals an, halte die Maustaste gedrückt, um es zu verschieben. Es ist das gleiche Prozedere wie bei Schlüsselbildern. Ein schon markiertes Bild kann man nochmals anklicken und verschieben.
Siehe auch das Video Walk Cycle von Alan Becker
Siehe auch folgenden Arbeiten mit Inverser Kinematik (Adobe)
Referenzen IK-Armature
Achtung, bei allen Actionscriptbeispielen, wähle die Skelettebene aus und wähle im Eigenschaftenfenster/ Typ: "zur Laufzeit"
Erzeuge eine Formgrafik mit Bones. Klicke in die Skelettebene und wähle im Eigenschaftenfenster Typ: "Zur Laufzeit". Füge das Actionscript welches unten aufgeführt ist im Actionfenster ein. Ersetze Skelett_2 durch den Namen deiner Skelettebene. Ersetze ikBoneName7 durch den Namen des letzten Bones, der sich an der Mausposition orientieren soll. Der Name des Bones erscheint im Eigenschaftenfenster, wenn man ihn auswählt. Selbstverständlich kann die Position auch etwas anderes als die Mausposition sein.
import fl.ik.*;
var tree:IKArmature = IKManager.getArmatureByName("Skelett_6");
var bone:IKBone = tree.getBoneByName("ikBoneName21");
var tJ:IKJoint = bone.tailJoint;
var posT: Point=tJ.position;
var ikMover:IKMover = new IKMover(tJ, posT);
trace(posT.x);
trace(posT.y);
addEventListener(Event.ENTER_FRAME, onFrame);
function onFrame(event:Event){
posT.x=mouseX;
posT.y=mouseY;
ikMover.moveTo(posT);
}
Hier das gleiche nochmal mit mehreren IK Skeletten
import fl.ik.*;
var tree:IKArmature = IKManager.getArmatureByName("Skelett_2");
var bone:IKBone = tree.getBoneByName("ikBoneName7");
// to use headJoint or tailJoint
var tJ:IKJoint = bone.headJoint;
var posT:Point = tJ.position;
var ikMover:IKMover = new IKMover(tJ,posT);
var tree2:IKArmature = IKManager.getArmatureByName("Skelett_4");
var bone2:IKBone = tree2.getBoneByName("ikBoneName14");
var tree3:IKArmature = IKManager.getArmatureByName("Skelett_6");
var bone3:IKBone = tree3.getBoneByName("ikBoneName21");
var tree4:IKArmature = IKManager.getArmatureByName("Skelett_8");
var bone4:IKBone = tree4.getBoneByName("ikBoneName28");
var tree5:IKArmature = IKManager.getArmatureByName("Skelett_10");
var bone5:IKBone = tree5.getBoneByName("ikBoneName35");
var tJ2:IKJoint = bone2.headJoint;
var posT2:Point = tJ2.position;
var ikMover2:IKMover = new IKMover(tJ2,posT2);
var tJ3:IKJoint = bone3.headJoint;
var posT3:Point = tJ3.position;
var ikMover3:IKMover = new IKMover(tJ3,posT3);
var tJ4:IKJoint = bone4.headJoint;
var posT4:Point = tJ4.position;
var ikMover4:IKMover = new IKMover(tJ4,posT4);
var tJ5:IKJoint = bone5.headJoint;
var posT5:Point = tJ5.position;
var ikMover5:IKMover = new IKMover(tJ5,posT5);
addEventListener(Event.ENTER_FRAME, onFrame);
function onFrame(event:Event)
{
posT.x = fisch.x;
posT.y = fisch.y;
ikMover.moveTo(posT);
ikMover2.moveTo(posT);
ikMover3.moveTo(posT);
ikMover4.moveTo(posT);
ikMover5.moveTo(posT);
fisch.x -= (fisch.x - mouseX) * 0.1;
fisch.y -= (fisch.y - mouseY) * 0.1;
}
Das folgende Beispiel entspricht in etwa dem Beispiel von Adobe. Ich habe jedoch die Animation des Rades vereinfacht, durch eine simple Erhöhung der rotation Eigenschaft. Das Rad dreht sich onEnterFrame Wheel.rotation += 2;
Das Rad befindet sich auf einer Ebene und hat den Instanznamen "Wheel".
Die Achse ist eine Skelettebene, sie besteht aus 2 Balken (Movieclips) und einem kleinen Kreis (Movieclip) am Ende. Die 3 Instanzen wurden mit 2 Bones verbunden. Der letzte Bone, welcher auf den Kreis verweist hat den Namen ikBoneName9. Die Skelett Ebene hat den namen Skelett_6 Vergessen Sie nicht im Eigenschaftenfenster unter Typ, "Laufzeit" einzugeben.
Der Punkt auf dem Rad, der quasi mit letzten Bone verbunden ist, wird bestimmt durch die Zeilen
var mat:Matrix = Wheel.transform.matrix;
var pt = new Point(70, 0);
Durch die beiden Parameter der Konstruktorfunktion von Point new Point(70,0), wird definiert, an welcher Stelle die Achse auf dem Rad verbunden ist. Die beiden Werte sind die horizontale und vertikale Entfernung vom Registrierpunkt des Rades.
import fl.ik.*
var tree:IKArmature = IKManager.getArmatureByName("Skelett_6");
var bone:IKBone = tree.getBoneByName("ikBoneName9");
var endEffector:IKJoint = bone.tailJoint;
var pos:Point = endEffector.position;
var ik:IKMover = new IKMover(endEffector, pos);
ik.limitByDistance = true;
ik.distanceLimit = 0.1;
ik.limitByIteration = true;
ik.iterationLimit = 10;
Wheel.addEventListener(Event.ENTER_FRAME, frameFunc);
function frameFunc(event:Event)
{
Wheel.rotation += 5;
if (Wheel != null)
{
var mat:Matrix = Wheel.transform.matrix;
var pt = new Point(70, 0);
pt = mat.transformPoint(pt);
ik.moveTo(pt);
}
}
Das gleiche Beispiel mit x Versatz.
Hier noch ein anderer Lösungsansatz. Es gibt ein sich drehendes Rad, darin befindet sich ein Movieclip dessen Position mit localToGlobal übersetzt wird.
import flash.events.Event;
import fl.ik.*;
var tree:IKArmature = IKManager.getArmatureByName("Skelett_4");
var bone:IKBone = tree.getBoneByName("ikBoneName9");
var tJ:IKJoint = bone.tailJoint;
var posT:Point = tJ.position;
var ikMover:IKMover = new IKMover(tJ,posT);
ikMover.limitByDistance = true;
ikMover.distanceLimit = 0.1;
ikMover.limitByIteration = true;
ikMover.iterationLimit = 10;
var quellPunkt:Point = new Point(0,0);
var stagePoint:Point;
rad.addEventListener(Event.ENTER_FRAME, lochPos);
function lochPos(evt:Event)
{
rad.rotation += 1;
stagePoint = rad.loch.localToGlobal(quellPunkt);
posT.x = stagePoint.x;
posT.y = stagePoint.y;
ikMover.moveTo(posT);
}