Blend에서 개체 이동 및 변형

Blend for Visual Studio에서는 위치 변경, 크기 조정, 좌표 이동, 배율 조정, 회전, 기울이기, 대칭 이동, 각 개체의 중심점 변경 등의 작업을 수행하여 이미지, 텍스트 및 벡터 개체를 쉽게 수정할 수 있습니다. 아트보드에서 직접 변경하거나 속성 패널의 레이아웃변형 범주에서 속성을 변경하여 개체를 수정할 수 있습니다. 또한 브러시 변형 브러시 변형 도구 도구를 사용하여 이미지, 텍스트 및 벡터 개체의 브러시 속성만 수정할 수 있습니다.

아트보드에서 자유롭게 개체 수정

도구 패널의 **선택 ** 을 사용하여 아트보드의 개체를 선택하면Blend 에서는 개체를 수정하는 데 사용할 수 있는 핸들과 함께 경계 상자를 개체 주위에 표시합니다. Ctrl 키를 누른 상태에서 선택하면 한 번에 개체를 두 개 이상 선택할 수 있으며, 이 경우 선택 영역에 있는 모든 개체 주위에 경계 상자가 표시됩니다. 핸들 사용에 대한 간단한 팁과 함께, 변형을 적용하기 전과 후의 개체를 보여 주는 그림이 나와 있습니다.

수정

전/후

위치 변경

X, Y 또는 Z(3D 개체에만 해당) 축을 따라 개체를 이동합니다.

개체의 위치를 변경하려면 포인터가 더 작은 4방향 화살표가 있는 화살표 JJ169816.eff911a7-b891-4315-a86c-cc4cd088e647(ko-kr,VS.120).png로 바뀔 때까지 개체 위로 포인터를 이동한 다음 포인터를 끌어 개체를 이동합니다. 위치를 변경할 때 X 평면 또는 Y 평면으로만 이동을 제한하려면 Shift 키를 누른 상태로 끕니다.

개체의 위치를 변경하면 속성 패널의 레이아웃에서 개체의 속성이 변경됩니다. 위치를 변경하면 개체의 처음 위치만 변경됩니다. 이벤트 처리기를 사용하거나 애니메이션 타임라인에서 개체를 수정하지 않는 한, 위치를 변경해도 개체에 변형이 적용되지 않습니다. 이런 경우 위치를 변경하면 속성 패널의 변형 아래에 있는 좌표 이동JJ169816.962807da-746d-41bd-878c-0f89500f3907(ko-kr,VS.120).png 의 속성이 변경됩니다.

자세한 내용은 Blend에서 개체의 위치 변경 또는 좌표 이동을 참조하십시오.

아트보드에서 개체의 위치 변경

JJ169816.c7c8c2bc-c934-4dd5-a121-94d4ca82f294(ko-kr,VS.120).png

크기 조정

개체의 높이, 너비 및 깊이(3D 개체에만 해당)를 변경합니다.

개체의 크기를 조정하려면 포인터가 양방향 화살표(JJ169816.5b735d0c-fdc1-4d8b-a592-0e762cc7c635(ko-kr,VS.120).pngJJ169816.b1472e4f-1959-485d-901f-df5583a77bcb(ko-kr,VS.120).png,JJ169816.ec88bf27-dad4-4869-9146-0c9647c29cdc(ko-kr,VS.120).png 또는 )가 될 때까지 개체의 모퉁이 핸들이나 중간점 핸들 위로 포인터를 이동한 다음 포인터를 끌어 개체의 크기를 변경합니다. 크기를 조정할 때 Shift 키를 누르고 있으면 개체의 크기가 비례적으로(가로 세로 비율 고정) 조정됩니다. Alt 키를 누르고 있으면 중심점이 유지됩니다.

개체의 크기를 변경하면 속성 패널의 레이아웃 아래에 있는 개체의 속성이 변경됩니다. 크기를 조정하면 개체의 처음 크기만 변경됩니다. 트리거 또는 애니메이션 타임라인에서 개체를 수정하지 않는 한, 크기를 조정해도 개체에 변형이 적용되지 않습니다. 이런 경우 위치를 변경하면 속성 패널의 변형아래에 있는 비율 크기 조정JJ169816.7a93944e-a7f5-4607-babd-768bb5f56185(ko-kr,VS.120).png 의 속성이 변경됩니다.

