Der Quelltext des Programms ist auf der CD-ROM (tangram3.fla) und steht Ihnen für Lernzwecke zur Verfügung.
Auf die grundsätzliche Bedienung des Programms Flash 4 und die jeweiligen Werkzeug- und Menüleisten wird nicht eingegangen. Dafür liegen dem Programm Flash entsprechende Hilfen und Tutorials bei. Es gibt zu diesem Entwicklungsprogramm inzwischen einiges an Sekundärliteratur. Dieses ist auch Gegenstand der praktischen Einführung im Seminar.
Die Schritt für Schritt Anleitungen
beziehen sich auf die deutsche Version von Flash 4. Die 30-Tage Demo-Version
ist in englischer Sprache. Es sind dann die entsprechenden englischen Bedeutungen
zu wählen. Die Tastaturbefehle sind identisch.
Schritt für Schritt
Menü: Modifizieren/Film...
Gitterabstand auf 8 Pixel setzen (alle anderen Grundeinstellungen bleiben)
Menü: Ansicht/Gitternetz aktivieren
- macht ein Hilfsgitter sichtbar
Menü: Ansicht/Ausrichten aktivieren
- fängt beim Zeichnen die Gitterschnittlinien und andere Zeichnungskanten
ein
Tastatur: z - Arbeitsfläche
etwas größer zoomen (mit der Taste Alt kann man zwischen
größer und kleiner zoomen wechseln)
Wir brauchen für die größten
Elemente ca. 128 Pixel Platz (d.h. ca 20 Kästchen sichtbar einstellen).
Tastatur: r - Rechteck-Werkzeug
(Optionen einstellen: Linienfarbe unsichtbar (oben links im Dialogfeld);
Füllfarbe
nach Geschmack - auf Kontrast achten)
Maus: linke Taste mit der Tastatur:
Umschalt-Taste
zusammen zeichnet ein Quadrat - 16 Kästchen Kantenlänge
Tastatur: n - Linien-Werkzeug (Optionen
einstellen: Linienfarbe schwarz; Haarlinienstärke)
Diagonale durch das vorher erstellte Quadrat
ziehen; eine dreieckige Hälfte anklicken (Dreieck ist markiert)
Tastatur: F8 - in Symbol konvertieren;
dadurch wird das Dreieck als wiederverwendbares Symbol in der Bibliothek
gespeichert
im Dialog: Name - D1a; Verhalten
- Filmsequenz
Schaltfläche: Symbole bearbeiten
- Name auswählen
Tastatur: Strg Alt i - Objektinspektor
im Dialog: Option Mittelpunkt verwenden
aktivieren; in Feld x: 32; in Feld y 32; Schaltfläche
Anwenden
Schaltfläche: Szene bearbeiten -
Szene auswählen
Tastatur: Entf - Symbol von der
Arbeitsfläche löschen
Übertragungsauftrag
Der Rest der Quadratfläche kann noch
einmal mittig geteilt werden, dann eines der entstehenden Dreiecke noch
einmal mittig teilen; das Ergebnis sollen insgesamt drei Dreieck-Elemente
sein: 1. Dreieck - Kathetenlänge von 128 Pixel (16 Kästchen),
2. Dreieck - Hypothenusenlänge von 128 Pixel (16 Kästchen), 3.
Dreieck - Kathetenlänge von 64 Pixel (8 Kästchen)
Die Mittelpunkte der Symbole sollen jeweils
in der Mitte der Dreiecke liegen.
Danach brauchen wir noch ein Quadrat mit
der Kantenlänge von 64 Pixel (8 Kästchen) und eine Raute mit
der kürzeren Kantenlänge von 64 Pixel (8 Kästchen) - wenn
zwei kleine Dreiecke umgedreht aneinanderliegen bekommen wir die Form.
Schritt für Schritt
Tastatur: Strg l oder Menü:
Fenster/Bibliothek - in der Objektbibliothek können wir die Elemente
verwalten
Maus: Doppelklick auf D1a - Bearbeitungsmodus
für den Symbolfilm
Maus: Klick auf Bild 2 in der Zeitleiste
Tastatur: F6 - neues Schlüsselbild
Tastatur: n - Linienwerkzeug; Umrandung
der Formenkanten des Dreiecks (im Bild 2 der Zeitleiste)
Tastatur: u - Füllwerkzeug; Optionen
einstellen: Füllfarbe transparent oder hell oder nach Geschmack
Maus: Klick mit der rechten Maustaste
auf Bild 1 in der Zeitleiste; Eigenschaften/Aktionen; auf das +
Zeichen klicken und Aktion stop auswählen; ok-Taste
im Dialog Bibliothek: Maus: rechte Maustaste
auf D1a; Dublizieren; Name - D1b; Verhalten - Filmsequenz
Übertragungsauftrag
Alle Symbole bekommen so ein zweites Filmbild,
die Aktion stop bekommen alle Elemente im ersten Filmbild und das
kleinste Dreieck soll zum Schluß noch dubliziert werden.
Bild 1: alle Einzelteile des Programms in der Objektbibliothek aufgelistet
Bild 2: Die Schaltflächen (Button) im Programmprojekt
Wir ziehen aus der Objektbibliothek nacheinander die erstellten Filmsequenzen der Tangram-Elemente in die "Szene1" und platzieren sie entsprechend der obigen Abbildung. Die Button befinden sich zum größten Teil innerhalb einer Ebene, die wir "Button" nennen können.
Filmsequenz D1a wird mit der rechten Maustaste
angeklickt. Eigenschaften auswählen.
Folgendes Dialogfeld öffnet sich:
Bild 3: Filme können auch als Schaltflächen behandelt werden,
sie bekommen dadurch das Verhalten von Schaltflächen
Das Symbol D1a ist markiert. Das Verhalten
stellen wir auf Schaltfläche. Die Maus soll dieses Element
ebenfalls als Schaltfläche behandeln - Option Als Schaltfläche
behandeln
Wir holen die Karte Farbeffekt hervor.
Hier können wir eine Farbeffekt bestimmen, der für das ausgewählte
Objekt nur hier in dieser Szene gilt.
Bild 4: Die Alpha-Einstellung (oder eine andere Einstellung) bestimmt
in diesem konkreten Einsatz des Objekts seine Farbeigenschaften (hier die
Transparenz)
Bild 5: Aktionen nennt man die Script-Sprache innerhalb von Flash.
Sie können Schaltflächen oder Schlüsselbildern in der Zeitleiste
zugeordnet werden.
zu 1: On (...) ... End On schließt
alle Schaltflächenaktionen unter den anzugebenden Maus- oder Tastaturbedienungen
ein.
zu 2 und 5: Begin Tell Target (...)
... End Tell Target schließt alle Aktionen ein, die ein Filmobjekt
als benanntes Ziel ausführen soll.
die Bedeutung dieses Aktionsscripts in
"Umgangsdeutsch":
Beim Loslassen der Maustaste über
diesem Objekt oder dem Tastendruck "1" stoppe die laufende Filmsequenz,
die mit der Variablen "Teil" bezeichnet wurde auf dem dortigen Bild 1.
Dann soll die Variable mit der Filmsequenzinstanz
"/Dreieck1a" gefüllt werden (Filminstanz wird weiter unten erklärt).
Anschließend soll die Eigenschaft
Sichtbarkeit der Filmsequenz mit dem Instanznamen "/klapp" auf Nichtsichtbar
gestellt werden (Button nur für Element Raute notwendig, also nicht
hier).
Jetzt soll die Filmsequenz (also D1a)
auf das Bild 2 springen und dort stoppen. Ende dieser Mausaktion.
uff - und das alles im Moment des Loslassens
der Maustaste oder dem Tastendruck "1".
Und was soll das alles? - Bedeutung: Markiere das dreieckige Element D1a auf der Arbeitsfläche! (welches wir dort noch platzieren müssen)
Bild 6: Der Objektinspektor informiert über einzelne Objekte und
man kann darüber auch Ort, Größe und Drehung verändern.
Bild 7: Hat ein Objekt das Verhalten einer Filmsequenz, kann man ihm
einen Instanznamen geben, worüber man an anderer Stelle gezielt das
Verhalten dieses Films steuern kann.
Wir erzeugen eine neue Ebene in der Szene
1 und nennen sie D1a. Die Ebene Button schließen wir gegen
unbeabsichtigtes Editieren mit dem Schloßsymbol. Die Ebene D1a
aktivieren wir und ziehen den Film D1a aus der Objektbibliothek auf die
Arbeitsfläche.
Mausklick mit der rechten Maustaste auf
diesem Film; Eigenschaften wählen - Wir belassen dieses Symbol in
seinem Verhalten als Filmsequenz und vergeben den Instanznamen Dreieck1a.
Durch diesen Instanznamen wird dieses Filmelement auch von anderer Stelle
über die Aktionen ansprechbar.
Nun bekommt jedes Tangram-Element eine
eigene Ebene, auf die jeweils das entsprechende Element gezogen wird. Die
jeweiligen Instanznamen lauten: Dreieck1b, Dreieck2, Dreieck3a, Dreieck3b,
Quadrat, Raute.
Auf die Ebene Hintergrund wird alles untergebracht,
was sich über einen längeren Zeitraum nicht verändert und
als "Folie" ganz unten liegt. Die Button für die Übungswechsel
liegen auf einer eigenen Ebene (sie haben ein anderes Verhalten als die
restlichen Button)
Im Szenenbild 1 wird über eine Aktion eine Initialisierung der Variablen Teil (also des jeweils aktiven Elements) vorgenommen; für "nichts" hätte auch etwas anderes stehen können, das kein Element beschreibt - im Anfang soll kein Element markiert sein.
Rechte Maustaste auf das das erste Bild
der obersten Ebene - Eigenschaften auswählen - Karte Bezeichnung
anklicken - init als Bezeichnung eintragen. Dann Karte Aktionen
anklicken - plus-Zeichen - Set Variable auswählen und
Teil
als Variable und nichts als Wert eintragen.
Bild 9: Initialisierung der Variablen Teil
Fügen Sie die Szenebilder bis Bild
20 wie in dem Beispiel zusammen.
Die Aktion in Bild 20 hat folgenden Inhalt:
Stop
Set Variable: "Uebung" = 1
Set Variable: "TextField1" = "1"
Call ("init1")
Stop hält die Szene hier an. Die Variablen
Uebung
und TextField1 brauchen wir zum Hochzählen der Übungen
und für den Inhalt des Textfeldes (in der Ebene Button).
Call
() bedeutet, daß ab dieser Stelle eine kleine Aktion abläuft,
die sich im Bild 26 mit der Bezeichnung init1 befindet:
Bild 10: Bezeichnung eines Bildes in der Szene, hier zum Aufrufen einer
Aktion von anderer Stelle
Bild 11: Die Aktionen von init1.
Mit dieser Aktion wird ein Element "Teil"
(kann jedes Tangram-Element sein) auf das Bild 1 der jeweiligen kleinen
Filmsequenz eingestellt und gestoppt. Die Variable "Teil" wird neu initialisiert
der Button klapp (Raute spiegeln) wird auf unsichtbar gestellt.
Vor jeder neuen Übung muß dieses
gewährleistet sein. Also ruft jedes Übungsbild (21 - 25) wieder
init1
auf:
Bild 12: Jede Übung ruft erst init1 auf
Auch wenn weitere Übungen aufgerufen
werden, bleiben die Inhalte aus Bild 20 (Alle Tangram-Teile und die Button)
bestehen.
Die häufigste Aktion findet auf der
Arbeitsfläche ("Spielwiese") statt. Diese Arbeitsfläche ist ein
großer transparenter Button, der folgende Aktion beinhaltet:
Bild 13: Die Schaltfläche "Spielwiese", d.h. die Arbeitsfläche
sorgt für das "Drag und Drop" von Elementen
Start Drag ( ) ist eine Funktion, die das Element Teil mit der Maus mitgehen läßt (solange die Maustaste gedrückt ist), beim Loslassen der Maus wird die Funktion Stop Drag ( ) aktiv. Bei einem Tastendruck o dreht sich das Element Teil in 5° - Schritten.
Bild 14: Die Aktionen für die Drehungen und das Spiegeln von Elementen
Bild 15: Diese Aktion beschreibt den "Schalter", der die Übungen
sequenziell aufruft (analog zu Symbol vor verhält sich das
Symbol back)