DisplayObject 색상 조절

ColorTransform 클래스의 color 속성을 사용하여 표시 객체에 특정 RGB(Red, Green, Blue) 색상 값을 할당할 수 있습니다. 다음 예제에서는 color 속성을 사용하여 사용자가 blueBtn 버튼을 클릭할 때 square 표시 객체의 색상을 파랑으로 변경합니다.

// 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);

color 속성을 사용하여 표시 객체의 색상을 변경하면 객체에 사용된 색상 수에 관계없이 전체 객체의 색상이 완전히 변경됩니다. 예를 들어, 위에 검정 텍스트가 있는 녹색 원이 들어 있는 표시 객체가 있는 경우 해당 객체와 연관된 ColorTransform 인스턴스의 color 속성을 빨강 음영으로 설정하면 전체 객체와 원 및 텍스트가 빨강으로 변경됩니다. 따라서 텍스트가 객체의 나머지 부분과 더 이상 구분되지 않습니다.

디지털 사진처럼 여러 색상으로 된 표시 객체가 있을 때 객체의 색상을 완전히 변경하지 않고 기존 색상을 기반으로 표시 객체의 색상을 조절한다고 가정합니다. 이 경우 ColorTransform 클래스는 이러한 유형의 조정에 사용할 수 있는 일련의 승수 및 오프셋 속성을 포함합니다. redMultiplier, greenMultiplier, blueMultiplier 및 alphaMultiplier 승수 속성은 컬러 사진 필터 또는 컬러 썬글라스처럼 작동하여 표시 객체에서 특정 색상을 증가 또는 감소시킵니다. 오프셋 속성(redOffset, greenOffset, blueOffset, alphaOffset)을 사용하여 객체에 특정 색상을 추가하거나, 특정 색상이 가질 수 있는 최소값을 지정할 수 있습니다.

이러한 승수 및 오프셋 속성은 속성 관리자의 [색상] 팝업 메뉴에서 [고급]을 선택할 때 Flash 제작 도구에서 무비 클립 심볼에 사용할 수 있는 고급 색상 설정과 동일합니다.

다음 코드에서는 JPEG 이미지를 로드하고 색상 변환을 적용합니다. 이 변환에서는 마우스 포인터가 x축 및 y축을 따라 이동하면서 빨강 및 녹색 채널을 조정합니다. 이 경우 오프셋 값이 지정되어 있지 않기 때문에 화면에 표시된 각 색상 채널의 색상 값은 이미지의 원본 색상 값의 백분율입니다. 즉, 특정 픽셀에 표시되는 가장 진한 빨강 또는 녹색이 해당 픽셀의 원본 빨강 또는 녹색의 양입니다.

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);