컨트롤Controls

WPF(Windows Presentation Foundation)Windows Presentation Foundation (WPF) 많은 등 거의 모든 Windows 응용 프로그램에 사용 되는 일반적인 UI 구성 요소와 함께 제공 됩니다 Button, Label, TextBox, Menu, 및 ListBox합니다.WPF(Windows Presentation Foundation)Windows Presentation Foundation (WPF) ships with many of the common UI components that are used in almost every Windows application, such as Button, Label, TextBox, Menu, and ListBox. 지금까지 이러한 개체는 컨트롤이라고 불렀습니다.Historically, these objects have been referred to as controls. 동안 합니다 WPFWPF SDK "컨트롤" 이라는 용어를 사용 하 여 응용 프로그램에서 표시 되는 개체를 나타내는 모든 클래스를 대략적인 의미로 계속 것이 중요 클래스에서 상속할 필요가 없습니다를 Control 시각적 존재가 클래스입니다.While the WPFWPF SDK continues to use the term "control" to loosely mean any class that represents a visible object in an application, it is important to note that a class does not need to inherit from the Control class to have a visible presence. 클래스에서 상속 되는 Control 클래스에 포함를 ControlTemplate, 소비자 컨트롤의 새 하위 클래스를 만들지 않고도 컨트롤의 모양을 대폭 변경할 수 있습니다.Classes that inherit from the Control class contain a ControlTemplate, which allows the consumer of a control to radically change the control's appearance without having to create a new subclass. 이 항목에 설명 하는 방법을 컨트롤 (모두 해당에서 상속 받는 합니다 Control 클래스와 상속 받지 않는)은 일반적으로 사용 WPFWPF.This topic discusses how controls (both those that do inherit from the Control class and those that do not) are commonly used in WPFWPF.

컨트롤의 인스턴스 만들기Creating an Instance of a Control

사용 하 여 응용 프로그램 컨트롤을 추가할 수 있습니다 XAML(Extensible Application Markup Language)Extensible Application Markup Language (XAML) 또는 코드입니다.You can add a control to an application by using either XAML(Extensible Application Markup Language)Extensible Application Markup Language (XAML) or code. 다음 예제에서는 사용자에게 이름과 성을 묻는 간단한 응용 프로그램을 만드는 방법을 보여 줍니다.The following example shows how to create a simple application that asks a user for their first and last name. 이 예제에서는 6 개의 컨트롤을 만듭니다: 두 개의 레이블, 두 개의 텍스트 상자 및에 2 개의 단추 XAMLXAML합니다.This example creates six controls: two labels, two text boxes, and two buttons, in XAMLXAML. 모든 컨트롤을 유사하게 만들 수 있습니다.All controls can be created similarly.

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="30"/>
    <RowDefinition Height="30"/>
    <RowDefinition Height="30"/>
    <RowDefinition/>
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>
  </Grid.ColumnDefinitions>

  <Label>
    Enter your first name:
  </Label>
  <TextBox Grid.Row="0" Grid.Column="1" 
           Name="firstName" Margin="0,5,10,5"/>

  <Label Grid.Row="1" >
    Enter your last name:
  </Label>
  <TextBox Grid.Row="1" Grid.Column="1" 
           Name="lastName" Margin="0,5,10,5"/>

  <Button Grid.Row="2" Grid.Column="0" 
          Name="submit" Margin="2">
    View message
  </Button>

  <Button Grid.Row="2" Grid.Column="1" 
          Name="Clear" Margin="2">
    Clear Name
  </Button>
</Grid>

다음 예제에서는 코드로 동일한 응용 프로그램을 만듭니다.The following example creates the same application in code. 간 결함을 생성 합니다 Grid, grid1, 샘플에서 제외 되었습니다.For brevity, the creation of the Grid, grid1, has been excluded from the sample. grid1 동일한 열과 행의 정의는 이전에 표시 된 것과 같이 XAMLXAML 예제입니다.grid1 has the same column and row definitions as shown in the preceding XAMLXAML example.

Label firstNameLabel;
Label lastNameLabel;
TextBox firstName;
TextBox lastName;
Button submit;
Button clear;

