픽셀 조작

Flash Player 9 이상, Adobe AIR 1.0 이상

BitmapData 클래스에는 픽셀 데이터 값을 조작할 수 있는 메서드 집합이 포함되어 있습니다.

개별 픽셀 조작

픽셀 수준에서 비트맵 이미지의 모양을 바꿀 때에는 먼저 조작할 영역 내에 포함된 픽셀의 색상 값을 확인해야 합니다. 이러한 픽셀 값은 getPixel() 메서드를 사용하여 확인할 수 있습니다.

getPixel() 메서드는 매개 변수로 전달된 x, y(픽셀) 좌표에서 RGB 값을 가져옵니다. 조작하려는 픽셀에 투명도(알파 채널) 정보가 포함된 경우에는 getPixel32() 메서드를 사용해야 합니다. 이 메서드도 RGB 값을 가져오지만 getPixel()과는 다릅니다. getPixel32()에는 선택된 픽셀의 알파 채널(투명도) 값을 나타내는 추가 데이터가 포함되어 있습니다.

또는 비트맵에 포함된 픽셀의 색상이나 투명도만 변경하려는 경우에는 setPixel() 또는 setPixel32() 메서드를 사용할 수 있습니다. 픽셀 색상을 설정하려면 x, y 좌표 및 색상 값을 이러한 메서드 중 하나에 전달하기만 하면 됩니다.

다음 예제에서는 setPixel() 메서드를 사용하여 녹색 BitmapData 배경에 십자가를 그립니다. 그런 다음 getPixel() 메서드를 사용하여 좌표 50, 50에 있는 픽셀의 색상 값을 가져오고 반환된 값을 추적합니다.

import flash.display.Bitmap; 
import flash.display.BitmapData; 
 
var myBitmapData:BitmapData = new BitmapData(100, 100, false, 0x009900); 
 
for (var i:uint = 0; i < 100; i++) 
{ 
    var red:uint = 0xFF0000; 
    myBitmapData.setPixel(50, i, red); 
    myBitmapData.setPixel(i, 50, red); 
} 
 
var myBitmapImage:Bitmap = new Bitmap(myBitmapData); 
addChild(myBitmapImage); 
 
var pixelValue:uint = myBitmapData.getPixel(50, 50); 
trace(pixelValue.toString(16));

단일 픽셀이 아닌 픽셀 그룹의 값을 읽으려는 경우에는 getPixels() 메서드를 사용합니다. 이 메서드는 매개 변수로 전달된 픽셀 데이터의 사각형 영역에서 바이트 배열을 생성합니다. 각각의 바이트 배열 요소(즉, 픽셀 값)는 부호 없는 정수(32비트, 곱하지 않은 픽셀 값)입니다.

반대로 픽셀 그룹의 값을 변경하거나 설정하려면 setPixels() 메서드를 사용합니다. 이 메서드는 두 매개 변수(rectinputByteArray)가 입력될 때까지 기다린 후 이 둘을 결합하여 픽셀 데이터(inputByteArray)의 사각형 영역(rect)을 출력합니다.

inputByteArray에서 데이터를 읽고 기록하면 배열의 각 픽셀에 대해 ByteArray.readUnsignedInt() 메서드가 호출됩니다. 어떤 이유로 인해 inputByteArray에 픽셀 데이터에 해당하는 전체 사각형이 포함되어 있지 않으면 해당 시점에서 메서드가 이미지 처리를 중단합니다.

픽셀 데이터를 가져오고 설정하려면 바이트 배열이 32비트 알파, 빨강, 녹색, 파랑(ARGB) 픽셀 값이어야 합니다.

다음 예제에서는 getPixels()setPixels() 메서드를 사용하여 픽셀 그룹을 한 BitmapData 객체에서 다른 BitmapData 객체로 복사합니다.

import flash.display.Bitmap; 
import flash.display.BitmapData; 
import flash.utils.ByteArray; 
import flash.geom.Rectangle; 
 
var bitmapDataObject1:BitmapData = new BitmapData(100, 100, false, 0x006666FF); 
var bitmapDataObject2:BitmapData = new BitmapData(100, 100, false, 0x00FF0000); 
 