자세한 내용은 Blend에서 개체의 크기 조정 또는 비율 크기 조정을 참조하십시오.

아트보드에서 개체의 크기 조정

JJ169816.1bf7361c-1d19-47e0-981b-222d7a8d69d4(ko-kr,VS.120).png

회전

중심점을 기준으로 개체를 회전합니다.

개체를 회전하려면 포인터가 회전 핸들 JJ169816.888cbf6b-c442-424d-977d-61d942703c4a(ko-kr,VS.120).png이 될 때까지 개체의 모퉁이 핸들 위로 포인터를 이동한 다음 포인터를 끌어 개체를 회전합니다. 개체를 회전할 때 Shift 키를 누르고 있으면 개체의 회전 각도가 15도씩 증가합니다. 중심점의 위치는 개체가 회전되는 방식에 영향을 줍니다. 포인터가 4방향 화살표 JJ169816.9003164f-1dd4-4a3b-8a4c-21a70d4b3ffb(ko-kr,VS.120).png가 될 때까지 개체의 가운데에 있는 핸들 위로 포인터를 이동한 다음 포인터를 끌어 개체의 중심점을 이동할 수 있습니다. 중심점을 이동하면 속성 패널의 변형아래에 있는 중심점JJ169816.49772b0c-095e-450b-967e-75dc1858966f(ko-kr,VS.120).png의 속성이 변경됩니다.

개체를 회전하면 속성 패널의 변형 아래에 있는 회전JJ169816.321b430b-5c8e-47dc-93f8-0e85ac32cca5(ko-kr,VS.120).png의 개체 속성이 변경됩니다. 회전하면 개체에 변형이 적용됩니다.

자세한 내용은 Blend에서 개체 회전Blend에서 개체의 중심점 변경를 참조하십시오.

아트보드에서 개체 회전

JJ169816.0ec39880-288d-4083-90f0-26b05c094977(ko-kr,VS.120).png

기울이기

X, Y 또는 Z(3D 개체에만 해당) 축을 따라 개체를 기울입니다.

개체를 기울이려면 포인터가 구분된 양방향 화살표 JJ169816.2be41f49-8a61-4966-bf08-598f4253b610(ko-kr,VS.120).png가 될 때까지 개체의 중간점 핸들 위로 포인터를 이동한 다음 포인터를 끌어 개체를 기울입니다. 이때 반대쪽 모퉁이 또는 가장자리의 위치를 유지하는 대신 중심점의 위치를 유지하려면 Alt 키를 누른 상태에서 기울입니다.

개체를 기울이면 속성 패널의 변형 아래에 있는 기울이기JJ169816.90c478da-1e6b-4b59-8322-445053058a6d(ko-kr,VS.120).png의 개체 속성이 변경됩니다. 기울이면 개체에 변형이 적용됩니다.

자세한 내용은 Blend에서 개체 기울이기을 참조하십시오.

아트보드에서 개체 기울이기

JJ169816.b5b43b8b-dd44-4d42-a0d2-f7fab35e6f33(ko-kr,VS.120).png

대칭 이동

X, Y 또는 Z(3D 개체에만 해당) 축을 따라 개체를 대칭 이동합니다.

개체를 대칭 이동하려면 포인터가 양방향 화살표(JJ169816.5b735d0c-fdc1-4d8b-a592-0e762cc7c635(ko-kr,VS.120).png, JJ169816.b1472e4f-1959-485d-901f-df5583a77bcb(ko-kr,VS.120).png, JJ169816.ec88bf27-dad4-4869-9146-0c9647c29cdc(ko-kr,VS.120).png 또는 JJ169816.7d350cd4-6d4f-40bc-9d04-d46d2d54ebee(ko-kr,VS.120).png)가 될 때까지 개체의 모퉁이 핸들이나 중간점 핸들 위로 포인터를 이동한 다음 반대쪽 면이나 모퉁이를 지나도록 포인터를 끕니다. 크기를 조정할 때 Shift 키를 누르고 있으면 개체의 크기가 비례적으로(가로 세로 비율 고정) 조정됩니다. Alt 키를 누르고 있으면 중심점이 유지됩니다.