void CreateControls()
{
    firstNameLabel = new Label();
    firstNameLabel.Content = "Enter your first name:";
    grid1.Children.Add(firstNameLabel);

    firstName = new TextBox();
    firstName.Margin = new Thickness(0, 5, 10, 5);
    Grid.SetColumn(firstName, 1);
    grid1.Children.Add(firstName);

    lastNameLabel = new Label();
    lastNameLabel.Content = "Enter your last name:";
    Grid.SetRow(lastNameLabel, 1);
    grid1.Children.Add(lastNameLabel);

    lastName = new TextBox();
    lastName.Margin = new Thickness(0, 5, 10, 5);
    Grid.SetColumn(lastName, 1);
    Grid.SetRow(lastName, 1);
    grid1.Children.Add(lastName);

    submit = new Button();
    submit.Content = "View message";
    Grid.SetRow(submit, 2);
    grid1.Children.Add(submit);

    clear = new Button();
    clear.Content = "Clear Name";
    Grid.SetRow(clear, 2);
    Grid.SetColumn(clear, 1);
    grid1.Children.Add(clear);

}
Private firstNameLabel As Label
Private lastNameLabel As Label
Private firstName As TextBox
Private lastName As TextBox
Private submit As Button
Private clear As Button

Sub CreateControls()
    firstNameLabel = New Label()
    firstNameLabel.Content = "Enter your first name:"
    grid1.Children.Add(firstNameLabel)

    firstName = New TextBox()
    firstName.Margin = New Thickness(0, 5, 10, 5)
    Grid.SetColumn(firstName, 1)
    grid1.Children.Add(firstName)

    lastNameLabel = New Label()
    lastNameLabel.Content = "Enter your last name:"
    Grid.SetRow(lastNameLabel, 1)
    grid1.Children.Add(lastNameLabel)

    lastName = New TextBox()
    lastName.Margin = New Thickness(0, 5, 10, 5)
    Grid.SetColumn(lastName, 1)
    Grid.SetRow(lastName, 1)
    grid1.Children.Add(lastName)

    submit = New Button()
    submit.Content = "View message"
    Grid.SetRow(submit, 2)
    grid1.Children.Add(submit)

    clear = New Button()
    clear.Content = "Clear Name"
    Grid.SetRow(clear, 2)
    Grid.SetColumn(clear, 1)
    grid1.Children.Add(clear)


End Sub 'CreateControls

컨트롤의 모양 변경Changing the Appearance of a Control

일반적으로 응용 프로그램의 모양과 느낌에 맞게 컨트롤의 모양을 변경합니다.It is common to change the appearance of a control to fit the look and feel of your application. 수행하려는 작업에 따라 다음 중 하나를 수행하여 컨트롤의 모양을 변경할 수 있습니다.You can change the appearance of a control by doing one of the following, depending on what you want to accomplish:

  • 컨트롤의 속성 값을 변경합니다.Change the value of a property of the control.

  • 만들기는 Style 컨트롤에 대 한 합니다.Create a Style for the control.

  • ControlTemplate 컨트롤에 대 한 합니다.Create a new ControlTemplate for the control.

컨트롤의 속성 값 변경Changing a Control's Property Value

많은 컨트롤 같은 컨트롤이 표시 하는 방법을 변경할 수 있도록 하는 속성이 합니다 BackgroundButton합니다.Many controls have properties that allow you to change how the control appears, such as the Background of a Button. 모두 값 속성을 설정할 수 있습니다 XAMLXAML 및 코드입니다.You can set the value properties in both XAMLXAML and code. 다음 예제에서는 합니다 Background, FontSize, 및 FontWeight 속성에는 Button 에서 XAMLXAML합니다.The following example sets the Background, FontSize, and FontWeight properties on a Button in XAMLXAML.

<Button FontSize="14" FontWeight="Bold">
  <!--Set the Background property of the Button to
    a LinearGradientBrush.-->
  <Button.Background>
    <LinearGradientBrush StartPoint="0,0.5" 
                            EndPoint="1,0.5">
      <GradientStop Color="Green" Offset="0.0" />
      <GradientStop Color="White" Offset="0.9" />
    </LinearGradientBrush>

  </Button.Background>
  View message
</Button>

다음 예제에서는 코드로 동일한 속성을 설정합니다.The following example sets the same properties in code.

LinearGradientBrush buttonBrush = new LinearGradientBrush();
buttonBrush.StartPoint = new Point(0, 0.5);
buttonBrush.EndPoint = new Point(1, 0.5);
buttonBrush.GradientStops.Add(new GradientStop(Colors.Green, 0));
buttonBrush.GradientStops.Add(new GradientStop(Colors.White, 0.9));

submit.Background = buttonBrush;
submit.FontSize = 14;
submit.FontWeight = FontWeights.Bold;
Dim buttonBrush As New LinearGradientBrush()
buttonBrush.StartPoint = New Point(0, 0.5)
buttonBrush.EndPoint = New Point(1, 0.5)
buttonBrush.GradientStops.Add(New GradientStop(Colors.Green, 0))
buttonBrush.GradientStops.Add(New GradientStop(Colors.White, 0.9))

