Einstellen der DisplayObject-Farben

Mit der Eigenschaft color der ColorTransform-Klasse können Sie dem Anzeigeobjekt einen bestimmten Rot-, Grün- oder Blauwert (RGB-Farbwert) zuweisen. Im folgenden Beispielcode wird mit der color -Eigenschaft die Farbe des Anzeigeobjekts square zu Blau geändert, wenn der Benutzer auf eine Schaltfläche mit der Bezeichnung blueBtn klickt:

// square is a display object on the Stage. 
// blueBtn, redBtn, greenBtn, and blackBtn are buttons on the Stage. 
 
import flash.events.MouseEvent; 
import flash.geom.ColorTransform; 
 
// Get access to the ColorTransform instance associated with square. 
var colorInfo:ColorTransform = square.transform.colorTransform; 
 
// This function is called when blueBtn is clicked. 
function makeBlue(event:MouseEvent):void 
{ 
    // Set the color of the ColorTransform object. 
    colorInfo.color = 0x003399; 
    // apply the change to the display object 
    square.transform.colorTransform = colorInfo; 
} 
 
blueBtn.addEventListener(MouseEvent.CLICK, makeBlue);

Beachten Sie, dass beim Ändern der Farbe eines Anzeigeobjekts mit der Eigenschaft color die Farbe des gesamten Objekts vollständig geändert wird, unabhängig davon, ob das Objekt zuvor mehrfarbig war. Hierzu ein Beispiel: Wenn bei einem Anzeigeobjekt mit einem grünen Kreis und einem darauf angezeigten schwarzen Text die Eigenschaft color der diesem Objekt zugewiesenen ColorTransform-Instanz die Farbe Rot zugewiesen wird, so wird das gesamte Objekt einschließlich Kreis und Text rot (d. h. der Text kann nicht mehr vom übrigen Objekt unterschieden werden).

Angenommen, Sie haben ein Anzeigeobjekt mit mehreren Farben (beispielsweise ein Digitalfoto) und Sie möchten nicht das gesamte Objekt vollständig neu kolorieren, sondern nur die Farbe eines Anzeigeobjekts basierend auf den vorhandenen Farben einstellen. Für dieses Szenario enthält die ColorTransform-Klasse eine Reihe von Multiplikator- und Offset-Eigenschaften, mit denen Sie diese Einstellungen vornehmen können. Die Multiplikator-Eigenschaften redMultiplier , greenMultiplier , blueMultiplier und alphaMultiplier arbeiten wie Farbfotografie-Filter (oder farbige Sonnenbrillen) und verstärken oder schwächen bestimmte Farben im Anzeigeobjekt. Mit den Offset-Eigenschaften ( redOffset , greenOffset , blueOffset und alphaOffset ) können bestimmte Farben des Objekts verstärkt oder Mindestwerte für eine bestimmte Farbe vorgegeben werden.

Diese Multiplikator- und Offset-Eigenschaften sind mit den erweiterten Farbeinstellungen identisch, die für Movieclip-Symbole in der Flash-Authoring-Umgebung verfügbar werden, wenn Sie im Eigenschafteninspektor im Popupmenü „Farbe“ die Option „Erweitert“ auswählen.

Im folgenden Beispielcode werden eine JPEG-Grafik geladen und eine Farbtransformation angewendet, die den Rot- und Grünkanal verändert, während sich der Mauszeiger entlang der x- und y-Achse bewegt. Da keine Offset-Werte angegeben wurden, ist in diesem Fall der Farbwert jedes Farbkanals auf dem Bildschirm ein Prozentwert der Originalfarbe im Bild. Dies bedeutet, dass das stärkste Rot oder Grün, das in einem bestimmten Pixel angezeigt wird, der ursprüngliche Rot- oder Grünanteil in diesem Pixel ist.

import flash.display.Loader; 
import flash.events.MouseEvent; 
import flash.geom.Transform; 
import flash.geom.ColorTransform; 
import flash.net.URLRequest; 
 
// Load an image onto the Stage. 
var loader:Loader = new Loader(); 
var url:URLRequest = new URLRequest("http://www.helpexamples.com/flash/images/image1.jpg"); 
loader.load(url); 
this.addChild(loader); 
 
// This function is called when the mouse moves over the loaded image. 
function adjustColor(event:MouseEvent):void 
{ 
    // Access the ColorTransform object for the Loader (containing the image) 
    var colorTransformer:ColorTransform = loader.transform.colorTransform; 
     
    // Set the red and green multipliers according to the mouse position. 
    // The red value ranges from 0% (no red) when the cursor is at the left 
    // to 100% red (normal image appearance) when the cursor is at the right. 
    // The same applies to the green channel, except it's controlled by the 
    // position of the mouse in the y axis. 
    colorTransformer.redMultiplier = (loader.mouseX / loader.width) * 1; 
    colorTransformer.greenMultiplier = (loader.mouseY / loader.height) * 1; 
     
    // Apply the changes to the display object. 
    loader.transform.colorTransform = colorTransformer; 
} 
 
loader.addEventListener(MouseEvent.MOUSE_MOVE, adjustColor);