Windows Forms 개발자를 위한 WPF Designer
WPF Designer for Visual Studio는 Windows Forms 디자이너와 매우 비슷하지만 몇 가지 점에서 다릅니다. 이 항목에서는 이러한 차이점 중 몇 가지에 대해 설명하고 Windows Forms 디자이너에서 수행하던 작업을 WPF Designer를 사용하여 수행하는 방법에 대해 설명합니다.
XAML 강조
Windows Forms 디자이너와 WPF Designer의 가장 명백한 차이점은 분할된 뷰입니다. 분할된 뷰를 사용하면 디자인 화면과 XAML 태그를 동시에 모두 볼 수 있습니다. WPF Designer에서는 XAML 뷰의 기능이 강조되며 IntelliSense를 비롯하여 사용자 응용 프로그램의 XAML에 대한 완전한 편집 환경이 제공됩니다. Windows Forms 디자이너에서 자주 수행하던 많은 작업을 XAML 뷰를 사용하여 수행할 수 있습니다. 분할 뷰에는 XAML 뷰에서 편집된 내용이 표시되므로 즉시 피드백을 얻을 수 있습니다. 분할된 뷰에 대한 자세한 내용은 분할된 뷰: WPF 디자인 화면과 XAML을 동시에 보기를 참조하십시오.
또한 Visual Studio와 함께 Expression Blend를 사용하여 WPF Designer에서 지원되지 않는 작업을 수행할 수 있습니다. 자세한 내용은 Expression Blend와의 공동 작업을 참조하십시오.
WPF Designer의 향상된 기능
WPF Designer에는 Windows Forms 디자이너에서 사용할 수 없는 향상된 다양한 기능이 있습니다. 향상된 기능은 다음과 같습니다.
여백 줄 및 스텁: 각 컨트롤 주위의 여백 줄은 해당 컨트롤에 여백이 설정되었음을 나타냅니다. 여백 스텁은 해당 컨트롤 가장자리에 여백이 설정되지 않았음을 나타냅니다.
확대/축소 컨트롤: 확대/축소 컨트롤은 디자인 뷰의 왼쪽 맨 위에 나타나며 개발자는 이 컨트롤로 디자인 화면을 확대하거나 축소하여 정확한 조정 작업을 수행할 수 있습니다. 디자인 화면을 확대한 후 화면에서 이동할 수도 있습니다.
맞춤선: 맞춤선은 WPF Designer와 Windows Forms 디자이너 모두에 나타나지만 WPF Designer의 맞춤선에는 정확한 값도 표시됩니다. 맞춤선에는 컨트롤 맞춤뿐 아니라 텍스트 기반 컨트롤의 텍스트 맞춤도 표시됩니다. 자세한 내용은 방법: 텍스트 기준선 및 여백에 맞추기를 참조하십시오.
Windows Forms 디자이너 작업과 이에 해당하는 WPF Designer 작업
다음 표에서는 WPF Designer에서 여러 작업을 수행하는 방법을 정리해서 보여 줍니다.
Windows Forms 디자이너 작업 |
이에 해당하는 WPF Designer 작업 |
|---|---|
절대 레이아웃 |
Canvas 클래스를 루트 요소로 사용합니다. |
속성 창의 사전순 정렬 |
속성 창에서 사전순 단추를 클릭합니다. 속성을 찾으려면 검색 상자를 사용합니다. XAML 뷰 또는 코드 편집기에서 IntelliSense를 사용하여 속성을 찾아볼 수 있습니다. 개체 브라우저를 사용할 수도 있습니다. |
고정 |
디자인 뷰의 앵커 기능 및 Grid를 사용하여 앵커 대상을 설정합니다. |
애니메이션 |
Expression Blend를 사용합니다. |
응용 프로그램 아이콘 |
|
탭 순서 할당 |
XAML 뷰 또는 속성 창에서 각 컨트롤을 선택하고 해당 TabIndex 속성을 설정합니다. 기본 탭 순서는 컨트롤이 부모 컨테이너에 표시되는 순서입니다. |
구성 요소 및 구성 요소 트레이 |
비시각적 구성 요소는 WPF Designer 도구 상자에 표시되지 않습니다. 리소스 및 지역 형식이 아닌 형식을 참조하려면 XAML 뷰 및 네임스페이스 매핑을 사용합니다. 자세한 내용은 방법: 네임스페이스를 XAML로 가져오기를 참조하십시오. |
데이터 소스 창 및 데이터 바인딩 |
데이터 소스 창을 사용합니다. 자세한 내용은 Visual Studio에서 데이터에 WPF 컨트롤 바인딩을 참조하십시오. DesignInstance 태그 확장을 사용하여 데이터의 디자인 타임 인스턴스에 바인딩할 수 있습니다. 자세한 내용은 연습: DesignInstance를 사용하여 디자이너의 데이터에 바인딩을 참조하십시오. XML 또는 개체에 바인딩하는 경우에는 Expression Blend를 사용하여 데이터 소스 및 데이터 바인딩을 정의할 수도 있습니다. WPF Designer에서 자동으로 생성된 XAML을 복사하여 XAML 뷰에 붙여넣으십시오. Expression Blend에서 Visual Studio 프로젝트를 열어 직접 리소스를 만들 수도 있습니다. |
이벤트 처리기 선언 및 첨부 |
속성 창에서 이벤트 단추를 클릭하고 원하는 이벤트를 두 번 클릭합니다. 기본 이벤트 처리기인 경우 디자인 뷰에서 컨트롤을 두 번 클릭합니다. XAML 뷰에서 IntelliSense를 사용하여 원하는 이벤트를 선택할 수도 있습니다. 자세한 내용은 방법: 단순한 이벤트 처리기 만들기를 참조하십시오. |
메뉴 디자인 |
XAML 뷰를 사용하거나 Items 컬렉션의 속성 창에서 컬렉션 편집기를 사용하여 각 항목의 Header 속성을 설정합니다. |
브러시 및 색 정의 |
속성 창에서 브러시 형식 속성으로 스크롤하고 아래쪽 화살표를 클릭합니다. 브러시 편집기를 사용하여 브러시를 디자인합니다. 자세한 내용은 방법: 브러시 편집기를 사용하여 브러시 만들기를 참조하십시오. Expression Blend를 사용할 수 있습니다. WPF Designer에서 자동으로 생성된 XAML을 복사하여 XAML 뷰에 붙여넣으십시오. Expression Blend에서 Visual Studio 프로젝트를 열어 직접 리소스를 만들 수도 있습니다. |
모눈선 삭제 |
모눈선 표시기를 클릭하고 모눈 레일에서 끕니다. 자세한 내용은 방법: 모눈에서 행 및 열 제거를 참조하십시오. XAML 뷰를 사용하여 관련 행 정의 또는 열 정의를 삭제한 다음 Grid 내부에 부모가 있는 관련 자식 컨트롤의 Grid.Column 또는 Grid.Row 할당을 수정할 수도 있습니다. |
이미지 표시 |
Image 컨트롤을 사용합니다. 자세한 내용은 방법: WPF 프로젝트에 이미지 추가를 참조하십시오. |
도구 상자에 UserControl 표시 |
사용자 컨트롤의 어셈블리에 프로젝트 참조를 추가하고 XAML 뷰에서 IntelliSense를 사용하여 xmlns 특성을 할당합니다. 도구 상자 항목 선택 대화 상자를 사용하여 컨트롤이 들어 있는 어셈블리를 찾아갈 수도 있지만 여기에는 제한 사항이 있습니다. 자세한 내용은 도구 상자 항목 선택 대화 상자, WPF 구성 요소 탭을 참조하십시오. |
폼 전체로 컨트롤 배포 |
StackPanel 요소를 사용합니다. |
도킹 |
여러 컨트롤에 대해서는 DockPanel 요소를 사용합니다. Grid에서 모눈선 맞춤을 사용하여 컨트롤을 모눈 셀 경계에 맞출 수도 있습니다. |
오류 공급자 |
시각적 디자인 타임이 없습니다. XAML 뷰의 Validation 클래스를 사용합니다. 자세한 내용은 방법: 바인딩 유효성 검사 구현을 참조하십시오. |
정의로 이동 |
코드 숨김에서 기호를 마우스 오른쪽 단추로 클릭한 다음 바로 가기 메뉴에서 정의로 이동을 선택합니다. XAML 뷰에서 검색하려면 프로젝트의 모든 XAML 파일을 열고 찾기 및 바꾸기 창을 사용합니다. 자세한 내용은 찾기 및 바꾸기 창을 참조하십시오. |
도움말 제공자 |
시각적 디자인 타임이 없습니다. XAML 뷰를 사용합니다. |
하이퍼링크 |
유동 콘텐츠 내에서 Hyperlink 클래스를 사용합니다. |
시각적 디자인 타임이 없습니다. XAML 뷰를 사용합니다. |
|
잠금 |
지원되지 않음. |
시각적 디자인 타임이 없습니다. XAML 뷰를 사용합니다. |
|
니모닉 |
니모닉 문자 앞에 앰퍼샌드 문자 "&" 대신 밑줄 문자 "_"을 붙입니다. |
속성 창의 개체 선택기 드롭다운 목록 |
문서 개요 창, 태그 탐색기 또는 디자인 뷰에서 개체를 선택합니다. 문서 개요 창을 표시하려면 보기 메뉴를 열고 다른 창을 가리킨 다음 문서 개요를 선택합니다. |
시각적 디자인 타임이 없습니다. XAML 뷰를 사용합니다. |
|
XAML의 지역 형식이 아닌 형식 참조 |
프로젝트 참조를 추가하고 XMAL 뷰에서 IntelliSense를 사용하여 xmlns 특성을 설정합니다. 자세한 내용은 방법: 네임스페이스를 XAML로 가져오기를 참조하십시오. .gif "참고") 참고
WPF Designer에서는 clr-namespace를 사용하는 전체 구문 대신 xmlns 특성 뒤의 네임 스페이스 별칭을 기준으로 일치하는 항목을 찾습니다.
|
이름 바꾸기 및 리팩터링 |
프로젝트의 모든 XAML 파일을 연 다음 찾기 및 바꾸기 창을 사용합니다. 자세한 내용은 찾기 및 바꾸기 창을 참조하십시오. |
여백 제거 |
디자인 뷰에서 여백을 제거할 모든 요소를 선택합니다. 속성 창에서 Margin 속성에 0을 입력합니다. |
컨트롤을 배치한 후 폼 크기 조정 |
창의 크기를 조정하면 콘텐츠의 크기도 조정될 수 있으므로 다음 프로세스를 사용하십시오. 모든 요소를 선택한 다음 잘라냅니다. 창의 크기를 조정한 다음 붙여넣습니다. |
Button, Label, CheckBox, RadioButton 컨트롤에 대한 텍스트 설정 |
속성 창에서 Content 속성을 설정합니다. 또는 XAML 뷰에서 텍스트를 설정합니다. |
스마트 태그 |
지원되지 않습니다. |
도구 설명 |
시각적 디자인 타임이 없습니다. XAML 뷰의 ToolTip 클래스를 사용합니다. |
시각적 디자인 타임이 없습니다. XAML 뷰를 사용합니다. |
|
시각적 상속 |
지원되지 않음. |
시각적 디자인 타임이 없습니다. XAML 뷰를 사용합니다. |
|
Z 순서 |
XAML 뷰에서 요소 태그를 선택하여 이동하거나 디자인 뷰의 상황에 맞는 메뉴에서 순서를 선택합니다. 요소의 Z 순서를 확인하려면 문서 개요 창을 사용합니다. |
참고 항목
개념
Windows Forms 컨트롤 및 해당 WPF 컨트롤