submit.Background = buttonBrush
submit.FontSize = 14
submit.FontWeight = FontWeights.Bold

컨트롤에 대한 스타일 만들기Creating a Style for a Control

WPFWPF 응용 프로그램에서 각 인스턴스에서 만들어 속성을 설정 하는 대신 컨트롤의 모양을 대량으로 지정 하는 기능 제공을 Style입니다.gives you the ability to specify the appearance of controls wholesale, instead of setting properties on each instance in the application, by creating a Style. 다음 예제는 Style 각각에 적용 되는 Button 응용 프로그램에서 합니다.The following example creates a Style that is applied to each Button in the application. Style 정의에 일반적으로 정의 된 XAMLXAMLResourceDictionary와 같은 Resources 의 속성은 FrameworkElement합니다.Style definitions are typically defined in XAMLXAML in a ResourceDictionary, such as the Resources property of the FrameworkElement.

<Style TargetType="Button">
  <Setter Property="FontSize" Value="14"/>
  <Setter Property="FontWeight" Value="Bold"/>
  <Setter Property="Background">
    <Setter.Value>
      <LinearGradientBrush StartPoint="0,0.5" 
                              EndPoint="1,0.5">
        <GradientStop Color="Green" Offset="0.0" />
        <GradientStop Color="White" Offset="0.9" />
      </LinearGradientBrush>

    </Setter.Value>
  </Setter>
</Style>

스타일에 키를 할당 하 고에서 해당 키를 지정 하 여 특정 형식의 특정 컨트롤에 스타일을 적용할 수도 있습니다는 Style 컨트롤의 속성입니다.You can also apply a style to only certain controls of a specific type by assigning a key to the style and specifying that key in the Style property of your control. 스타일에 대 한 자세한 내용은 참조 하세요. 스타일 및 템플릿합니다.For more information about styles, see Styling and Templating.

ControlTemplate 만들기Creating a ControlTemplate

A Style 한 번에 여러 컨트롤의 속성을 설정할 수 있지만의 모양을 사용자 지정 하려는 경우에 따라를 Control 만들어 수행할 수 이상으로 Style입니다.A Style allows you to set properties on multiple controls at a time, but sometimes you might want to customize the appearance of a Control beyond what you can do by creating a Style. 클래스에서 상속 되는 Control 클래스를 ControlTemplate의 모양과 구조를 정의 하는 Control합니다.Classes that inherit from the Control class have a ControlTemplate, which defines the structure and appearance of a Control. Template 의 속성을 Control 가 지정할 수 있는 public이 ControlControlTemplate 기본값과.The Template property of a Control is public, so you can give a Control a ControlTemplate that is different than its default. 새 자주 지정할 수 있습니다 ControlTemplate 에 대 한는 Control 의 표시를 사용자 지정 컨트롤에서 상속 하는 대신 한 Control합니다.You can often specify a new ControlTemplate for a Control instead of inheriting from a control to customize the appearance of a Control.

매우 일반적인 컨트롤인 것이 좋습니다 Button합니다.Consider the very common control, Button. 기본 동작을 Button 취해야 하는 사용자가 클릭 하면 응용 프로그램을 사용 하는 것입니다.The primary behavior of a Button is to enable an application to take some action when the user clicks it. 기본적으로 Button 에서 WPFWPF 은 볼록한 사각형으로 표시 됩니다.By default, the Button in WPFWPF appears as a raised rectangle. 응용 프로그램을 개발 하는 동안의 동작을 활용 하려는 Button-즉, 단추의 클릭 이벤트를 처리 하 여 있지만 단추의 속성을 변경 하 여 수행할 수 있는 작업 이상으로 단추의 모양을 변경할 수 있습니다.While developing an application, you might want to take advantage of the behavior of a Button--that is, by handling the button's click event--but you might change the button's appearance beyond what you can do by changing the button's properties. 이 경우 만들어야 새 ControlTemplate합니다.In this case, you can create a new ControlTemplate.

다음 예제는 ControlTemplate 에 대 한는 Button합니다.The following example creates a ControlTemplate for a Button. 합니다 ControlTemplate 만듭니다는 Button 둥근된 모서리와 그라데이션 배경이 합니다.The ControlTemplate creates a Button with rounded corners and a gradient background. ControlTemplate 포함을 BorderBackgroundLinearGradientBrush 두 개의 GradientStop 개체입니다.The ControlTemplate contains a Border whose Background is a LinearGradientBrush with two GradientStop objects. 첫 번째 GradientStop 바인딩할 데이터 바인딩을 사용 하는 Color 의 속성을 GradientStop 단추의 배경색을 합니다.The first GradientStop uses data binding to bind the Color property of the GradientStop to the color of the button's background. 설정 하는 경우는 Background 의 속성을 Button, 첫 번째 값의 색을 사용할지 GradientStop합니다.When you set the Background property of the Button, the color of that value will be used as the first GradientStop. 데이터 바인딩에 대한 자세한 내용은 데이터 바인딩 개요를 참조하세요.For more information about data binding, see Data Binding Overview. 예제에서는 Trigger 의 모양을 변경 하는 ButtonIsPressedtrue합니다.The example also creates a Trigger that changes the appearance of the Button when IsPressed is true.

