[C#/WPF] ControlTemplate 엘리먼트 : TextBox 엘리먼트 정의하기

■ ControlTemplate 엘리먼트를 사용해 TextBox 엘리먼트를 정의하는 방법을 보여준다.

TestProject.zip

0.01MB

▶ MainWindow.xaml

<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Window.Resources>
        <Color x:Key="DisabledControlLightColorKey">#ffe8edf9</Color>
        <Color x:Key="DisabledControlDarkColorKey">#ffc5cbf9</Color>
        <Color x:Key="ControlLightColorKey">White</Color>
        <Color x:Key="BorderMediumColorKey">#ff888888</Color>
        <Color x:Key="BorderDarkColorKey">#ff444444</Color>
        <Style TargetType="{x:Type TextBox}">
            <Setter Property="MinWidth"                         Value="120"      />
            <Setter Property="MinHeight"                        Value="20"       />
            <Setter Property="OverridesDefaultStyle"            Value="True"     />
            <Setter Property="FocusVisualStyle"                 Value="{x:Null}" />
            <Setter Property="SnapsToDevicePixels"              Value="True"     />
            <Setter Property="AllowDrop"                        Value="True"     />
            <Setter Property="KeyboardNavigation.TabNavigation" Value="None"     />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TextBoxBase}">
                        <Border Name="border"
                            CornerRadius="2"
                            BorderThickness="1"
                            Padding="2">
                            <Border.Background>
                                <SolidColorBrush Color="{DynamicResource ControlLightColorKey}" />
                            </Border.Background>
                            <Border.BorderBrush>
                                <SolidColorBrush Color="{DynamicResource BorderMediumColorKey}" />
                            </Border.BorderBrush>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup Name="CommonStates">
                                    <VisualState Name="Normal" />
                                    <VisualState Name="Disabled">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames
                                            Storyboard.TargetName="border"
                                            Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlLightColorKey}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState Name="ReadOnly">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames
                                            Storyboard.TargetName="border"
                                            Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlDarkColorKey}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState Name="MouseOver" />
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <ScrollViewer Name="PART_ContentHost"
                                Margin="0" />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <StackPanel
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <TextBox HorizontalAlignment="Center"
            Margin="10"
            Text="Edit Me">
            <TextBox.BorderBrush>
                <SolidColorBrush Color="Red" />
            </TextBox.BorderBrush>
        </TextBox>
        <TextBox HorizontalAlignment="Center"
            Margin="10"
            IsReadOnly="True"
            Text="Read only" />
        <TextBox HorizontalAlignment="Center"
            Margin="10"
            IsEnabled="False"
            Text="Disabled" />
    </StackPanel>
</Window>