*     Kieselsteine Tutorial *


Figuren Tutorial   | Tutorial zu Pfaden   | Tutorial für Masken   | Tween's
Button's   | MovieClip   | Cinema 4d   |

Blender 2.5 VideoTutorials

FlashVideoTutorials

Video Tutorials

HTML, CSS, javaScript

Webseite der Kieselsteine

Kieselsteine Blog

Seite 1   |    Seite 2   |    Seite 3   |    Seite 4   |    Seite 5   |    Seite 6

Die Fla's zum herunterladen
rechts klicken und Ziel speichern unter wählen.

move7.fla
schneeTest.fla


Tutorial über MovieClip
Zum Thema attachMovie()
move7.fla:
                           

Die Geschichte mit dem attachMovie() ist etwas komplexer.
Die eigentliche Idee dahinter ist einfach. Es soll möglich sein ein Objekt, dass in der Bibliothek ist, mittels ActionScript während des Films auf die Bühne zu holen.
Um jemanden zu rufen, braucht er einen Namen. Bis jetzt haben wir Instanzen von MovieClip angesprochen mit ActionScript. Dazu bekam jede Instanz einen eigenen Namen unten im Eigenschaftsfenster. attachMovie() kann auf keinen InstanzenNamen zurückgreifen, da noch keine Instanz da ist. Der Name in der Bibliothek muss zuerst "freigeschaltet" werden für ActionScrip 2. Dazu klicktst Du in der Bibliothek mit der rechten Maustaste auf den MovieClip, den Du später mit ActionScript auf die Bühne ziehen möchtest.
Es geht ein Menu auf (siehe Bild 9 unten)
Bild 10:

Bild 11:
Bild 9:


setzte bei Export für ActionScript ein Häcklein. (bild 10 oben)
Flash füllt Dir den nötigen Rest selber aus und wählt den Namen den Du dem MovieClip in der Bibliothek gegeben hast auch für den ExportNamen oder vielleicht verständlicher für den Rufnamen. (bild 11 oben)
bestätige mit "ok"

