Einleitung
  Was bringt dieses Tutorial?

"Ablauf"

  Aufbau der Bühne

  Symbole erstellen

  Instanzen plazieren

  Ebenen benennnen

  Das Actionscript

  Fertig

Aussichten
  Was kann man noch alles damit machen?


Was bringt dieses Tutorial?

Tja, dieses Tutorium soll zeigen wie man mit Flash4 und ein wenig Actionscript ein schnuckeliges Malprogramm erstellt.

Vielleicht nehmt Ihr auch noch die eine oder andere Anregung für Eure nächsten Actionscript-Projekte mit. Und vielleicht ist das Netz bald voll von netten kleinen Grafiken, die sich nach dem Besuch der Seite direkt wieder löschen.




<< Hier einfach was draufmalen!

Ablauf?

Fangen wir mit dem Aufbau des Flash-Files an: Dazu brauchen wir eine Szene und drei Bilder in der Haupt-Zeitleiste. Die Frame-Rate stellen wir auf 50 und die Bühnengrösse auf ca. 700x400.

Danach erstellen wir eine Filmsequenz mit dem Namen: "line" oder "Linie". In diesem Film malen wir mit dem Linien-Zeichner eine Linie vom Ursprung aus nach rechts-unten (benutzt dazu die SHIFT-Taste dann wird die Linie exakt gerade) und 100 Pixel breit und 100 Pixel hoch. Das wird später unser Malstrich.

Wir brauchen jetzt nur noch einen Schalter und eine Filmsequenz, die uns beim malen die Position der Maus angibt. Das kann man am besten kombinieren indem man die Filmsequenz erstellt und darin den Schalter auf den Ursprung plaziert.

• STRG + F8 drücken und dann "Schaltfläche" wählen. Danach, im Bearbeiten-Modus, das Bild "Aktiv" auswählen und mit F6 ein leeres Schlüsselbild erzeugen. Das füllen wir mit einem Quadrat oder einem Kreis aus der Malpalette (ist egal). Setzen wir dann noch das gemalte auf den Mittelpunkt (Mittelpunkt verwenden in dem Objekt-Inspektor)
• So, gehen wir wieder in die Hauptzeitleiste zurück und drücken nochmals STRG+F8. Jetzt, wählen wir aber "Filmsequenz" aus. In dem neuen Film setzen wir jetzt den eben erstellten Schalter auf den Mittelpunkt, fertig.
• Ach, ja gebt dem Schalter und dem Film nette Namen. Ich benutze "Schalter" und "mc" (movie-clip).

So das, war der erste Teil. Gehen wir nun zum ersten Bild der Hauptzeitleiste und plazieren jeweils eine Instanz der beiden Filme(Linie und den Film mit dem Schalter) auf die Bühne oder daneben und bennen sie "line" und "mc".

Benennt jetzt die Ebene irgendwie. Ich hab sie "Dinge" genannt.

Jetzt, wird es ein bißchen schwieriger. Wir kommen nämlich zu dem Actionscript-Teil. Erzeugt deshalb eine eigene Eben und nennt sie "actions" oder so. Wir brauchen 3 Bilder mit jeweils einem leeren Bild (F6). Achtet auch darauf, dass die untere Ebene("dinge") auch ihre Bilder bekommt (mit F5). Sieht in etwa so aus:

In das erste Bild schreibt Ihr bitte folgendes:

Frame 1


Start Drag ("mc", lockcenter)

Comment: "Der movieclip hängt jetzt an der Maus(zur   Übergabe x,y Koord.)"

Schauen wir uns aber erstmal das Script inm Schalter des "mc" Symbols an:

On (Press) 
Set Variable: "/:mouse" = 1 
Set Variable: "/:x1" = 0 
End On 
On (Release) 
Set Variable: "/:mouse" = 0 
End On

Comment: "Hier setzt der Schalter-Script die globale "mouse"-Variable 
entweder auf 1(ja) oder 0 (nein). Zudem wird die Koordinatenvariable 
X1 auf 0 gesetzt um dem Hauptscript einen neuen Malbeginn mitzuteilen"

In das zweite Bild der Hauptzeitliste kommt der Löwenanteil des Actionscriptes:

If (mouse = 1)
Comment: "Wenn Maus gedrückt dann beginne mit diesem Script." 

If (x1=0) 
Set Variable: "x1" = int(GetProperty ("mc",_x )) 
Set Variable: "y1" = int(GetProperty ("mc",_y )) 
Comment: "Ist die Maus zumersten mal gedrückt setzte x1 und y1 auf den Wert der Maus-Koordinaten" 

Else 
Set Variable: "x0" = int(GetProperty ("mc",_x )) 
Set Variable: "y0" = int(GetProperty ("mc",_y ))
Comment: "x1 ist nicht mehr 0. Also hole einen zweiten Wert um den Delta-Wert (Abstand zwischen 
den der Bewegungsanfang und dem Bewegunsende)errechnen zu können."

If (((x0-x1)*(x0-x1))>5 or ((y0-y1)*(y0-y1))>5) 
Comment: "Errechne einen Limbus aus dem Delta- Werten um kaum sichtbare Linien zu verhindern 
(hat auch Performancegründe)" 

Set Variable: "n1" = n1+1
Comment: "n1 ist der Linienzähler "

Duplicate Movie Clip ("line", "line" & n1, n1)
Comment: "Erstelle eine Kopie aus dem Film "line" auf Ebene mit der Numemr n1 "

Set Property ("line" & n1, X-Position) = x1 
Set Property ("line" & n1, Y-Position) = y1 
Set Property ("line" & n1, X-Skalierung) = (x0-x1) 
Set Property ("line" & n1, Y-Skalierung) = (y0-y1)
Comment: "Position und Vektor der neuen Linie werden hier festgelegt."

Set Variable: "x1" = x0 
Set Variable: "y1" = y0 
Comment: "Variablen werden übertragen um den nächsten Delta-Wert erechnen zu können" 

End If 
End If 
End If
Comment: Ende

Das dritte Bild sieht dann nur noch so aus:

Go to and Play (2)

Das wärs.




Aussichten

Natürlich kann man mit dieser Routine auch noch viele andere Tolle Sachen machen. Zum Beispiel ist es auch möglich mehrere Farben zu benutzen oder andersfarbige Hintergründe oder was spricht dagegen eine Steinwand abzufotografieren... Ich benutze das Ding schon um ein tolles Gästebuch zu programmieren. Das Gästebuch malt die Eiträge der Nutzer in Echtzeit!!! nach. Die Möglichkeiten sind fast unbegrenzt. Lasst Euch auch was schickes einfallen.

Falls Ihr es aber benutzen wollt, schreibt doch bitte einfach meinen Namen irgendwohin und schreibt mir eben eine Email.