반응형

프로그래밍 기술/WPF 22

[WPF] 5. 레이아웃과 Panel - 5.5 DockPanel

[WPF] 5. 레이아웃과 Panel - 5.5 DockPanel5.5 DockPanel DockPanel은 자식 UI를 좌측, 우측, 위, 아래로 붙여서 배치할 수 있습니다. 단순히 DockPanel의 자식 UI의 DockPanel.Dock 속성을 Left, Top, Right, Bottom을 지정하면 원하는 위치에 달라붙어요. 그리고 DockPanel의 LastChildFill 속성을 true로 하면 마지막 배치한 자식이 남아 있는 전체 공간에 채워집니다. 물론 false로 하면 필요한 공간만 차지합니다. [그림 5.16] DockPanel 사용 예제 실행 화면 먼저 WPF 응용 프로그램 프로젝트를 생성하세요.[그림 5.17] WPF 응용 프로그램 프로젝트 생성 DockPanel에 자식 요소를 배치할..

[WPF] 5. 레이아웃과 Panel - 5.4 WrapPanel

[WPF] 5. 레이아웃과 Panel - 5.4 WrapPanel 5.4 WrapPanel WrapPanel은 StackPanel과 매우 흡사합니다. StackPanel과 다른 점은 WrapPanel에서는 한 줄이 꽉차면 다음 줄로 넘어간는 것입니다. 흔히 폴더에서 파일 목록을 보는 것과 같습니다.[그림 5.13] WrapPanel 사용 예제 실행 화면 먼저 WPF 응용 프로그램 프로젝트를 생성하세요.[그림 5.14] WPF 응용 프로그램 프로젝트 생성 WrapPanel을 사용하면 [그림 5.13]처럼 한 줄이 꽉 차면 자동으로 다음 줄로 넘어갑니다. 사용 방법에 대해서는 StackPanel과 별 차이가 없기 때문에 설명을 생략할게요.

[WPF] 5. 레이아웃과 Panel - 5.3 StackPanel, 5.3.2 cs 소스에서 코드로 배치하기

