Rheinwerk Design < openbook > Rheinwerk Design - Know-how für Kreative.
Know-how für Kreative.

Inhaltsverzeichnis
Vorwort
1 Flash für ActionScript
2 ActionScript in Flash
3 Flash Pro für ActionScript
4 Grundlagen der Programmierung
5 Einfache Filmsteuerung
6 Bildschirme und Präsentationen
7 Drucken und das Kontextmenü
8 Textfelder
9 Tasten
10 Datum und Zeit
11 Rechnen
12 Farbe wechseln und Drag
13 Zeichnen und Zufall
14 Von Mäusen und Duplikaten
15 Kollisionstest
16 Sound
17 Video
18 Externe Filme
19 Vorladen und Player erkennen
20 Formulare und UI-Komponenten
21 Komponenten anpassen
22 Formulare versenden
23 Warenkorb
24 Ausblick auf ActionScript 3
Stichwort
Ihre Meinung?

Spacer
 <<   zurück
Einstieg in ActionScript von Christian Wenz, Tobias Hauser, Armin Kappler
Aktuell zu Flash 8
Buch: Einstieg in ActionScript

Einstieg in ActionScript
brosch., mit CD und QuickFinder und Referenz
416 S., 24,90 Euro
Rheinwerk Design
ISBN 978-3-89842-774-6
Pfeil 12 Farbe wechseln und Drag
  Pfeil 12.1 Animation mit ActionScript
  Pfeil 12.2 Wechselspiele
  Pfeil 12.3 Drag
  Pfeil 12.4 Schieberegler


Rheinwerk Computing - Zum Seitenanfang

12.2 Wechselspiele  topZur vorigen Überschrift

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.

 <<   zurück
  
  Zum Rheinwerk-Shop
Zum Rheinwerk-Shop: ActionScript 3 – Das Praxisbuch
ActionScript 3
Das Praxisbuch

bestellen
 Ihre Meinung?
Wie hat Ihnen das Openbook gefallen?
Ihre Meinung

 Buchtipps
Zum Rheinwerk-Shop: JavaScript






 JavaScript


Zum Rheinwerk-Shop: jQuery






 jQuery


Zum Rheinwerk-Shop: Responsive Webdesign






 Responsive Webdesign


Zum Rheinwerk-Shop: Suchmaschinen-Optimierung






 Suchmaschinen-
 Optimierung


Zum Rheinwerk-Shop: Schrödinger lernt HTML5, CSS3 und JavaScript






 Schrödinger lernt
 HTML5, CSS3
 und JavaScript


 Lieferung
Versandkostenfrei bestellen in Deutschland, Österreich und der Schweiz
InfoInfo




Copyright © Rheinwerk Verlag GmbH 2006
Für Ihren privaten Gebrauch dürfen Sie die Online-Version natürlich ausdrucken. Ansonsten unterliegt das Openbook denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt.
Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.


Nutzungsbestimmungen | Datenschutz | Impressum

Rheinwerk Verlag GmbH, Rheinwerkallee 4, 53227 Bonn, Tel.: 0228.42150.0, Fax 0228.42150.77, service@rheinwerk-verlag.de

Cookie-Einstellungen ändern