var rect:Rectangle = new Rectangle(0, 0, 100, 100); 
var bytes:ByteArray = bitmapDataObject1.getPixels(rect); 
 
bytes.position = 0; 
bitmapDataObject2.setPixels(rect, bytes); 
 
var bitmapImage1:Bitmap = new Bitmap(bitmapDataObject1); 
addChild(bitmapImage1); 
var bitmapImage2:Bitmap = new Bitmap(bitmapDataObject2); 
addChild(bitmapImage2); 
bitmapImage2.x = 110;

픽셀 수준 충돌 감지

BitmapData.hitTest() 메서드는 비트맵 데이터와 다른 객체 또는 점 사이에서 픽셀 수준의 충돌이 있었는지 여부를 감지합니다.

BitmapData.hitTest() 메서드는 다음 5개의 매개 변수를 사용합니다.

  • firstPoint(점): 히트 테스트가 수행되는 첫 번째 BitmapData의 왼쪽 위 모서리의 픽셀 위치를 나타내는 매개 변수입니다.

  • firstAlphaThreshold(단위): 해당 히트 테스트에 대해 불투명으로 간주되는 최고 알파 채널 값을 지정하는 매개 변수입니다.

  • secondObject(객체): 영향을 받는 영역을 나타내는 매개 변수입니다. secondObject 객체는 Rectangle, Point, Bitmap 또는 BitmapData 객체일 수 있습니다. 또한 충돌 감지가 수행되는 히트 영역을 나타냅니다.

  • secondBitmapDataPoint(점): 2차 BitmapData 객체의 픽셀 위치를 정의하는 데 사용되는 선택적 매개 변수로서, secondObject의 값이 BitmapData 객체일 경우에만 사용됩니다. 기본값은 null입니다.

  • secondAlphaThreshold(단위): 2차 BitmapData 객체에서 불투명으로 간주되는 최고 알파 채널 값을 나타내는 선택적 매개 변수로서, 기본값은 1이며 secondObject의 값이 BitmapData 객체이고 두 BitmapData 객체가 모두 투명 객체일 때만 사용됩니다.

불투명 이미지에서 충돌 감지 작업을 수행할 경우 ActionScript에서는 이미지를 완전히 불투명한 사각형(또는 경계 상자)처럼 처리한다는 것을 염두에 두십시오. 또는 투명한 이미지에서 픽셀 수준의 히트 테스트를 수행할 경우 두 이미지 모두 투명해야 합니다. 이외에도 ActionScript는 알파 임계값 매개 변수를 사용하여 픽셀이 투명에서 불투명으로 바뀌는 지점을 결정합니다.

다음 예제에서는 세 개의 비트맵 이미지를 만든 다음 두 개의 서로 다른 충돌점(한 점에서는 false를, 다른 점에서는 true를 반환)을 사용하여 픽셀 충돌 여부를 확인합니다.

import flash.display.Bitmap; 
import flash.display.BitmapData; 
import flash.geom.Point; 
 
var bmd1:BitmapData = new BitmapData(100, 100, false, 0x000000FF); 
var bmd2:BitmapData = new BitmapData(20, 20, false, 0x00FF3300); 
 
var bm1:Bitmap = new Bitmap(bmd1); 
this.addChild(bm1); 
 
// Create a red square. 
var redSquare1:Bitmap = new Bitmap(bmd2); 
this.addChild(redSquare1); 
redSquare1.x = 0; 
 
// Create a second red square. 
var redSquare2:Bitmap = new Bitmap(bmd2); 
this.addChild(redSquare2); 
redSquare2.x = 150; 
redSquare2.y = 150; 
 
// Define the point at the top-left corner of the bitmap. 
var pt1:Point = new Point(0, 0); 
// Define the point at the center of redSquare1. 
var pt2:Point = new Point(20, 20); 
// Define the point at the center of redSquare2. 
var pt3:Point = new Point(160, 160); 
 
trace(bmd1.hitTest(pt1, 0xFF, pt2)); // true 
trace(bmd1.hitTest(pt1, 0xFF, pt3)); // false