12.2 Wechselspiele
Die Eigenschaften des MovieClip-Objekts sind besonders gut für optische Modifikationen geeignet: Mit ihnen können Sie die Größe verändern oder die Position. Beides kennen Sie bereits aus dem Kran-Beispiel in Kapitel 9, »Tasten«. Interessant ist auch die Eigenschaft _visible, die einen Wahrheitswert erhält: true blendet den MovieClip ein, false blendet ihn aus.
Der Wechsel von Farben gestaltet sich ein wenig schwieriger. Hierfür hält ActionScript die Color-Klasse bereit, die Sie wie die MovieClip-Klasse im Aktionen-Bedienfeld unter Integrierte Klassen • Film finden.
Abbildung 12.2 Die Color-Klasse im Aktionen-Bedienfeld.
Und so funktioniert es:
1. | Für eine neue Farbe müssen FarbeändernSie ein Color-Objekt instanziieren: |
var farbe_color:Color = new Color(movieclip_mc);
-
- Um Codehinweise zu erhalten, fügen Sie der Variablen, die das Color-Objekt aufnimmt, die Namensendung _color hinzu. Entscheidend ist der MovieClip als Parameter des Color-Objekts. Dieser MovieClip kann mit dem Color-Objekt gefärbt werden.
2. | Zum Färben verwenden Sie die Methode setRGB(Farbe)setRGB() (Methode). Sie setzt eine Farbe als Hexadezimalhexadezimalen Wert ein: |
farbe_color.setRGB(0xFFFFFF);
-
- Der MovieClip übernimmt den Farbwert sofort. Wollen Sie einen bestehenden Farbwert auslesen, verwenden Sie getRGB().
Wie das Zuweisen von Farben in der Praxis funktioniert, zeigen wir Ihnen an einem Beispiel: Ausgangspunkt ist die Datei chamaeleon.fla auf der CD-ROM im Ordner Flash8, FlashMX2004 bzw. FlashMX. Sie besteht aus einem Chamäleon und einer Palette mit Schaltflächen. Natürlich kommt es in der Praxis eher selten vor, dass Sie die Farbe eines Chamäleons wechseln müssen – schließlich kann es das ja selbst. Aber ersetzen Sie das Tier (in Gedanken) einfach durch ein beliebiges Produkt, das der Nutzer konfigurieren soll, schon hat das Beispiel Praxiswert.
Farben wechseln |
Bei Verläufen und komplexeren Objekten scheitert der simple Farbwechsel. Hier gibt es Alternativen: Entweder blenden Sie die verschiedenen Objekte mit _visible ein und aus oder Sie versehen ein MovieClip mit mehreren Bildern. Diese gestalten Sie in unterschiedlichen Farben und arbeiten dann mit gotoAndStop() (siehe hierzu die Beispiele aus dem Kapitel 5, »Einfache Filmsteuerung«). |
Abbildung 12.3 Das Chamäleon im ursprünglichen Zustand
Nun sollen Sie die Schaltflächen zum Öffnen und Schließen der Augen und zum Umfärben des Chamäleons in Betrieb nehmen. Wichtig ist dabei, die MovieClip-Hierarchie immer gut im Blick zu behalten. Die Datei ist so angelegt, dass alle MovieClips sauber untereinander angelegt sind.
Fehlerquelle |
Die häufigste Fehlerquelle bei MovieClips besteht darin, den Instanznamen oder die Adresse in der Hierarchie falsch anzugeben. Lassen Sie sich ruhig vom Zielpfad-Editor helfen. |
Abbildung 12.4 Der Film mit dem Chamäleon in der Übersicht
Schritt für Schritt: Chamäleon umfärben
Der Code für die folgenden Schritte landet im ersten Schlüsselbild des Hauptfilms auf der Ebene ActionScript, da Sie für den Zugriff auf die Schaltflächen Ereignisprozeduren einsetzen.
Wenn der Nutzer auf die Schaltfläche Auf klickt, öffnen Sie das Auge:
palette_mc.auf_btn.onRelease = function() { augezu_mc._visible = false; };
Hier handelt es sich um einen einfachen, aber sehr wirkungsvollen Trick: Das geschlossene Auge ist ein MovieClip, der in einer Ebene über der Grafik des offenen Auges liegt. Soll das Auge aufgehen, blenden Sie einfach den oberen MovieClip aus (_visible auf false setzen).
Für die Schaltfläche Zu blenden Sie den MovieClip mit dem geschlossenen Auge wieder ein:
palette_mc.zu_btn.onRelease = function() { augezu_mc._visible = true; };
Abbildung 12.5 Das Chamäleon zwinkert Ihnen zu.
Für den Farbwechsel des Chamäleons müssen Sie erst zwei Color-Objekte instanziieren – eines für den Körper des Chamäleons (koerperfarbe_mc) und eines für den MovieClip der Augenfarbe (augenfarbe_mc):
var koerperfarbe_color:Color = new Color(koerperfarbe_mc); var augenfarbe_color:Color = new Color(augezu_mc. augenfarbe_mc);
Zum Umfärben weisen Sie den Color-Objekten mit der Methode setRGB(Farbe) eine neue Farbe zu, wenn der Nutzer auf die Farb-Schaltfläche klickt:
palette_mc.farbe1_btn.onRelease = function() { koerperfarbe_color.setRGB(0xE20916); augenfarbe_color.setRGB(0xE20916); };
Anschließend müssen Sie nach demselben Muster die Farben bei den drei übrigen Farb-Schaltflächen wechseln:
palette_mc.farbe2_btn.onRelease = function() { koerperfarbe_color.setRGB(0x694420); augenfarbe_color.setRGB(0x694420); }; palette_mc.farbe3_btn.onRelease = function() { koerperfarbe_color.setRGB(0xB4A714); augenfarbe_color.setRGB(0xB4A714); }; palette_mc.farbe4_btn.onRelease = function() { koerperfarbe_color.setRGB(0x5D7C27); augenfarbe_color.setRGB(0x5D7C27); };
Abbildung 12.6 Das Chamäleon in Braun und Rot
So viel zur Farbwelt des Chamäleons. Wir hoffen, unsere bisherigen Ausführungen animieren Sie, Ihre eigenen Produkte oder die Produkte Ihrer Kunden in verschiedenen Konfigurationen anzubieten. Die Datei mit dem Code finden Sie auf der CD-ROM unter dem Namen chamaeleon_wechselspiele_AS2.fla im Ordner FlashMX2004 und unter chamaeleon_wechselspiele_AS1.fla im Ordner FlashMX.
Ihre Meinung
Wie hat Ihnen das Openbook gefallen? Wir freuen uns immer über Ihre Rückmeldung. Schreiben Sie uns gerne Ihr Feedback als E-Mail an kommunikation@rheinwerk-verlag.de.