| |
Swish bietet von Hause aus an ein Sprite / Movieclip zu maskieren. Dies bedeutet, dass nur der Bereich sichtbar ist, den die Maske umgibt. Die Funktion ein Sprite zu maskieren könnt ihr über die Eigenschaften eines Sprites festlegen.
Beginnen wir also zunächst damit ein Sprite zu erstellen. Sprites dienen im Übrigen dazu, unabhängig vom eigentlichen Film Aktionen in der Zeitleiste auszulösen. Dazu machen Sie eine Swish Datei auch übersichtlicher. Es bietet sich also an die verschiedenen Elemente einer Seite in verschiedene Sprites zu legen.
Nun aber los. Zeichnet zunächst mit Hilfe des Malwerkzeuges ein Rechteck. Gebt ihm eine Füllung und klickt anschließend mit der rechten Maustaste das Rechteck an. Wählt hier die Option „Konvertieren – zum Sprite / Movieclip“ und benennt das Sprite anschließend mit „Mein_Sprite“

Screenshot "Sprite erzeugen"
Ihr seht, dass sich nun das Aussehen des Rechteckes in der Outline verändert hat. Es ist nun zu einem grünen Symbol geworden.
Bis auf die Tatsache, dass unser Rechteck nun in einem Sprite ist hat sich noch nichts getan. Nun wollen wir mal ein Bild importieren, von dem später nur ein gewisser Teil zu sehen sein soll. Klickt also „Einfügen – Bild importieren“ und wählt ein Bild von eurem Rechner aus. Wichtig ist hier, dass sich dieses Bild auch anschließend im Sprite befindet.

Screenshot "Bild einfügen"
Nun wollen wir, dass von dem Bild nur der Teil zu sehen ist, den das zuvor gezeichnete Rechteck einschließt. Dazu wählt das Sprite Symbol in der Outline aus und wechselt zu den Eigenschaften des Sprites. Wählt dort die Option „Unterstes Objekt als Maske verwenden“

Screenshot "Sprite maskieren Option"
 |
Wenn Ihr nun euren Film über die Playtaste startet seht ihr, dass nur noch der Bereich des Rechteckes vom Bild zu sehen ist. Um die Übersicht in einem Projekt zu behalten bietet es sich an Formen, die ihr als Maske nutzt immer auch als solche zu benennen. Wählt also das Rechteck und gebt ihm den Namen „mask“. |
Nun wäre es schon möglich dieses Maske mit einem Effekt zu versehen. Wählt dazu einfach das Rechteck aus. Führt in der oberen Zeitleiste einen Klick mit der rechten Maustaste aus und wählt „Zoom - Hineinzoomen"

Screenshot "Bild einfügen"
Wenn ihr den Film nun per Play startet werdet ihr sehen, dass das Bild im entsprechenden Ausschnitt eingezoomt wird.
Dieser Effekt reicht uns natürlich nicht. Wie wäre es wenn das gesamte Bild in verschiedenen Teilen erscheint? Ein Sprite, was über die Funktion „Sprite maskieren“ zu einem maskierten Sprite bestimmt wurde, kann immer nur eine Form als Maske verwenden. Diese Form muss zudem immer an der untersten Position im Sprite liegen. Sprich das Objekt was sich in der Outline im Sprite zuletzt befindet ist die Maske. In unserem Fall war es schon das Rechteck, weil dieses vor dem Bild im Sprite enthalten war. Um es zu testen verschiebt das Bild einfach mal an die Stelle des Rechteckes und ihr werdet sehen, dass nun nur noch das Rechteck zu sehen ist, also das Bild unsere Maske bildet.
Um nun mehr als eine Form als Maske zu nutzen, müssen wir zunächst einen entsprechenden Code eingeben. Wechselt dazu in den Scriptmodus / Aktion. Wichtig ist dabei, dass ihr das Sprite angewählt habt. Gebt anschließend diesen Code in den Scriptbereich ein:
| |
onSelfEvent (load) {
this.setMask(mask);
}
|

Screenshot "Actionscript einfügen"
Damit haben wir unserem Sprite (this) mitgeteilt, dass es durch ein Objekt „mask“ maskiert wird. Wenn das nicht so klar sein sollte, werdet ihr es gleich verstehen.
Deaktiviert nun die Funktion des Sprites selber „Unterstes Objekt als Maske verwenden“ in den Eigenschaften des Sprites.
 |
Wenn ihr nun den Film startet werdet ihr feststellen, dass das Bild in seiner vollen Gr öße zu sehen ist und nicht maskiert wird. Das hat damit zu tun, das wir zwar eine Form haben, die „mask“ heißt, diese Form aber nicht ein Ziel ist. Damit es unser Script finden kann, müsst ihr in den Eigenschaften der Form die Option „Ziel / Target“ wählen |
Wenn ihr nun Play wählt seht ihr wieder den Effekt. ( Falls ihr mit SwishMAX 1 arbeiten solltet, müsst ihr den Film mit dem externen Player testen) Ihr werdet euch jetzt sicher fragen, warum haben wir das überhaupt gemacht, denn schließlich ist ja alles wie vorher. Ist es auf den ersten Blick auch, aber das wird sich jetzt ändern!
| Wie ihr zu Beginn schon das Rechteck zu einem Sprite konvertiert habt, macht ihr es jetzt nochmals mit dem Rechteck (mask). Gebt anschließend dem Sprite den Namen „mask“. Die Meldung, die SwishMAX meldet könnt ihr mit "Ja" beantworten. Das bewirkt, dass der Effekt, den wir bereits auf das Rechteck angewandt haben mit in das Sprite übernommen wird. |
 |
Löscht anschließend wieder den Zoomeffekt auf dem Rechteck und positioniert das Rechteck an die obere linke Ecke des Bildes. Zeichnet weitere Rechtecke oder Kreise bis euer gesamtes Bild mit Formen belegt ist.
Da das Sprite aktuell unter dem Bild liegt könnt ihr dieses auch in der Outline über das Bild legen, um besser sehen zu können wo die Formen platziert werden müssen. War es bei der Methode die Option „Sprite maskieren“ zu nutzen noch notwendig die Maske als unterstes Objekt im Sprite zu nutzen, können wir nun unsere Maske beliebig setzen. Lassen wir Sie also einfach über dem Bild.

Screenshot "Masken zeichnen"
Wenn jetzt alles läuft habt ihr das Prinzip des Maskierens bereits verstanden. Spielt mal ein wenig mit den Effekten oder wendet zusätzlich noch Effekte auf das eigentliche Bild an. Wenn die Animation immer wieder abspielen sollte, so setzt nach dem letzten Effekt einfach ein Stop in die Zeitleiste.
Was auch schöne Effekte ergibt ist, wenn ihr das Bild zunächst noch in „Teile zerbrecht“ und dann Effekte anwendet. So lassen sich mit recht wenig Aufwand eindrucksvolle Effekte erzielen.
Ich hoffe dieses Swish Tutorial war verständlich geschrieben. Für alle, die sich die fertige Datei als swi Datei wünschen gibt es am Ende den Download und das Video zum Swish Tutorial.
 |