WPF 거드 패널을 사용하는 방법

wpf에서 레이아웃 개체 캔버스, StackPanel, WrapPanel, 그리드 등

무엇보다도 Grid 컨트롤을 살펴보겠습니다.

1. 그리드 행 정의

그리드 행의 개수, 높이, 너비 등의 행 값을 지정하는 태그입니다.

각 RowDefinitions 태그에는 행을 증가시키는 속성이 있습니다.

2. 열 정의

그리드 열의 개수, 높이, 너비 등의 열 값을 지정하는 태그입니다.

마찬가지로 각 ColumnDefinitions에는 열을 증가시키는 속성이 있습니다.

<!-- Grid의 Definitions 사용법 -->
<Window x:Class="WpfApp2.Window4"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="Window4" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>  
    </Grid>
</Window>

3. 그리드 컬럼

그리드 컨트롤 내에는 정의에서 정의한 만큼의 컬럼이 생성되며, 해당 위치의 인덱스를 지정하면 해당 위치에 원하는 컨트롤을 배치할 수 있습니다.

<--!아래와 같이 텍스트박스 컨트롤을 해당 컬럼에 지정한다 -->
<TextBox Grid.Column="1"
                 Text="TEST"
                 FontSize="50"
                 HorizontalAlignment="Center"
                 VerticalAlignment="Center"/>

4. 그리드 행

원하는 행 위치에 특정 컨트롤을 배치하기 위해 그리드 행을 인덱싱할 수도 있습니다.

<--!아래와 같이 텍스트박스 컨트롤을 해당 컬럼에 지정한다 -->
<TextBox Grid.Column="1"
         Grid.Row="0"
         Text="TEST"
         FontSize="50"
         HorizontalAlignment="Center"
         VerticalAlignment="Center"/>

5. 그리드 스팬

Grid.RowSpan, Grid.ColumnSpan은 Grid가 분할될 때 특정 행과 열을 병합하여 컨트롤을 배치할 수 있는 태그입니다.

        <TextBox Grid.Column="1"
                 Grid.ColumnSpan="2"
                 Grid.RowSpan="2"
                 Text="TEST"
                 FontSize="50"
                 HorizontalAlignment="Center"
                 VerticalAlignment="Center"/>