Wie Du vielleicht dem move7.fla oben schon ansehen kannst, kannst Du jetzt beliebig viele Instanzen von diesem MovieClip während Deines Filmes auf die Bühne setzen und schauckeln lassen. Ein Schneefall mit nur einer Flocke wäre auch etwas mager. (-;

Um die Flocken zu rufen vertrauen wir hier nicht auf Frau Holle, sondern bauen einen sogenannten runer, zu deutsch einen "Renner" oder noch deutscher einen Läufer.

Leider versteckt sich der an sich schon unsichtbare (nur weisser punkt zu sehen) leere Läufer MovieClip im Beispiel auch noch unter dem oberen Rahmen. Stelle die Ebene Rahmen beim Auge mit dem roten Durchstrichensymbol also auf unsichtbar, damit der runer zum Vorschein kommmt.

Stelle Dir einen runer vor wie eine art Maschine.
Sie rennt und rennt, immer schön im Kreise herum, oder etwas englischer in einem Loop.
Auf ihrem ersten Schlüsselbild erteilt sie Deinem Projekt Anweisungen und rennt wieder den Loop druch, nur um in einer bestimmten Zeit wieder auf das erste Schlüsselbild zu gelangen, um dort wieder die dort geschriebene Anweisung zu erteilen. Dieser MovieClip hat ausser ActionScript und ein paar leeren Bildern nichts.
Wenn Du also von dem runer eine Instanz auf die Bühne ziehst, siehst Du nur einen kleinen weissen Kreis. Klickst Du diesen an, erhält er noch ein kleines schwarzes Kreuzchen in seiner Mitte. Dort hinein kannst Du mit dem schwarzen Pfeilwerkzeug doppelklicken, um in das innere Deiner runer Maschine zu sehen.
Unser SchneeflockenRuner oder besser unsere Schneekanone sieht folgendermassen aus (bild 12 unten)


Bild 12:


Hi, habe soeben einen Fehler im Script bemerkt.
Die Variabel zufall sollte natürlich so;
zufall = random(5)+1;gefüllt werden.
Da der runer ja nur fünf Schlüsselbilder hat. random(5) gibt eine Zahl zwischen 0 und 4. Zählen wir dazu 1 haben wir eine Zahl zwischen 1 und 5. Diese Zahl wird dann der Methode gotoAndPlay(zufall) als Parameter übergeben. Das bewirkt, dass der Loop unterschiedlich lange läuft. Die Flocken erscheinen etwas unregelmässiger, fast wie im realen Leben.

So,
da wir nun dank dem kleinen ScriptFehler gleich zuunterst angefangen haben mit erklären, können wir nun zum eigentlichen Herzstück des runers vorstossen.
Auf der ersten Scriptzeile steht;
_root.attachMovie("Sy", "Sy"+_root.zaehler, _root.zaehler);
Da wird auf die RootzeitLeiste bezogen die Methode attachMovie aufgerufen. Diese Methode erwartet drei Parameter. Der erste ist hier der nicht sehr sinnige Name des MovieClip, den ich aus der Bibliothek ziehen möchte. Es ist der Name, den ich zuvor für den Export für AktionScript verknüpft hatte ( siehe ganz oben). Es ist nicht wie ursprünglich beabsichtigt der Name "Schneeflockentanz". Das kommt daher, dass ich diesen Scheeflockentanz nochmals in einen MovieClip gepackt hatte und ihm den Namen "Sy" gegeben habe. Doch dazu gleich mehr.
Dann kommt ein Komma. (Parameter in Methoden werden immer mit einem Komma getrennt.)
Nach dem ersten Komma kommter der zweite Parameter. root.attachMovie(idName, neuerName, tiefe) erwartet hier den neuen Namen der erzeugten Intanz.
Dann kommt wieder ein Komma.
Der dritte Parameter bestimmt die Tiefe. Dazu gleich mehr.
Mit _root.zaehler spreche ich eine Variable an, die ich auf der RootZeitLeiste auf der Ebene "Script" inizialisiert habe. inizialisiert heisst; ich habe sie dort sowohl ins Leben gerufen und ihr auch gleich einen Wert zugewiesen.
"Sy"+_root.zaehler ist eine Stringverknüpfung. Ein String ist eine Zeichenkette. Hier wird also der Wert der Variable _root.zaehler als String an den String "Sy" angeknüpft. Wenn der Wert der Variable gerade zum Beispiel 1 war, heisst die neu erzeugte Instanz nun "Sy1".
Damit die nächste Schneeflocke ihren eigenen Namen erhält, wird nun auf der zweiten Scriptzeile zu der Variable _root.zaehler eins dazugezählt. Die verkürzte Schreibweise dazu sieht so aus;

_root.zaehler++;

Der mittlere Teil des runer- Script will ich nur ganz kurz einmal ansprechen.

if (_root.zaehler == 25) {
     _root.zaehler++;
}
if (_root.zaehler>50) {
     _root.zaehler -= 50;
}


Um die Sache ganz zu verstehen werden wir uns nachher zuerst einmal etwas vertieft mit den Tiefen auseinander setzen müssen.
Nur einmal so viel; Der Wert der Variable _root.zaehler brauchen wir ja nicht nur um den Instanzen durchnummerierte Namen zu geben, sondern wir setzen diesen Wert auch als dritten Parameter in die Methode _root.attachMovie("Sy", "Sy"+_root.zaehler, _root.zaehler);
ein.
Wenn die Variable _root.zaehler nun unbegrenzt nach oben gezählt würde, gäbe es bald so viele Schneeflocken, dass wir den Schneeräumdienst holen müssten, oder der Browser des Useres abstürzen könnte.
Darum setzt die zweite if- Abfrage den Variablen Wert wieder auf eins sobald der Wert 51 ist.
Nun ist es so, dass in einer Tiefe jeweils nur ein MovieClip sein kann, selbst wenn er winzig klein ist wie eine Schneeflocke. Kommt also in die Tiefe 1 eine neue Schneeflocke, wird die alte Schneefloche in der Tiefe 1 herausgeworfen. Sie war nun gerade ungefähr unten angekommen, darum ist das keine Tragik, sondern durchaus gewollt.

In der ersten if- Abfrage wird gefragt, ob die Variable_root.zaehler gerade 25 sei.

if (_root.zaehler == 25) {
     _root.zaehler++;
}
Das darum, weil ich den Schneemann in genau diese Tiefe gestellt habe. Würde der eingebaute Zähler nun die 25 nicht überspringen, würde mein Schneemann durch die Schneeflocke25 schlicht gelöscht.
Der Grund wieso ich den Schneemann in die Tiefe 25 gestellt habe ist einfach. So fallen genau die Hälfte der Schneeflocken hinter dem Schneemann durch und die andere Hälfte vor ihm. (Schaue Dir das Beispiel an ganz oben auf der Seite! )

Nun zu den Tiefen;

Eine Tiefe in einem 2D Program wie Flash bedeutet letztlich immer entweder hinten oder vorne, sprich verdeckt oder überdeckend. Eine wirkliche Tiefe gibt es in einem 2D Program nicht.
Das eine System sind die Ebenen auf der Zeitleiste und das andere eben die sogenannten Tiefen. Dazu kommt eigentlich noch eine drittes System innerhalb einer Ebene selber. Das System der Anordnung. Dies wurde ausführlich im ersten Figuren Tutorial besprochen. MovieClips auf der selben Ebene können in der Tiefe verschoben werden unter modifizieren/anordnen. Die Tiefen sind ein den Ebenen auf den Zeitleisten übergeordnetes System. Der Schneemann zum Beispiel steht in unserem Projekt eigentlich unter der Ebene "runer" und trotzdem kann er mit Hilfe der Tiefen so gestellt werden, das die Hälfte der Schneeflocken hinter ihm nieder gehen. In jeder Tiefe kann es wieder verschiedene Ebenen geben in dem MovieClip der dort ist. In jeder dieser Ebenen können auch wieder Objekte verschieden angeordnet werden unter modifizieren/anordnen. (schaue skizze unten)

skizze:


Die Formel die dem MovieClip Schneemann eingeben werden muss lautet;

onClipEvent(load){
    this.swapDepths(25);
}


Jetzt habe ich eigentlich alles was da auf der Bühne liegt schon erklärt. Es bleibt noch das Geheimnis der tanzenden Scheeflocken. Und die Tatsache, dass sie so schön verteilt am oberen Bühnen Rand erscheinen. Dazu doppelklicktst Du in der Bibliothek in den MovieClip "Sy" Du siehst folgendes;

Bild 13:


Zum guten Glück kann sich eine Instanz des MovieClip "Sy" mit dem Kürzel "this" selber ansprechen!

zufall =random(292)+1;
this._x = zufall;

Es tummeln sich ja immer 50 Instanzen von dem MovieClip "Sy" auf der Bühne herum. Müsstest Du sie nun über die Rootzeitleiste ansprechen, würde das etwas komplizierter, da Du dem InstanzenNamensString ja noch die Nummerierung als String anhängen müsstest. Mit der Pfadangabe "this" kann sich die nun neu in eine Instanz gefrohrene Schneeflocke gleich selber an den richtigen x Wert setzten. Dies geschieht wieder mit der praktischen Formel random(). Sie wird also irgendwo zwischen _x = 1 und _x = 292 auf der Bühne erscheinen. Das dies auch gerade der obere Rand Deines Projektes ist, ist der Tatsache zu verdanken, dass sich der runer wie schon erwähnt perfiderweise ausgerechnet unter dem oberen Bilderrahmen versteckt hält.

Klicke nun in des zweite Schlüsselbild auf der zweiten Ebene im MovieClip "Sy"
dort steht;

this._y += 2.45;

Auch der MovieClip "Sy" ist für sich so eine art runer, nur ein gefüllter runer sozusagen. Immer wenn er wieder auf das zweite Schlüsselbild kommt, setzt er sich selber um 2.45Pixel nach unten. Diese 2.45 habe ich ungefähr den Verhältnissen angepasst durch Ausprobieren. Die Schneeflocken mit diesem Falltempo wird gerade ungefähr auf dem Boden von den neu nachkommenden Schneeflocken gelöscht, mehr oder weniger zumindest. Du erinnerst Dich ja sicher noch, dass auf der ganzen Bühne immer nur 50 Schneeflocken sein können, da die Variable _root.zaehler dann wieder bei 1 neu beginnt und eine alte Schneeflocke nach der anderen gelöscht wird. Du kannst anstelle von 2.45 im Beispiels Fla auch einmal 4 oder nur 2 eingeben und den Film so unter Steuerung/Film testen, testen.

Damit die Schneeflocke sich nun nicht ständig neu zufällig auf der x Kordinate ausrichtet, wenn der Abspielknopf wieder auf das erste Schlüsselbild käme, steht im dritten Schlüsselbild noch folgender Script;

gotoAndPlay(2);

So kommt er nur gerade einmal auf das erste Schlüsselbild. Von da an wird er vom dritten immer wieder auf das zweite zurück geschickt und rennt wieder unverholen auf das dritte u.s.w. So zusagen ein Mini- runer-gefüllt mit einer Schneeflocke.

Die Schneeflocke übrigens findest du auf der Ebene 1.
klicke auf der Ebene 1 auf das erste Schlüsselbild und doppelKlicke in der Bühne auf die Schneeflocke. Die Schneeflocke ist sehr, sehr klein. Stelle den Zoom also besser auf 800, damit Du die Schneeflocke überhaupt finden kannst. Selbst dann musst Du mit den Seitenscroller der Bühne eine Weile suchen, bis sie ins Visier kommt. Hast Du sie einmal erfolgreich gefunden und doppelgeklickt, befindest Du Dich nun im MovieCLip "Schneeflockentanz"
Auch dort hat es eine Script Ebene. Klicke in das erste Bild der Script Ebene und Du findest folgende Anweisung, die Du nach dem ganzen vorher Erklärten, Dir vermutlich nun selber erklären kannst.

zufall =random(130)+1;
gotoAndPlay(zufall);

Auch hier geht es wieder darum, mittels random() etwas mehr Zufall in das Schneetreiben hinein zu zaubern.
Jetzt doppelklickst Du wieder in die Schneeflocke auf der Bühne und Du erreichst den eigentlichen KristalisationsFormerMovieClip.
Du siehst, auch Frau Holle musste sich ganz schön anstrengen, als es in Europa noch schneite, damals....(-;
Du befindest Dich nun tief verschachtelt in den Urgewalten der Scheekristalistation, oder eben wie der weisse Pfeil unten in Bild 14 zeigt, in einer MovieClipVerschachtelung. Eine Verschachtelung wohlverstanden, die sich nicht einmal auf der Bühne befindet und erst beim Abspielen des swf Film nach und nach vom runer auf die Bühne geholt wird... Aber das weisst Du ja jetzt alles.

Bild 14:


Nur noch so viel zum Script auf der zweiten Ebene im ersten Schlüsselbild im MovieClip "Schneeform", dann lasse ich Dich mit den ganzen Wintergeschichten in Ruhe. Dort steht nämlich statt gotoAndPlay gotoAndStop. Das daher, weil die Eisform nur einmal zufällig ausgewählt wird, und für den ganzen restlichen Fall erhalten bleibt. Schaue Dir die leicht verschiedenen Eiskristalle auf den einzelen Schlüsselbilder kurz an und Du hast das letzte Geheimniss dieses Fla's gelüftet oder geschüttlelt, wie Du auch immer möchtest.

zufall =random(5)+1;
gotoAndStop(zufall);


Ich habe Dir mit dem schneeTest.fla nochmals ein Beispiel des Schneefalls zum Download zu Verfügung gestellt. Dort sind die Werte etwas anders.
Du kannst die Stärke des Schneefalles an der länge des runers einstellen.
Wie weit die Schneeflocken herunterkommen, bis sie von nachflogenden gelöscht werden, hängt davon ab, wie kurz oder lang der runer ist, sprich wie stark es schneit und wie viele Schneeflocken Du in der if- Abfrage zulässt, bis die Variable _root.zaehler wieder auf Null gestellt wird und nicht zuletzt natürlich an der Geschwindigkeit des Schneeflocken Falles, den Du in der Schneeflocke selber einstellst auf dem zweiten Schlüsselbild. Um ein gewünschtes Resultat zu erzielen, musste Du etwas an den verschiedenen Parametern drehen und ausprobieren.

Im Beispiel unten habe ich noch leichten Wind eingebaut. Dazu habe ich in der Schneeflocke auf dem zweiten Schlüsselbild statt nur dem Fall noch eine leichte Bewegung nach rechts eingebaut. Jedesmal wenn der SchneeflockenMovieCLip auf dieses zweite Schlüsselbild kommt, schiebt sie sich mit this nicht nur etwas weiter nach unten, sondern auch noch etwas weniger weiter nach Rechts mit Hilfe von der Eigenschaft _x.
Im Beispiel unten habe ich statt der Ebene 25 die Ebene 30 frei gelassen. Das heisst dort wird mit der zweiten if- Abfrage im runer, verhindert, dass eine Schneeflocke in die Ebene 30 gesetzt wird. Falls Du also im unteren Beispiel gerne einen Schneemann oder eine Schneefrau bauen möchtest, setze ihn in die Tiefe 30 mit folgendem Script;

onClipEvent(load){
    this.swapDepths(30);
}


Natürlich könntest Du statt Schnee etwas ähnliches auch mit Regentropfen bauen. Du könntest sogar Luftblasen unter Wasser so erzeugen. nur müsstest Du dann den runer zu unterst auf die Bühne setzen und die Eigenschaft _y. statt jeweils zu erhöhen kleiner machen. So würden die Blasen langsam aufsteigen in einer Unterwasseraufnahme zum Beispiel. Das wäre eine gute Idee das Gelernte nun selber einmal anzuwenden! (-;

schneeTest.fla:




move7.fla
schneeTest.fla




Seite 1   |    Seite 2   |    Seite 3   |    Seite 4   |    Seite 5   |    Seite 6

Blender 2.5 VideoTutorials

FlashVideoTutorials

Video Tutorials

HTML, CSS, javaScript

Webseite der Kieselsteine

Kieselsteine Blog