개체를 대칭 이동하면 속성 패널의 변형 아래에 있는 대칭 이동 탭 JJ169816.90c478da-1e6b-4b59-8322-445053058a6d(ko-kr,VS.120).png에서 단추를 선택할 때와 같은 결과가 발생합니다. 대칭 이동하면 음의 비율 크기 조정 값을 포함하는 변형이 개체에 적용됩니다.

자세한 내용은 Blend에서 개체 대칭 이동을 참조하십시오.

아트보드에서 개체 대칭 이동

JJ169816.8bfb0802-a741-429c-9608-03d706a3328c(ko-kr,VS.120).png

특정 속성을 설정하여 개체 수정

속성 패널의 레이아웃변형에서 속성에 대해 특정 값을 입력하여 개체를 정밀하게 수정할 수 있습니다. 속성 패널을 사용하면 회전, 기울이기 각도, 대칭 이동 각도, 비율 크기 조정 값, 좌표 이동 값 및 중심점과 같은 변형뿐만 아니라 처음 높이, 너비, 맞춤, 여백 등 개체의 세부 사항을 쉽게 제어할 수 있습니다.

참고

속성 패널의 레이아웃변형 아래에 있는 대부분의 속성에서는 Blend 숫자 편집기를 사용합니다.숫자 편집기는 속성의 텍스트 상자 위로 포인터를 이동한 후 값을 스크롤할 수 있도록 숫자 조정 커서 JJ169816.99713193-615f-4ee2-a668-522b5572f389(ko-kr,VS.120).png 가 나타나면 끌어서 활성화합니다.속성의 텍스트 상자를 클릭하고 위쪽 화살표 키 및 아래쪽 화살표 키를 사용하여 값을 조정할 수도 있습니다.

텍스트 개체 수정

이미지 및 벡터 개체에 적용할 수 있는 수정 사항을 텍스트 개체에도 동일하게 적용할 수 있습니다.

텍스트 개체에 적용된 수정 사항

JJ169816.f98cfe86-514a-42a0-b31d-57fa7e00e602(ko-kr,VS.120).png

개체 변형

변형은 한 좌표 공간의 점을 다른 좌표 공간으로 매핑하는 방법을 정의합니다. 예를 들어 개체에 좌표 이동을 수행하면 개체에 변형이 적용되어 초기 X, Y 및 Z(3D 개체에만 해당) 좌표에서 대상 좌표로 개체가 이동합니다. 개체에 비율 크기 조정을 수행하면 개체에 변형이 적용되어 초기 X, Y 및 Z(3D 개체에만 해당) 값의 백분율에 따라 개체의 크기가 조정됩니다.

속성 패널의 변형에서 특정 값을 입력하거나 아트보드에서 개체의 중심점, 회전, 기울이기 각도 또는 대칭 이동 각도를 수정하여 개체를 변형할 수 있습니다. 아트보드에서 개체의 위치를 변경하거나 크기를 조정하는 경우에도 애니메이션 타임라인이나 트리거에서 개체를 수정하면 변형이 자동으로 적용됩니다. 이때 개체의 초기 값은 그대로 유지됩니다.

변형 속성에는 다음과 같은 세 가지 범주가 있습니다.

  • RenderTransform   레이아웃 처리가 완료된 후에 변형이 적용됩니다. 선택 도구를 사용하여 아트보드에서 개체를 변형하면 RenderTransform 속성이 수정됩니다.

    참고

    응용 프로그램 성능을 향상시키려면 RenderTransform 속성을 사용하여 개체의 변형을 수행하는 것이 가장 좋습니다.

  • Projection   레이아웃 처리가 완료된 후에 변형이 적용됩니다. 투영 변형은 3D 공간에서 개체가 회전하는 효과를 만듭니다.

    자세한 내용은 Blend의 시뮬레이션된 3D 공간에서 개체 변형을 참조하십시오. 투영 변형은 Microsoft Silverlight 프로젝트에서만 사용할 수 있습니다.

  • LayoutTransform   응용 프로그램이 화면에서 렌더링되기 전 레이아웃 중에 메모리에서 변형이 적용됩니다. 자식 개체에 적용된 변형에 따라 부모 개체를 조정하려는 경우 LayoutTransform 속성을 사용합니다. 레이아웃 변형은 WPF(Windows Presentation Foundation) 프로젝트에서만 사용할 수 있습니다.