5.3 StackPanel, 5.3.2 cs 소스 에서 코드로 배치하기5.3.2 cs에서 소스를 이용하여 배치하기 이번에는 cs 파일에서 직접 소스를 작성하여 배치하는 것에 대해 살펴봅시다. 실습할 배치 모습은 앞에서 xaml 태그를 이용한 것과 같습니다.[그림 5.11] StackPanel 사용 예제 실행 화면 먼저 WPF 응용 프로그램 프로젝트를 생성하세요.[그림 5.12] WPF 응용 프로그램 프로젝트 생성 먼저, xaml에 Window 개체 부분을 제외한 부분을 없애는 것부터 시작합시다. MainWindow.xaml.cs using System.Windows; using System.Windows.Controls; namespace StackPanel_실습___소스_코드로_배치 { /// /// ..

[WPF] 5. 레이아웃과 Panel - 5.3 StackPanel, 5.3.1 xaml 태그를 이용하여 배치

5.레이아웃과 Panel 5.3 StackPanel 5.3.1 xaml 태그를 이용하여 배치5.3 StackPanel StackPanel은 수평 혹은 수직 방향으로 순차적으로 자식 UI 개체를 배치할 때 사용이 됩니다. 만약, 보관된 개체의 공간이 이미 StackPanel에 꽉 찬다고 하더라도 다음 줄로 넘어가지 않고 한 줄로 배치가 됩니다. 이러한 StackPanel의 특징을 갖고 있어서 ScrollViewer내에 StackPanel을 배치하는 경우가 많이 발생합니다. 5.3.1 xaml에서 태그를 이용하여 배치하기 StackPanel은 Orientation 속성을 수평(Horizontal)로 배치를 할 것인지 수직(Vertical)으로 배치할 것인지를 결정할 수 있습니다. StackPanel에 자식 ..

[WPF] 5. 레이아웃과 Panel - 5.2 Canvas, 5.2.2 cs 소스에서 코드로 배치하기

5.레이아웃과 Panel - 5.2 Canvas, 5.2.2 cs 소스에서 코드로 배치하기5.2.2 cs 소스 파일에서 코드로 배치하기 이번에는 cs 파일에서 직접 소스를 작성하여 배치하는 것에 대해 살펴봅시다. 실제 WPF 프로그램을 작성할 때 UI 배치를 소스에서 작성하는 것은 자주 발생하는 작업은 아니지만 cs 파일에서 소스를 직접 작성해 보면 좀 더 명확하게 이해할 수 있어요. 실습할 배치 모습은 앞에서 xaml 태그를 이용한 것과 같습니다. [그림 5.7] Canvas 사용 예제 실행 화면 먼저 WPF 응용 프로그램 프로젝트를 생성하세요.[그림 5.8] WPF 응용 프로그램 프로젝트 생성 먼저, xaml 파일에 Window 요소 내부를 지우세요. Canvas 개체를 생성하는 코드부터 시작해야겠지..

[WPF] 5. 레이아웃과 Panel - 5.2 Canvas, 5.2.1 xaml 태그를 이용하여 배치

5. 레이아웃과 Panel - 5.2 Canvas, 5.2.1 xaml 태그를 이용하여 배치 5.2 Canvas Canvas는 Windows Form에서 UI를 배치하는 방법과 매우 흡사합니다. Canvas에서는 자식 UI를 Canvas 영역 내에 배치하고자 하는 상대 좌표를 지정할 수 있습니다. 그리고, Grid와 다르게 Canvas의 크기가 변한다 하더라도 자식 UI들의 크기나 Canvas내에 상대적 위치는 변하지 않습니다. 여러분들이 만들고자 하는 프로그램에서 창의 크기에 따라 UI요소들의 크기가 자동으로 조정이 되게 하고 싶지 않은 경우에 사용하세요. 5.2.1 xaml에서 태그를 이용하여 배치하기 Canvas를 사용할 경우에는 xaml 파일에 태그에 직접 작성하는 것 보다는 디자인 창에서 마우스..

[WPF] 5. 레이아웃과 Panel - 5.1 Grid, 5.1.2 cs 소스에서 코드로 배치하기

5. 레이아웃과 Panel - 5.1 Grid, 5.1.2 cs 소스에서 코드로 배치하기5.1.2 cs 소스에서 코드로 배치하기 이번에는 xmal에서 태그를 이용하지 않고 cs에서 소스를 이용하는 방법을 살펴보기로 합시다. 배치하는 것과 앞에서 Xaml 태그로 배치했던 것과 같습니다. [그림 5.3] Grid 사용 예제 실행 화면 먼저 WPF 응용 프로그램 프로젝트를 생성하세요.[그림 5.4] WPF 응용 프로그램 프로젝트 생성 먼저, MainWindow.xaml파일에 선언된 Grid 부분을 모두 제거합시다. MainWindow.xaml.cs using System.Windows; using System.Windows.Controls; using System.Windows.Media; namespace ..

[WPF] 5. 레이아웃과 Panel - 5.1 Grid, 5.1.1 xaml 태그를 이용하여 배치

5. 레이아웃과 Panel - 5.1 Grid, 5.1.1 xaml 태그를 이용하여 배치5.1 Grid Grid는 행과 열을 정의할 수 있으며 자식 UI들을 원하는 행과 열에 배치를 할 수 있으며 필요에 의해 하나의 자식 UI를 여러 행과 여러 열을 채울 수도 있게 해 줍니다. Grid에서는 행과 열이 차지하는 영역을 고정적인 픽셀 뿐만 아니라 비율에 따라 배분할 수도 있습니다. 5.1.1 xaml에서 태그를 이용하여 배치하기 [그림 5.1]과 같은 형태로 배치하는 것을 예를 들면서 설명을 할게요. [그림 5.1] Grid 사용 예제 실행 화면 먼저 WPF 응용 프로그램 프로젝트를 생성하세요. [그림 5.2] WPF 응용 프로그램 프로젝트 생성 먼저, 행과 열을 정의를 해 봅시다. Grid에는 하나의 행..

[WPF] 5. 레이아웃과 Panel

5. 레이아웃과 Panel WPF는 사용자와 상호 작용을 하는 응용을 개발할 때 사용되는 기술입니다. 사용자와 상호 작용을 하는 응용 프로그램에서는 시각적인 사용자 인터페이스를 어떻게 배치를 할 것인지에 따라 편의성에 차이가 생깁니다. 여기에서는 이러한 자식 UI 요소들을 갖을 수 있는 다양한 패널들을 중심으로 레이아웃에 대해 다루고자 합니다. Panel은 WPF에서 UI들을 배치할 때 사용되는 다양한 패널들들에 대한 기반 클래스입니다. Panel에서는 여러 패널에서 공통적으로 필요한 멤버들을 정의되어 있습니다. Panel의 기본 속성에는 높이(Height), 너비(Width), 수평 정렬(HorizontalAlignment), 수직 정렬(VerticalAlignment), 여백(Margin), 배경 브..

[WPF] 4. 탐색 - 4.3 탐색 종합 세트, 마법사

4. 탐색 - 4.3 탐색 종합 세트, 마법사 4.3 탐색 종합 세트, 마법사 WPF에서는 하나의 작업군을 여러 단계를 거치면서 수행을 하면서 각 단계별로 작업한 내용을 유지하기 위한 마법사를 만들수 있는 방법을 제공하고 있습니다. 이를 위해 WPF에서는 NavigationWindow를 제공하고 있는데 NavigationService와 PageFunction을 같이 이용하면 마법사를 만들 수 있습니다. 여기에서는 단계별로 회원의 이름과 나이, 주소를 입력받는 마법사를 만드는 과정을 통해 이에 대해 설명하려고 합니다. [그림 4.14] 마법사 실행 화면 먼저, [WPF 응용 프로그램] 프로젝트를 하나 만드세요.[그림 4.15]탐색 종합 세트 - 마법사 그리고, 회원 정보에 대한 클래스를 간단히 만들어서 사..

반응형