<!--Define a template that creates a gradient-colored button.-->
<Style TargetType="Button">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">
        <Border 
          x:Name="Border"  
          CornerRadius="20" 
          BorderThickness="1"
          BorderBrush="Black">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0.5" 
                                 EndPoint="1,0.5">
              <GradientStop Color="{Binding Background.Color, 
                    RelativeSource={RelativeSource TemplatedParent}}" 
                            Offset="0.0" />
              <GradientStop Color="White" Offset="0.9" />
            </LinearGradientBrush>
          </Border.Background>
          <ContentPresenter 
            Margin="2"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            RecognizesAccessKey="True"/>
        </Border>
        <ControlTemplate.Triggers>
          <!--Change the appearance of
          the button when the user clicks it.-->
          <Trigger Property="IsPressed" Value="true">
            <Setter TargetName="Border" Property="Background">
              <Setter.Value>
                <LinearGradientBrush StartPoint="0,0.5" 
                                     EndPoint="1,0.5">
                  <GradientStop Color="{Binding Background.Color, 
                    RelativeSource={RelativeSource TemplatedParent}}" 
                                Offset="0.0" />
                  <GradientStop Color="DarkSlateGray" Offset="0.9" />
                </LinearGradientBrush>
              </Setter.Value>
            </Setter>
          </Trigger>

        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>
<Button Grid.Row="2" Grid.ColumnSpan="2" Name="submitName"
        Background="Green">View message</Button>

참고

Background 의 속성을 Button 로 설정 되어야 합니다는 SolidColorBrush 예제가 제대로 작동 되려면.The Background property of the Button must be set to a SolidColorBrush for the example to work properly.

이벤트 구독Subscribing to Events

사용 하 여 컨트롤의 이벤트를 구독할 수 있습니다 XAMLXAML 코드 있지만 개체만 처리할 수 있는 코드에서 이벤트 또는 합니다.You can subscribe to a control's event by using either XAMLXAML or code, but you can only handle an event in code. 다음 예제에서는 구독 하는 방법을 보여 줍니다 합니다 Click 의 이벤트는 Button합니다.The following example shows how to subscribe to the Click event of a Button.

<Button Grid.Row="2" Grid.ColumnSpan="2" Name="submitName" Click="submit_Click"
  Background="Green">View message</Button>
submit.Click += new RoutedEventHandler(submit_Click);
AddHandler submit.Click, AddressOf submit_Click

다음 예제에서는 처리 합니다 Click 의 이벤트는 Button합니다.The following example handles the Click event of a Button.

void submit_Click(object sender, RoutedEventArgs e)
{
    MessageBox.Show("Hello, " + firstName.Text + " " + lastName.Text);
}
Private Sub submit_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
    MessageBox.Show("Hello, " + firstName.Text + " " + lastName.Text)

End Sub 'submit_Click

컨트롤의 풍부한 콘텐츠Rich Content in Controls

대부분의 클래스에서 상속 되는 Control 클래스 풍부한 콘텐츠를 포함 하는 역량을 보유 합니다.Most classes that inherit from the Control class have the capacity to contain rich content. 예를 들어를 Label 문자열과 같은 개체를 포함할 수는 Image, 또는 Panel합니다.For example, a Label can contain any object, such as a string, an Image, or a Panel. 다음 클래스는 다양 한 콘텐츠에 대 한 지원을 제공 하며 대부분의 컨트롤에 대 한 기본 클래스로 작동 WPFWPF합니다.The following classes provide support for rich content and act as base classes for most of the controls in WPFWPF.

이러한 기본 클래스에 대 한 자세한 내용은 참조 하세요. WPF 콘텐츠 모델합니다.For more information about these base classes, see WPF Content Model.

참고 항목See Also

스타일 지정 및 템플릿Styling and Templating
범주별 컨트롤Controls by Category
컨트롤 라이브러리Control Library
데이터 템플릿 개요Data Templating Overview
데이터 바인딩 개요Data Binding Overview
입력Input
명령 사용Enable a Command
연습: 사용자 지정 애니메이션 단추 만들기Walkthroughs: Create a Custom Animated Button
컨트롤 사용자 지정Control Customization