개체에 적용되는 브러시 변형

브러시 변형 도구 브러시 변형 도구 에서는 그라데이션 및 타일 브러시의 RelativeTransform 등 브러시의 RelativeTransform 속성을 수정합니다. 브러시의 RelativeTransform 속성에 변형을 적용하면 출력이 영역에 매핑되기 전에 해당 변형이 브러시에 적용됩니다.

브러시 변형 도구는 브러시 패널에서 선택되어 아트보드의 선택된 개체에 적용되는 브러시를 수정합니다.

아트보드에서 개체에 직접 적용된 브러시의 변형을 수정하려면 속성 패널에서 브러시 속성을 선택한 후 도구 패널의 브러시 변형 도구 브러시 변형 도구를 선택합니다.

아트보드에서 개체를 선택한 상태로 B 키를 눌러 브러시 변형 도구를 선택합니다.

파란색 테두리의 표시기(Adorner)가 개체 주위에 나타납니다. 브러시 변형 도구로 개체를 선택한 상태에서 다음과 같은 방법으로 선택된 개체를 수정할 수 있습니다.

  • 브러시를 이동하려면 개체 내부로 끕니다. 이 동작은 속성 패널에서 RelativeTransform 상자의 좌표 이동 탭에 해당됩니다.

    그라데이션 변형

  • 브러시를 회전하려면 개체 주위의 경계 윤곽선 모퉁이 바깥쪽에 포인터를 놓고 포인터가 회전 핸들 JJ169816.888cbf6b-c442-424d-977d-61d942703c4a(ko-kr,VS.120).png로 바뀌면 끕니다. 이 동작은 속성 패널에서 RelativeTransform 상자의 회전 탭에 해당됩니다.

    그라데이션 변형

  • 타일 브러시나 방사형 그라데이션 브러시 배율을 재조정하려면 개체의 측면 또는 모퉁이에 있는 핸들에 포인터를 놓은 다음 끕니다. 이 동작은 속성 패널에서 RelativeTransform 상자의 배율 탭에 해당됩니다.

    그라데이션 변형

  • 브러시를 기울이려면 측면 핸들 바깥쪽에 포인터를 놓고 포인터가 기울이기 핸들 JJ169816.2be41f49-8a61-4966-bf08-598f4253b610(ko-kr,VS.120).png로 바뀌면 끕니다. 이 동작은 속성 패널에서 RelativeTransform 상자의 기울이기 탭에 해당됩니다.

    그라데이션 변형

변형을 대칭 이동할 수도 있습니다. 속성 패널의 브러시 범주에서 고급 옵션 표시 JJ169816.de239c9d-42ce-4f5e-83b9-5f9924c0431f(ko-kr,VS.120).png를 클릭합니다. RelativeTransform 상자에서 대칭 이동 탭을 클릭한 후 X 축 대칭 이동 또는 Y 축 대칭 이동을 클릭합니다.

브러시 변형에 대한 자세한 내용은 Blend에서 개체를 레이아웃 컨테이너로 구성Blend에서 그라데이션 또는 타일 브러시 변형을 참조하십시오.

클리핑

개체를 변형하면 개체의 일부가 클리핑되는 경우가 있습니다. 즉, 경계 상자의 바깥쪽에 있는 부분이 잘립니다. 다음과 같은 방법으로 이러한 클리핑 문제를 해결할 수 있습니다.

  • 속성 패널의 모양에서 ClipToBounds 속성에 대한 확인란의 선택을 취소합니다.

  • 속성 패널의 변형에서 RenderTransform이 아닌 LayoutTransform 범주의 속성을 사용합니다. 이 방법은 비주얼 브러시를 변형하는 경우에 특히 유용합니다.

  • 변형을 적용하거나 애니메이션 타임라인 또는 트리거에서 개체를 수정하기 전에 속성 패널의 레이아웃 아래에 있는 속성을 사용하여 기본 타임라인의 개체를 수정합니다. 이렇게 하면 변형이 적용되기 전에 경계 상자의 크기 및 위치가 조정됩니다.

도형 또는 패스를 사용하여 의도적으로 개체를 잘라내려는 경우 클리핑 마스크를 만들 수 있습니다. 자세한 내용은 클리핑 경로 적용, 수정 또는 제거을 참조하십시오.