Visual Studio 및 Blend for Visual Studio에서 XAML 디자인
Visual Studio와 Blend for Visual Studio는 모두 다양한 앱 유형에 대한 XAML을 사용하여 매력적인 사용자 인터페이스 및 풍부한 미디어 환경을 빌드하기 위한 시각적 도구를 제공합니다. 두 IDE(통합 개발 환경)는 모두 시각적 XAML 편집기(디자이너)를 비롯한 일반적인 기능 집합을 공유합니다. WPF 및 UWP 플랫폼을 지원하는 Blend for Visual Studio는 시각적 상태를 디자인하고 애니메이션을 만들기 위한 추가 도구를 제공합니다.
Visual Studio와 Blend for Visual Studio 간에 앞뒤로 전환할 수 있으며 두 IDE에서 동일한 프로젝트를 동시에 열 수도 있습니다. 한 IDE의 XAML 파일에 저장된 변경 내용은 다른 IDE로 전환할 때 자동 다시 로드를 통해 적용할 수 있습니다. IDE에서 도구>옵션>환경>문서 이동하여 다시 로드 동작을 제어할 수 있습니다.
설치
WPF 앱을 만들려면 Visual Studio에서 .NET 데스크톱 개발 워크로드를 설치합니다. Blend for Visual Studio도 설치됩니다.
UWP 앱을 만들려면 Visual Studio에서 유니버설 Windows 플랫폼 개발 워크로드를 설치합니다. Blend for Visual Studio도 설치됩니다.
공유 기능
가장 기본적인 개발 작업의 경우 Visual Studio 및 Blend for Visual Studio는 몇 가지 미묘한 차이와 함께 동일한 창 및 기능 집합을 공유합니다. 몇 가지 주요 사항은 다음과 같습니다.
IntelliSense: 두 IDE 모두 문 완성과 같은 IntelliSense 기능을 지원합니다.
디버깅: 실행 중인 앱을 디버그하기 위해 코드 에서 중단점을 설정하고 핫 다시 로드 사용하여 앱이 실행되는 동안 XAML 코드를 변경하는 등 Visual Studio 및 Blend for Visual Studio디버그할 수 있습니다. Visual Studio에서 일관된 디버깅 환경을 유지하기 위해 Blend for Visual Studio에는 대부분의 Visual Studio 디버깅 창과 도구 모음이 포함되어 있습니다.
파일 다시 로드: Visual Studio 또는 Blend for Visual Studio에서 XAML 파일을 편집할 수 있습니다. IDE 간에 전환할 때 저장된 편집된 파일이 자동으로 다시 로드됩니다. IDE에서 도구>옵션>환경>문서 이동하여 다시 로드 동작을 제어할 수 있습니다.
동기화된 레이아웃 및 설정 : 디자인 사용자 지정 도구 창 레이아웃 및 Visual Studio용 Blend에 대한 설정 기본 설정은 동일한 개인 설정 계정으로 로그인할 때 디바이스 및 버전 간에 동기화됩니다. 여러 컴퓨터에서동기화 설정을 참조하세요.
Blend for Visual Studio의 고급 기능
생산성을 높이려면 다음 작업에 Blend for Visual Studio를 사용하는 것이 좋습니다. Blend for Visual Studio가 Visual Studio 디자이너 또는 코드만 하는 것보다 더 많은 기능을 제공하는 영역입니다.
| 과업 | Visual Studio | Blend for Visual Studio | 자세한 정보 |
|---|---|---|---|
| 시각적 상태 디자인하기 | 시각적 상태를 디자인하는 데 도움이 되는 도구는 없습니다. 프로그래밍 방식으로 만들어야 합니다. | 디자인 도구를 사용하여 상태에 따라 컨트롤의 모양을 변경합니다. | 시각적 상태 |
| 애니메이션 만들기 | 애니메이션에 대한 디자인 도구는 없습니다. 프로그래밍 방식으로 만들어야 합니다. 이를 위해서는 WPF의 애니메이션 및 타이밍 시스템과 광범위한 코딩 전문 지식을 이해해야 합니다. | 시각적으로 애니메이션을 만들고 Blend for Visual Studio에서 미리 볼 수 있습니다. 이는 코드에서 애니메이션을 빌드하는 것보다 더 빠르고 정확합니다. 트리거를 추가하여 사용자 상호 작용을 처리할 수 있으며, 코드로 전환하여 이벤트 처리기 및 기타 기능을 추가할 수 있습니다. | 애니메이션 개체 |
| 셰이프와 텍스트를 경로로 전환하여 보다 쉽게 조작할 수 | 지원되지 않습니다. | 더 나은 편집 제어를 제공하는 경로로 변환하여 셰이프(예: 사각형 및 타원)를 미묘하거나 극적으로 변경할 수 있습니다. 경로를 변형하거나 결합하고 여러 셰이프에서 복합 경로를 만들 수 있습니다. 텍스트 블록을 경로로 변환하여 벡터 이미지로 조작할 수도 있습니다. |
셰이프 및 경로 그리기 |
| 컨트롤, 템플릿 및 스타일 편집 | WPF 스타일 및 템플릿에 대한 코딩 및 지식이 필요합니다. | 모든 이미지를 컨트롤로 전환합니다. 템플릿 편집 도구를 사용하여 몇 번의 마우스 클릭만으로 컨트롤, 스타일 및 템플릿을 변경할 수 있습니다. 예를 들어 Blend for Visual Studio 스타일 리소스를 사용하여 일반적인 WPF 컨트롤(예: 단추, 목록 상자, 스크롤 막대, 메뉴 등)을 구현하고 Blend for Visual Studio에서 직접 색, 스타일 또는 기본 템플릿을 변경할 수 있습니다. 원하는 경우 마무리 작업을 위한 코드로 전환할 수 있습니다. |
개체의 스타일 수정 |
| UI를 데이터에 연결하십시오 | SQL Server 데이터베이스, WCF 또는 웹 서비스, 개체 또는 SharePoint 목록과 같은 리소스에서 데이터 원본을 만든 다음 데이터 원본을 UI 컨트롤에 바인딩할 수 있습니다. 대화형 디자인 환경을 위해서는 디자인 타임 데이터를 직접 만들어야 합니다. |
.NET Framework 앱의 경우 프로토타입 생성 및 테스트를 위한 샘플 데이터를 쉽게 만듭니다. 준비가 되면 라이브 데이터로 전환합니다. Blend for Visual Studio의 데이터 생성 기능은 뛰어난 기능이며(이름, 숫자, URL 및 사진을 즉시 쉽게 추가할 수 있음) 많은 시간을 절약할 수 있습니다. 라이브 데이터의 경우 XML 파일 또는 CLR 데이터 원본에 UI 컨트롤을 바인딩할 수 있습니다. |
데이터 표시 |
고급 XAML 디자인에 대한 자세한 내용은 Blend for Visual Studio사용하여 UI 만들기를 참조하세요.