드디어.. 오브젝트 조작하기의 마지막 챕터, transform 활용하기입니다. 화이트보드에서 유저는 ControlView를 이용해 ObjectView의 크기와 각도를 자유롭게 수정할 수 있습니다. 어떻게 구현했는지 함께 알아볼까요?


들어가기 앞서, 선형 변환에 대해 알아봅시다..

모두가 알고 있는 것처럼, 함수(또는 변환)는 어떤 집합의 각 원소를 다른 어떤 집합의 유일한 원소로 대응시키는 관계를 말합니다. 쉽게 말해서 입력값에 따라 특정한 출력값이 있다는 소리죠.

선형대수학에서 다루는 선형 변환(linear transform)은 하나의 벡터 공간을 다른 백터 공간으로 매핑(사상)하는 함수입니다. 선형 변환은 벡터의 덧셈과 스칼라 곱셈같은 연산은 유지하지만, 기하학적으로 벡터 공간에서의 선형적 성질을 변형시키는 역할을 합니다. 그리고 **행렬(matrix)이 이런 선형 변환을 벡터에 적용하는 도구(함수)**로 사용됩니다.

저희에게 익숙한 2차원 좌표계는 아래와 같은 기저 벡터 i, j 두개로 정의할 수 있습니다.

$$ \begin{bmatrix} 1 \\ 0 \\ \end{bmatrix} $$

                              **기저 벡터 i**

$$ \begin{bmatrix} 0 \\ 1 \\ \end{bmatrix} $$

                    **기저 벡터 j**

image.png

이 벡터 공간에서의 모든 벡터는 두 기저 벡터의 선형 결합으로 표현될 수 있습니다.

$$ v = \begin{bmatrix} 1 \\ 1 \\ \end{bmatrix} $$

예를 들어 위에서 파란색 벡터 v는 다음과 같이 표현될 수 있습니다.

$$ v = i + j $$

이제 새로운 기저 벡터 i’와 j’를 각각 아래와 같이 정의해보겠습니다.

$$ \begin{bmatrix} 2 \\ 1 \\ \end{bmatrix} $$

                              **기저 벡터 i’**

$$ \begin{bmatrix} 1 \\ 2 \\ \end{bmatrix} $$

                    **기저 벡터 j’**

그럼 벡터 v를 아래 행렬 A를 통해 변환해보겠습니다.

$$ A = \begin{bmatrix} 2 &1 \\ 1 &2 \\ \end{bmatrix} $$

$$ Av = \begin{bmatrix} 2 &1 \\ 1 &2 \\ \end{bmatrix} \begin{bmatrix} 1 \\ 1 \\ \end{bmatrix}

\begin{bmatrix} 21 & + & 11 \\ 11 & + &21 \\ \end{bmatrix}

\begin{bmatrix} 3 \\ 3 \\ \end{bmatrix} $$

이걸 그림으로 표시하면 아래와 같습니다.