다음을 통해 공유


연습: 디자인 타임에 Windows Forms에서 WPF 콘텐츠 정렬

이 문서에서는 기준 위치 지정 및 맞춤선과 같은 Windows Forms 레이아웃 기능을 사용하여 WPF(Windows Presentation Foundation) 컨트롤을 정렬하는 방법을 보여줍니다.

필수 구성 요소

이 연습을 완료하려면 Visual Studio가 필요합니다.

프로젝트 만들기

Visual Studio를 열고 Visual Basic 또는 Visual C#에서 ArrangeElementHost이라는 새 Windows Forms 앱 프로젝트를 만듭니다.

참고

WPF 콘텐츠를 호스트하는 경우 C# 및 Visual Basic 프로젝트만 지원됩니다.

WPF 컨트롤 만들기

프로젝트에 WPF 컨트롤을 추가한 후 폼에 정렬할 수 있습니다.

  1. 프로젝트에 새 WPF UserControl을 추가합니다. 컨트롤 형식의 기본 이름인 UserControl1.xaml을 사용합니다. 자세한 내용은 연습: 디자인 타임에 Windows Forms 새 WPF 콘텐츠 만들기를 참조하세요.

  2. 디자인 뷰에서 UserControl1이 선택되었는지 확인합니다.

  3. 속성 창에서 WidthHeight 속성의 값을 200으로 설정합니다.

  4. Background 속성 값을 Blue로 설정합니다.

  5. 프로젝트를 빌드합니다.

레이아웃 패널에서 WPF 컨트롤 호스트

다른 Windows Forms 컨트롤을 사용하는 것과 동일한 방식으로 레이아웃 패널에서 WPF 컨트롤을 사용할 수 있습니다.

  1. Windows Forms 디자이너에서 Form1을 엽니다.

  2. 도구 상자에서 TableLayoutPanel 컨트롤을 폼으로 끌어 옵니다.

  3. TableLayoutPanel 컨트롤의 스마트 태그 패널에서 마지막 행 제거를 선택합니다.

  4. TableLayoutPanel 컨트롤을 더 큰 너비와 높이로 조정합니다.

  5. 도구 상자에서 UserControl1을 두 번 클릭하여 TableLayoutPanel의 첫 번째 셀에 UserControl1의 인스턴스를 만듭니다.

    UserControl1 인스턴스가 elementHost1이라는 새 ElementHost 컨트롤에서 호스트됩니다.

  6. 도구 상자에서 UserControl1을 두 번 클릭하여 TableLayoutPanel 컨트롤의 두 번째 셀에 다른 인스턴스를 만듭니다.

  7. 문서 개요 창에서 tableLayoutPanel1을 선택합니다.

  8. 속성 창에서 Padding 속성의 값을 10, 10, 10, 10으로 설정합니다.

    ElementHost 컨트롤 모두 새 레이아웃에 맞게 크기가 조정됩니다.

맞춤선을 사용하여 WPF 컨트롤 맞추기

맞춤선을 사용하여 폼에서 컨트롤을 쉽게 맞출 수 있습니다. 맞춤선을 사용하여 WPF 컨트롤도 맞출 수 있습니다. 자세한 내용은 연습: 맞춤선을 사용하여 Windows Forms에서 컨트롤 정렬을 참조하세요.

  1. 도구 상자에서 UserControl1의 인스턴스를 폼으로 끌어 TableLayoutPanel 컨트롤 아래 공간에 배치합니다.

    UserControl1 인스턴스가 elementHost1이라는 새 ElementHost 컨트롤에서 호스트됩니다.

  2. 맞춤선을 사용하여 elementHost3의 왼쪽 가장자리를 TableLayoutPanel 컨트롤의 왼쪽 가장자리에 맞춥니다.

  3. 맞춤선을 사용하여 elementHost3의 크기를 TableLayoutPanel 컨트롤과 동일한 너비로 조정합니다.

  4. 가운데 맞춤선이 컨트롤 사이에 나타날 때까지 elementHost3TableLayoutPanel 컨트롤 쪽으로 이동합니다.

  5. 속성 창에서 Margin 속성의 값을 20, 20, 20, 20으로 설정합니다.

  6. 가운데 맞춤선이 다시 나타날 때까지 elementHost3TableLayoutPanel 컨트롤에서 멀리 이동합니다. 이제 가운데 맞춤선이 여백 20을 나타냅니다.

  7. 왼쪽 가장자리가 elementHost1의 왼쪽 가장자리와 맞춰질 때까지 elementHost3을 오른쪽으로 이동합니다.

  8. 오른쪽 가장자리가 elementHost2의 오른쪽 가장자리와 맞춰질 때까지 elementHost3의 너비를 변경합니다.

WPF 컨트롤 고정 및 도킹

폼에 호스트된 WPF 컨트롤은 다른 Windows Forms 컨트롤과 동일한 고정 및 도킹 동작을 갖습니다.

  1. elementHost1를 선택합니다.

  2. 속성 창에서 Anchor 속성을 Top, Bottom, Left, Right로 설정합니다.

  3. TableLayoutPanel 컨트롤을 더 큰 크기로 조정합니다.

    elementHost1 컨트롤의 크기가 조정되어 셀을 채웁니다.

  4. elementHost1를 선택합니다.

  5. 속성 창에서 Dock 속성의 값을 Fill로 설정합니다.

    elementHost1 컨트롤의 크기가 조정되어 셀을 채웁니다.

  6. TableLayoutPanel 컨트롤을 선택합니다.

  7. Dock 속성의 값을 Top로 설정합니다.

  8. elementHost1를 선택합니다.

  9. Dock 속성의 값을 Top로 설정합니다.

    elementHost3 컨트롤의 크기가 조정되어 폼의 나머지 공간을 채웁니다.

  10. 폼의 크기를 조정합니다.

    ElementHost 컨트롤 3개의 크기가 모두 적절하게 조정됩니다.

    자세한 내용은 방법: TableLayoutPanel 컨트롤의 자식 컨트롤 고정 및 도킹을 참조하세요.

참고 항목