[WPF] WPF Label, Textblock, Textbox 컨트롤 연습하기

안녕하세요.

 

오늘은 WPF에서 Label, Textblock, Textbox 컨트롤을 이용하는 방법에 대해서 알아보려고 합니다.

 

큰 설명 없이 각 컨트롤들을 Xaml로 표현해서 제가 원하는 디자인으로 마음대로 배치를 해보는 연습을 하겠습니다.

 

그냥 간단히 고객관리? UI를 구성해 보도록 할게요.

 

 

Xaml.cs

<Window x:Class="ch00.MainWindow"
        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:ch00"
        mc:Ignorable="d"
        Title="고객등록" Height="450" Width="400"
        FocusManager.FocusedElement="{Binding ElementName=txtName}">
    
    <Grid Margin="10">
        
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
 
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
 
        <Border Grid.Row="0" Grid.Column="0" BorderBrush="Black" BorderThickness="1"
                Background="Beige">
            <Label Content="성명(_N):" 
               Target="{Binding ElementName=txtName}"/>
        </Border>
        <TextBox x:Name="txtName" Grid.Row="0" Grid.Column="1" />
 
        <Border Grid.Row="1" Grid.Column="0" BorderBrush="Black" BorderThickness="1"
                Background="Beige">
            <StackPanel Orientation="Horizontal" Margin="5">
                <Image Source="/tel.png" Width="20"/>
                <Label  Content="전화번호(_T):"
               Target="{Binding ElementName=txtTel}"/>
            </StackPanel>
            
        </Border>
        <TextBox x:Name="txtTel"  Grid.Row="1" Grid.Column="1" />
 
        <Border Grid.Row="2" Grid.Column="0" BorderBrush="Black" BorderThickness="1"
                Background="Beige">
            <Label Content="성별(_S):"
               Target="{Binding ElementName=txtSex}"/>
        </Border>
        <TextBox x:Name="txtSex" Grid.Row="2" Grid.Column="1" />
 
        <Border Grid.Row="3" Grid.Column="0" BorderBrush="Black" BorderThickness="1"
                Background="Beige">
            <Label  Content="비고(_M):"
               Target="{Binding ElementName=txtM}"/>
        </Border>
        <TextBox x:Name="txtM" Grid.Row="3" Grid.Column="1" Height="100" 
                 AcceptsReturn="True" AcceptsTab="True"
                 VerticalScrollBarVisibility="Auto"
                 TextWrapping="Wrap"/>
 
    </Grid>
    
</Window>
 

 

실행 결과

 

위와 같이 Label, Textblock, Textbox 컨트롤들을 Xaml로 배치하여 원하는 속성들을 넣고 디자인 해보았습니다.