행렬의 등장
기존의 윈도우 애플리케이션 개발자가 Direct2D를 접할 때,
가장 생소한 개념은 행렬( Matrix ) 일 것입니다.
즉, 아래의 API 이겠죠?
<코드>
::g_ipRT->SetTransform( ::D2D1::Matrix3x2F::Identity() );
</코드>
우리는 항상 렌더링 작업을 하기 전에, 이 작업을 해주었습니다.
이것은 과연 무슨 의미를 가지고 있는 것일까요?
불행하게도(?) Direct2D에서 각종 변환 작업을 위해서는 행렬( Matrix )을 사용합니다.
저는 고등학교 2학년 학기 초에 배웠던 기억이 있습니다.
그 때는 주로 연립 방정식의 해를 구하기 위해서 풀이 방법을 익혔습니다.
아마 대부분 저와 비슷하실 것이라 생각이 듭니다.
왜 뜬금없이 행렬이 등장했는지를 언급하고자 하면, 상당히 고통스럽습니다.^^
저는 이 행렬에 대한 깊은 이해를 원하지 않습니다.
제가 원하는 것은 이 행렬 관련 API를 이용해서 화면 상에 나오는 오브젝트들의
이동이나 회전 등과 같은 변환을 표현 할 수 있다는 것만 아셨으면 좋겠습니다.^^
Direct2D 에서는 3ⅹ2 행렬을 사용합니다.
행렬의 각 성분들은 아래와 같습니다.
|
M11 Default : 1.0 |
M12 Default : 0.0 |
|
M21 Default : 0.0 |
M22 Default : 1.0 |
|
M31 OffsetX : 0.0 |
M32 OffsetY : 0.0 |
이 행렬은 D2D1_MATRIX_3X2 라는 구조체로 표현됩니다.
Direct2D에서는 이 행렬을 손쉽게 다루기 위해서 Matrix3x2F 라는 유틸리티 기능을 지원합니다.
우리는 주로 이 Matrix3x2F 의 기능을 이용해서 변환 정보를 설정할 것입니다.
행렬의 M11, M12, M21, M22 성분은 회전과 확대/축소와 관련된 수치가 입력됩니다.
M31과 M32에는 이동과 관련된 수치가 입력됩니다.
행렬의 수치를 통해서 우리가 원하는 변형을 하고자 할 때,
이들 수치를 직접 입력해서 행렬을 제어하기는 무척 어렵습니다.
그래서 Direct2D 에서 제공하는 개발자 편의를 위한 여러 클래스들을 사용해서 이들 수치를 제어합니다.
스크린 좌표계
변환의 이해를 위해서는 좌표계에 대한 이해가 필수적입니다.
우리가 가장 많이 사용하는 좌표계는 당연히 2차원 좌표계입니다.
바로 모니터가 2차원이기 때문입니다.
하지만 이전에도 언급드린 적이 있지만,
컴퓨터 모니터의 좌표계는 우리가 일반적으로 알고 있는 2차원 좌표계가 아닙니다.
좌측이 우리가 흔히 학창시절에 배우는 2차원 데카르트 좌표계( 2D Cartesian coordinate system ) 입니다.
우측이 컴퓨터 모니터가 사용하는 스크린 좌표계입니다.
이점 잘 숙지 하시고, 다음 내용을 보시기 바랍니다.^^
이번에 제공되는 샘플의 결과는 다음과 같습니다.
이동( Translate )
먼저 살펴 볼 것은 이동( Translate ) 입니다.
가장 위에 있는 이미지가 바로 이동만 적용된 형태입니다.
샘플에서는 단순히 ( X,Y ) 축으로 +20씩만 움직였습니다
<코드>
D2D1::Matrix3x2F matTranslation;
matTranslation = ::D2D1::Matrix3x2F::Translation( 20.0f, 20.0f );
::g_ipRT->SetTransform( matTranslation );
::g_ipRT->DrawBitmap( ::g_ipD2DBitmap, dxArea );
</코드>
D2D1::Matrix3x2F::Translation() 를 통해서 우리가 원하는 이동을 수행하고 있습니다.
쉽죠? 이런 식으로 하면 행렬에 대한 깊은 이해도 필요하지 않을 것이라 생각합니다.^^
회전( Rotate )
두 번째는 회전입니다.
샘플에서는 두 번째 그림과 세 번째 그림이 바로 회전 변환에 대한 결과물입니다.
사실 회전은 행렬의 성분들을 굉장히 복잡한 수치로 변경시킵니다.
왜냐하면 이들 회전 수치들은 삼각함수 값들이기 때문입니다.
하지만, 두려워하지 마시기 바랍니다.
Direct2D 에서는 이를 편리하게 수행하기 위해
::D2D1::Matrix3x2F::Rotation() 를 제공하고 있습니다.
회전 시킬 때, API 에 입력되는 값이 회전량과 회전 중점입니다.
회전량의 경우에는 라디안 값이 아닌, 각도 값이 입력됨을 주의하시기 바랍니다.
즉, Degree 값입니다.
그리고 이 회전량의 경우 음의 값과 양의 값을 모두 입력이 가능합니다.
음의 값이 입력이 되면 시계 반대 방향으로 회전을 수행하게 됩니다.
( 양수면 시계방향으로 회전 합니다. )
또한 회전 중점의 경우도 유의해야 하는데, 아래의 그림을 보시기 바랍니다.
좌측 그림의 경우에는 물체의 중점 위치를 기준으로 회전을 수행한 것입니다.
반면에, 우측 그림의 경우에는 물체의 좌측 상단을 기준으로 회전을 수행한 것입니다.
결과물이 다르죠?
이처럼 회전 변환을 할 때는 이 두 가지를 잘 고려해서 수행해야 합니다.
<코드>
matRot = ::D2D1::Matrix3x2F::Rotation( -30.0f,
D2D1::Point2F( 120.0f, 320.0f ) );
::g_ipRT->SetTransform( matRot );
::g_ipRT->DrawBitmap( ::g_ipD2DBitmap, dxArea );
</코드>
이동과 회전의 결합
지금까지 이동과 회전을 각각 수행해 보았습니다.
만약에 이동 작업과 회전 작업이 모두 한 오브젝트에 필요하다면 어떻게 해야 할까요?
그런 경우가 필요하다면 바로 행렬의 곱셈 작업을 적용합니다.
그러면 이 두 가지 작업을 모두 표현 할 수 있습니다.
그런데 이 때 주의 할 부분이 있습니다.
행렬은 교환 법칙이 성립하지 않습니다.
즉 행렬 A, B 가 있을 때, A * B != B * A 라는 것입니다.
<코드>
matTranslation = ::D2D1::Matrix3x2F::Translation( 20.0f, 220.0f ); matRot = ::D2D1::Matrix3x2F::Rotation( -30.0f,
D2D1::Point2F( 120.0f, 320.0f ) ); matTM = matTranslation * matRot;
::g_ipRT->SetTransform( matTM );
::g_ipRT->DrawBitmap( ::g_ipD2DBitmap, dxArea );
matTranslation = ::D2D1::Matrix3x2F::Translation( 300.0f, 220.0f ); matRot = ::D2D1::Matrix3x2F::Rotation( -30.0f,
D2D1::Point2F( 400.0f, 320.0f ) );
matTM = matRot * matTranslation;
::g_ipRT->SetTransform( matTM );
::g_ipRT->DrawBitmap( ::g_ipD2DBitmap, dxArea );
</코드>
이 코드가 우리의 샘플에서 두 번째와 세 번째 그림의 차이를 보여주는 것입니다.
두 번째 그림은 이동을 한 후에 회전 작업을 수행한 것이고,
세 번째 그림은 회전 작업을 수행한 후에 이동 작업을 수행한 것입니다.
실제로 우리가 수행하는 모든 변환은 좌표계 변환입니다.
위에서 우리가 했던 변환은 모두 실제로 오브젝트들의 좌표계를 변환시켜서 얻은 결과물들입니다.
이 개념들은 분명히 이해하기 어려운 부분들입니다.
굳이 이렇게 어려운 부분까지 이해하실 필요는 없습니다.
샘플을 올려드리니, 수치를 바꿔보면서 여러 결과들을 눈으로 확인해 보시기 바랍니다.^^
MatrixSample.zip
'DirectX 11' 카테고리의 다른 글
| [StartD2D-8] 투명 이미지 다루기 (5) | 2011/09/28 |
|---|---|
| [StartD2D-7] 변환의 중심과 확대/축소/찌그러짐 (1) | 2011/09/26 |
| [StartD2D-6] 이동/회전 변환 이해하기 (3) | 2011/09/21 |
| [짤막소식] Direct3D 11.1 릴리즈 소식과 Visual Studio 11 소식 (9) | 2011/09/19 |
| [StartD2D-5] Direct2D의 리소스 기본 개념. (1) | 2011/07/11 |
| [StartD2D-4] WIC 를 이용한 이미지 작업하기 (8) | 2011/07/04 |
Native Cpp 개발자를 위한 Cpp-CLI.pdf
댓글을 달아 주세요
지금 열심히 Direct2D를 파고 있습니다.
그런데 보통 게임 이미지에서 보면 배경색은 전부 투명색으로 바꿔서 출력하잖아요? Direct2D에는 그런게 없나요?
안녕하세요..^^
DirectX의 컬러키 개념을 얘기하시는 거 같은데,
Direct2D에서는 비슷한 개념으로 간편히 수행할 수 있는 API를 제가 찾지는 못했습니다.
다만, 지금 현재 올라가 있는 샘플들은 자동적으로 알파 색상 처리를 수행합니다.
즉, 알파처리가 된 이미지로 샘플을 실행하시면 원하시는 기능을 확인하실 수 있습니다.
이와 관련한 사항을 조만간 정리해서 올려두겠습니다.
(사실 조금 모호한 부분이 있어서 올리지 못하고 있습니다. )
그런데 보통 게임 이미지에서 보면 배경색은