Pastor Pixel Tipps Tutorial Anleitungen Hilfe

Bones / inverse Kinematik

Inverse Kinematic Adobe

Siehe auch folgenden Arbeiten mit Inverser Kinematik (Adobe)

Referenzen IK-Armature

Adobe Bones Flash CC

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.

IK Form / Bones und Formgrafiken

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.

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

 

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

Movieclips mit Bones verbinden

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.

Bewegung einschränken

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.

Verändern eines Skeletts

Um einen Movieclip samt Bones und Gelenk zu verschieben, halte zuerst die Alt Taste gedrückt und verschiebe es dann mit linker Maustaste.

Mehrere Movieclips kann man mit gedrückter Shift Taste auswählen. Anschließend kann man sie mit gedrückter Alt Taste und linker Maus verschieben.

Um das gesamte Skelett mit allem Zip und Zap neu zu positionieren, wähle es komplett mit einem Auswahlrahmen aus und verschiebe es mit Alt und linker Maustaste.

Um die Position des Gelenk- oder Drehpunktes zu verschieben, klicke den MC mit dem Transformieren Werkzeug an und verschiebe den Dreh- oder Transformationspunkt.

Federung

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.

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

Videotutorial Bones

 

 

Tweening mit Bones

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.

Die gesamte Figur verschiebe folgendermaßen.

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.

Verschiebe ein Posenbild auf folgende Weise.

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.

Bones Actionscript

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.

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

 

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

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

 

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;
}

Rad Mechanik

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.

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

 

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.

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

 

Mechanik mit localToGlobal

Hier noch ein anderer Lösungsansatz. Es gibt ein sich drehendes Rad, darin befindet sich ein Movieclip dessen Position mit localToGlobal übersetzt wird.

Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.

Adobe Flash Player herunterladen

 

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);

}