페이지 정보

AS 3.0 비트맵
지금은 완전히 없어진 플래시 액션스크립트 3.0에 대해 예전 나의 블로그에 썼던 내용을 퍼왔다.
이유는 아마도 가장 재미있게 즐겼던 종목이 플래시였고, 그 중에 액션스크립트 2.0과 3.0의 세대였기에 많은 아쉬움이 있다.
기술의 발달과 트랜드라는것이 이런 것을 알기에 머리로는 이해하지만, 가슴으로는 추억에 남아 있고 또 여전히 즐기고 싶다.
비트맵은 픽셀로 이루어진 이미지 데이터를 의미한다.
액션스크립트로 비트맵을 조작하게되면 포토샵에서 할 수 있는 효과나 이미지 변형 등을 구현할 수 있다.

-AS3.0 에서 비트맵 형성 방법
var bmpData:BitmapData = new BitmapData (width,height,transparent,fillColor)
매개변수
width:Number 비트맵 이미지의 넓이로 단위는 픽셀이다.
height:Number 비트맵 이비지의 높이로 단위는 픽셀이다.
transparent:Boolean[선택사항] 비트맵 이미지에서 픽셀별 투명도를 지원하는지 여부를 지정한다.
기본값은 true(투명)이다. 완전 투명 비트맵을 만들려면 transparent 매개변수 값을 true로 설정하고,
fillColor 매개변수 값을 0x00000000(또는 0)으로 설정한다.
투명하면 alpha 채널까지 포함이 되어 32비트가 된다. transparent 매개변수를 사용하지 않으면
기본적으로 비트맵은 투명하게 만들어 진다.
fillColor:number[선택사항] 비트맵 이미지 영역을 채우는데 사용되는 32비트 ARGB 색상값이다.
기본값은 0xFFFFFFFF(흰색)이다.
만약 300*300 크기의 불투명 빨간색 BitmapData 객체를 만들고자 한다면 아래와 같다.
var bmpData:BitmapData = new BitmapData (300, 300, false, 0xff0000);
여기서 한가지 중요한 사실이 있다.
BitmapData 객체의 최대 높이와 넓이는 2880픽셀이다. 넓이나 높이를 2880보다 큰 값으로
지정하면 새로운 객체는 생성되지 않는다. 비트맵 작업은 RAM과 CPU의 자원을 필요로 하기 때문이다.
ARGB는 한 개의 색상당 1Byte(8bit)이므로 한 픽셀은 4바이트가 필요하다.
500*500 정도의 픽셀 작업을 하려면 250,000픽셀 * 4바이트 = 1000000바이트 =
약 1MB RAM이 필요하다. 2880 * 2880은 32RAM이 필요하다. 따라서 비트맵 작업을 하다가
더 이상 작업을 하지 않을 때는 컴퓨터가 느려지지 않도록 dispose() 메서드를 사용해 제거해 준다.
-비트맵 랜더링
비트맵을 생성하고 비트맵 조작을 한 후 화면에 보이게 하려면 addChild(BitmapData)라고 하면
될 것 같지만 BitmapData 클래스는 DisplayObject가 아니다. 즉, addChild() 메서드를 통해
BitmapData를 바로 화면에 나타낼 수 없다.
DisplayObject의 하위 클래스에는 BitmapData 대신에 Bitmap 클래스가 있다.
Bitmap 클래스는 BitmapData 클래스에서 작업된 것을 화면에 보여 주는 일을 하게 된다.
Bitmap 클래스에서 BitmapData 클래스를 연결하는 방법은, Bitmap 객체 생성 시 매개변수로
BitmapData 클래스를 사용하는 것이다. 그리고 Bitmap 객체를 addChild() 메서드로 DisplayList에
추가하면 화면에 나타나는 것이다. 다시 말해, 일은 BitmapData가 하고, 화면에 보여주는 것은
Bitmap이 하는 것이다.
var bmpData:BitmapData = new BitmapData (width, height, transparent, fillColor)
var bmp : Bitmap = new Bitmap (bmpData)
addChild(bmp)
-BitmapData 클래스의 속성과 메서드
속성
heightNumber [읽기전용] - 비트맵 이미지의 높이로, 단위는 픽셀
rectangle:Rectangle [읽기전용] - 비트맵 이미지의 크기와 위치를 정의하는 사각형
transparent:Boolean [읽기전용] - 비트맵 이미지에서의 픽셀별 투명도를 지원하는지 여부 결정
width:Number [읽기전용] - 비트맵 이미지의 넓이로, 단위는 픽셀
메서드
applyFilter() - 소스 이미지와 filter 객체를 사용해 필터링된 이미지를 생성
clone() - 원본 객체를 내포된 비트맵까지 똑같이 복제한 새 BitmapData 객체를 반환
colorTransform() - colorTransform 객체를 사용하여 비트맵 이미지의 지정된 영역에서 색상값을 조정
compare - 두 BitmapData 객체를 비교
copyChannel() - 현재 BitmapData 객체나 다른 BitmapData 객체의 채널에서 현재 BitmapData 객체의 채널로 데이터를 전송
copyPixels() - 연장효과나 회전효과 또는 색상효과 없이 이미지에서 픽셀을 조작할 수 있는 빠른 경로 제공
dispose() - BitmapData 객체를 저장하는데 사용된 메모리를 비움
draw() - Flash Player 벡터 렌더러를 사용하여 소스 이미지나 무비클립을 대상 이미지 위에 그림
fillRect() - 사각형의 픽셀 영역을 지정된 ARGB 색상으로 채움
floodFill() - (x,y) 좌표에서 색상 채우기 작업을 시작하여 정해진 색상으로 이미지를 채움
generateFilterRect() - 주어진 BitmapData 객체와 소스 사각형 및 filter 객체를 기준으로 applyFilter() 메서드 호출이 적용될 대상 사각형을 결정
getColorBoundsRect() - 비트맵 이미지 내에서 지정된 색상의 픽셀 전체를 완전히 감싸는 사각형의 영역을 결정
getPixel() - 특정 점(x,y)에서 BitmapData 객체로부터 RGB 픽셀값을 나타내는 정수를 반환
getPixel32() - 알파 채널 데이터와 RGB 데이터를 포함하는 ARGB색상값을 반환
hitTest() - 하나의 비트맵 이미지와 점, 사각형 또는 다른 비트맵 이미지 사이에서 픽셀 차원의 히트 감지를 수행
lock() - 이 BitmapData 객체를 변경할때 BitmapData 객체를 참조하는 어떤 객체도 업데이트 되지 않도록 이미지를 잠금
merge() - 소스 이미지에서 대상 이미지로 채널별 블랜드를 수행
noise() - 임의의 노이즈를 나타내는 픽셀로 이미지를 채움
paletteMap() - 각 채널에 하나씩 최대 네개까지의 색상 팔레트 데이터 배열이 있는 이미지에서 색상 채널값을 다시 매핑
perlinNoise() - Perlin 노이즈 이미지를 생성
pixelDissolve() - 소스 이미지에서 대상 이미지로, 혹은 같은 이미지를 사용하여 픽셀 디졸브(dissolve)를 수행
scroll() - 주어진 (x,y) 픽셀 양만큼 이미지를 스크롤
setPixel() - BitmapData 객체에 포함된 단일 픽셀의 색상을 설정
setPixel32 - BitmapData 객체에 포함된 단일 픽셀 낱개의 색상 및 알파 투명도 값을 설정
threshold - 이미지의 픽셀값을 지정한 임계값 기준으로 테스트하고 테스트 결과를 전달할 픽셀을 새 새상값으로 설정
unlock - 이 BitmapData 객체를 변경할 때 BitmapData 객체를 참조하는 임의의 객체도 업데이트 되도록 이미지 잠금을 해제
-비트맵 이미지 제작 방법
그럼 비트맵 이미지를 만들어 보자. 만드는 방법에는 4가지 정도가 있다.
1. BitmapData 클래스를 사용.
2. 라이브러리에 있는 이미지를 사용.
3. Loder 클래스를 사용.
4. drew() 메서드 사용.
1. Bitmap 클래스를 사용해 만들어 보자.
100*100 크기의 빨간색 비트맵을 생성하여 나타낸다.
var bmd:BitmapData = new BitmapData(100, 100, false, 0xff0000); //BitmapData 클래스를 사용해 100*100 크기의 불투명 빨간색 생성
var bmp:Bitmap = new Bitmap(bmd); //비트맵에 BitmapData 객체를 전달
addChild(bmp); //비트맵을 화면에 출력
var bmd2:BitmapData = newBitmapData(100,100, true, 0x80ff0000); //100*100 크기의 투명한 빨간색. 투명도는 16진수로 80을 설정.
(16진수로 80은 10진수로 128을 의미한다.)
var bmp2:Bitmap = new Bitmap(bmd2); //비트맵에 BitmapData 객체를 전달
bmp2.x = 150; //두번째 빨간색을 x축으로 150 이동
addChild(bmp2); //비트맵2를 화면에 출력
스테이지에 첫번째 비트맵은 100*100 크기의 불투명 빨간색이고, 두 번째 비트맵은 100*100 크기의 투명한 빨간색으로 50% 의 투명도가
설정된 것을 볼 수 있다.
2. 라이브러리에 있는 이미지를 사용해 비트맵 이미지를 만들어 보자.
라이브러리에 있는 이미지를 비트맵으로 사용하려면 라이브러리에 있는 이미지를 선택한 후 마우스 오른쪽 버튼을 클릭하여
[Linkage Properties] 대화상자의 Class 란에 클래스 이름을 지정해 주면 이미지가 BitmapData 클래스에 연결된다.
완성 파일을 열어 라이브러리 안의 이미지를 선택한후 [Linkage Properties] 대화상자를 열어서 Pic 이라고 이름을 지정해 보자.
기본 클래스(Base Class)는 자동으로 flash.display.BitmapData 이므로 Pic 클래스 이미지는 자동으로 BitmapData를 기반으로
상속된 BitmapData 클래스가 되는 것이다.
var bmd:BitmapData = new Pic(0,0);
var bmp:Bitmap = new Bitmap(bmd);
addChild(bmp);
Pic 클래스를 new를 사용해 BitmapData 객체 생성을 하였다.
여기서 중요한 것은 BitmapData 클래스의 생성자가 반드시 이미지의 width와 height를 지정해 주어야 한다. 그래서 BitmapData를
상속한 Pic 클래스도 가로*세로 사이즈를 매개변수로 넘겨주어야 한다.
그러나 실제로 이미지 사이즈를 입력할 필요는 없으므로 보통 new Pic(0,0)을 사용한다.
출처 - 내블로그
- 이전글tubular Video controls 22.03.21
댓글목록
There are no registered comments

