블렌딩(Blending), 알파 블렌딩(Alpha Blending)이란 무엇일까?

 

블렌딩(Blending)란 무엇일까?

   블렌딩이란 '서로 다른 두개의 물건을 섞어서 다른 결과물을 만들어 내는 것'이다.

 

 그렇다면 알파 블렌딩(Alpha Blending)이란 무엇일까?

   알파 블렌딩이란 이미지위에 또다른 이미지를 덧씌울때 마치 투명하게 비치는 효과를 내기위해 컴퓨터의 색상표현 값 'RGB'에 'A'라는 새로운 값을 할당하여 배경 RGB값과 그 위의 RGB값을 혼합하는 표시하는 방법을 뜻한다.

 Alpha값에 8비트가 할당되어 0 ~ 255까지 값을 표현할 수 있다고 하였을 때에

    Alpha 30   Alpha 128 Alpha 255

 다음과 같이 표시된다. 그럼 이제 알파 블렌딩을 직접 구현해보자.

 ----------------------------------------------------------------------------------------------------------------

 물감 A와 물감 B가 있다고 가정해보자, 이 물감 A와 물감 B를 섞는다고 가정했을 때 공식은 이렇다.

  xA + yB = 섞인 물감

 이 공식을 변형시켜보면 

  x + y = 1

 이 나온다. 이 공식을 이용해 처음 공식을 변형시켜보면

  xA + (1 - x)B = 섞인 물감

 이라는 공식이 나오게된다. 그렇다면 이 공식을 이용하여 소스코드를 짜보자

  - src는 그리고자하는 색, dst는 이미 그려져 있는 색, result는 alpha값을 섞어 최종적으로 나오게 되는 색이다.

1. int r, g, b, src, dst, result;
2.  
3. float dstR, dstG, dstB, srcA, srcR, srcG, srcB;
4.  
5. srcA = ((src & 0xff000000) >> 24) / 255.f;
6. srcB = (float)((src & 0xff0000) >> 16);
7. srcG = (float)((src & 0x00ff00) >> 8);
8. srcR = (float)((src & 0x0000ff));
9.  
10. dstB = (float)((dst & 0xff0000) >> 16);
11. dstG = (float)((dst & 0x00ff00) >> 8);
12. dstR = (float)((dst & 0x0000ff));
13.  
14. r = srcR * srcA + (1.f - srcA) * dstR;
15. g = srcG * srcA + (1.f - srcA) * dstG;
16. b = srcB * srcA + (1.f - srcA) * dstB;
17.  
18. result = (b << 16) | (g << 8) | (r << 0);

그런데 이 소스코드는 커다란 문제점이 존재한다. 쑥 훑어보면 알겠지만 느리다 소스코드를 좀더 가볍게 만들어보자

 가장 거슬리는 부분은 부동 소수점을 사용한 것, 이 부동 소수점을 정수로 바꿔보자, 위의 수식을 0 ~ 255단위로 고쳐보면

 aX + (255 - a)Y / 255

라는 공식이 나온다. 이 공식을 인수분해를 통해서 식을 단순화 시켜보면

 (X - Y)a + Y

라는 공식이 나온다. 이제 이 공식을 이용해 코드를 짜보자

1. int r, g, b, src, dst, result;
2.  
3. unsigned dstR, dstG, dstB, srcA, srcR, srcG, srcB;
4.  
5. srcA = ((src & 0xff000000) >> 24) / 255.f;
6. srcB = (src & 0xff0000) >> 16;
7. srcG = (src & 0x00ff00) >> 8;
8. srcR = (src & 0x0000ff);
9.  
10. dstB = (dst & 0xff0000) >> 16;
11. dstG = (dst & 0x00ff00) >> 8;
12. dstR = (dst & 0x0000ff);
13.  
14. r = (srcR - dstR) * srcA + dstR;
15. g = (srcG - dstG) * srcA + dstG;
16. b = (srcB - dstB) * srcA + dstB;
17.  
18. result = (b << 16) | (g << 8) | (r << 0);

 

 

 

참조 :  http://nogravity.egloos.com/m/9096803

 

 

17. 블렌딩.pptx

 

17. 블렌딩.pptx

2.3MB