Tutorialbeschreibung

Fortgeschrittene Feuer- und Rauch-Simulation

Fortgeschrittene Feuer- und Rauch-Simulation

Hier zeige ich dir wie man mit ein paar Zeilen Actionscript eine sehr gut und real aussehende Feuer-Simulation hinbekommt.


Schritt 1:
Als Erstes legst du dein Flash-Dokument an (muss Actionscript 2.0 sein!).
Größe und Hintergrundfarbe sind dir überlassen, bei der Framerate solltest du aber über
24 Bps liegen (am besten 30).

Bilder





Schritt 2:

Jetzt zeichnest du dir einen Partikel (siehe Bild; Höhe und Breite nicht mehr als 14 Pixel) und gibst ihm den Bezeichner “partikel1”.
Die weitere Gestaltung ist dir überlassen, wobei ein Unschärfe-Filter noch wichtig wäre!

Als nächstes machen wir das Graphische, dann kommen wir zum Scripten!

 


Bilder



So...das war's dann schon mit der Graphik!


Schritt 3:

Drücke nun F9, um den Actionscript Kompiler auszuklappen.

Das alles kommt nun in den Kompiler

var feuer = attachMovie("partikel1", "partikel1", _root.getNextHighestDepth());  >>schreibt in den "MovieClipcontainer" "feuer" den mc "partikel1" und attacht ihn auf der Bühne
----------------
feuer._x = _xmouse >>
setzt die Anfangsposition des Partikels
feuer._y = _ymouse
----------------
feuer.up = Math.random()*1.5;                >>   verleiht jedem einzelnem Partikel eigene unterschiedliche Fluggeschwindigkeiten
feuer.lr = (Math.random()*2-1)*Math.random()*0.6;
feuer.rot = Math.random()*5;

----------------
feuer.onEnterFrame = function() {   >> sorgt dafür, dass die Partikel immer durchsichtiger werden und sich löschen, wenn sie unsichbar sind.
  if (this._alpha>0) {
   this._alpha -= 2;
  } else {
   this.removeMovieClip();
  }

----------------
this._y -= this.up;   >>   wendet die vorher angelegten Flug-Eigenschaften an
this._rotation += this.rot;
this._x += this.lr;


So. Bis jetzthin rührt sich noch gar nichts, denn pro Aufruf dieser ganzen Funktion wird nur ein einzelnes Partikel auf die Bühne gelegt. Was du jetzt brauchst, ist ein Befehl, der die Funktion öfter aufruft, als der "onEnterFrame"-Befehl.
Die Lösung ist: "setInterval()"
, also schreibst du einfach unter den vorherigen Skript:

setInterval(feuer_s,1)

Die Zahl hinter dem Funktionsnamen gibt an, in welchen Milisekunden-Abständen die Funktion ausgeführt wird.

Jetzt noch mal der ganze Skript in einem Stück:
-------------------------------------------------

function feuer_s () {
 var feuer = attachMovie("partikel1", "partikel1", _root.getNextHighestDepth());
 feuer._x = _xmouse
 feuer._y = _ymouse
 feuer.up = Math.random()*1.5;
 feuer.lr = (Math.random()*2-1)*Math.random()*0.6;
 feuer.rot = Math.random()*5;
 feuer.onEnterFrame = function() {
  if (this._alpha>0) {
   this._alpha -= 2;
  } else {
   this.removeMovieClip();
  }
  this._y -= this.up;
  this._rotation += this.rot;
  this._x += this.lr;
 };

   setInterval(feuer_s,1)

 


Damit das Ganze noch wie Feuer aussieht, gehst du einfach in den MovieClip “partikel1” und machst einen Tween, in dem sich der MovieClip von Rot in Schwarz färbt.


Bilder


Und jetzt sollte es ungefähr so aussehen:




Das war mein Tutorial über Feuer-Simulation!
Ich bedanke mich für deine Aufmerksamkeit!

Kommentare
Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.
Portrait von dy_raffy
  • 01.06.2009 - 23:15

echt cool, prima gemacht

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 01.06.2009 - 21:44

nicht übel....was es alles gibt....grins...danke für das tut

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 01.06.2009 - 20:22

Kann sich sehen lassen, gefällt mir :-)

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 01.06.2009 - 14:00

finde ich super und einfach erklärt. immer wieder!!! *****

Portrait von engeltr
  • 01.06.2009 - 12:14

Cooooooooooooooooooooooooool :D:D:D

Portrait von tomtom81
  • 01.06.2009 - 11:47

werds auch mal testen,

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 01.06.2009 - 11:17

Wow, ein cooles Ergebnis!

x
×
×