[Expression Blend] Image를 3D화시키자!

기존 포스트들은 예제들을 가지고 했었는데 간단한 기능에 대해서 소개해보는 것을 해보고자 합니다. 그중 이번에 소개할 내용은 이미지를 3D화 시키는 내용입니다. 블랜드 상에서는 ViewPort3D라는 이름으로 포함되어 있습니다.

 우선은 WPF로 프로젝트를 아무거나 만들어 봅시다. 그리고 사진을 하나 첨부시켜봅시다.

사진을 첨부하다보면 위와 같은 메세지가 뜨게 됩니다. 경고 메세지는 아닌데 무슨 내용일까 싶은데 내용은 즉 이미지가 250kb이상의 크기가 되기 때문에 나중에 실행파일로 만들때 포함시킬 수 있도록 복사하겠느냐를 물어보는 겁니다. 물론 하는 것이 좋습니다. 

 다들 아시겠지만 블랜드 상에서는 미리보기, 즉 섬네일이 지원됩니다. 그래서 프로젝트 창에서 해당 사진에 마우스를 올리면

와 같이 미리보기가 되는 겁니다. 이걸 기존에 나와있는 MainWindow 상에 올려놓읍시다. 그냥 더블클릭하거나 마우스 우클릭 후 Insert를 선택하면 됩니다.

짠 이렇게 들어왔습니다.보면 Window를 감싸고 있는건 LayoutRoot라고 이름붙여진 Grid입니다. 이 안에 사진이 들어간 형태이지요. 이 사진을 선택한 상태에서 Tools 메뉴를 선택하면 중간에 Make Image 3D라는 항목이 있습니다. 

이렇게 하면 기존에 Image로 되어있던 그림이 ViewPort3D로 바뀌고 세부 요소가 다음과 같이 구성되게 됩니다.

그런데 지금 나타나고 있는 뷰 자체는 기존과 별반 차이가 없어보입니다. 

그렇습니다. 지금 하고 있는건 이미지 자체를 3D화시키는 것이 아니라 카메라의 뷰를 조절함으로써 이미지의 모양이 변경되게 한다는 겁니다. 그건 좌측에 있는 Camera Orbit을 선택한 후에 변화시킬 수 있습니다.

자 눌러보고 자유롭게 돌려봅시다.

이렇습니다. 그런데 이렇게 Camera Orbit으로만 뷰를 조절할 수 있는게 아니라 또 세부항목이 있습니다. 아까 Timeline창에 보면 Camera 항목이 따로 있는 걸 보셨을 겁니다. 그안에 들어가 있는게 PerspectiveCamera인데 이게 있다면 또 어딘가에는 Orthographic으로 바꿀 수 있다는 예상이 들지요. 이 것에 대한 설정은 좌측 Properties에서 찾을 수 있습니다.

Timeline창에서 PerspectiveCamera를 선택한채 넘어오면 Camera에 관한 설정을 할 수 있는 창이 나타납니다. 잠깐 간단하게 이야기 하자면 Orthographic 은 직교 투영이라는 방식, 즉 카메라가 이미지의 수평적인 위치에서 바라보는 뷰입니다. 그렇기 때문에 뷰의 시점과 이미지와의 거리보다는 카메라의 위치가 중요한 요소가 될겁니다.

출처: http://db-in.com/blog/2011/04/cameras-on-opengl-es-2-x/

반면 Perspective view는 원근 투영이라고 해서 카메라의 시점에 따른 뷰가 이미지와의 거리와 각도의 영향을 받는 겁니다. 원근이라는 말에서도 알 수 있다시피 거리적요소가 중요하겠지요. 보통 모델링 많이 하시는 분이라면 이런 개념에 빠삭하실거라고 생각합니다.

아무튼.. 이 카메라 속성값을 조절해보는 걸 잠깐 보여드리겠습니다. 

참고로 PerspectiveView를 선택하면 전체적인 뷰 크기를 Field라는 이름으로 수정합니다. 그리고 Orthographic 에서는 width라는 이름으로 수정이 가능합니다. 같은 것처럼 보이지만 실질적으로는 다르다는 걸 유념하셔야 합니다. 

 아무튼 이미지 자체를 3D화시키는 시키는게 아니라서 아쉬워하실 분도 있겠지만 뷰를 조절함으로써 약간의 입체적인 효과를 부여할 수 있는 기능이 내재되어있습니다 :)