스타일 지정 및 템플릿Styling and Templating

WPF(Windows Presentation Foundation)Windows Presentation Foundation (WPF) 스타일 지정 및 템플릿은 개발자와 디자이너가 시각적으로 눈에 띄는 효과를 만들고 제품에 대한 일관된 모양을 만들 수 있는 기능 모음(스타일, 템플릿, 트리거 및 스토리보드)을 나타냅니다.styling and templating refer to a suite of features (styles, templates, triggers, and storyboards) that allow developers and designers to create visually compelling effects and to create a consistent appearance for their product. 개발자 및/또는 디자이너는 애플리케이션에 따라 모양을 광범위하게 사용자 지정할 수 있지만 애플리케이션 내에서 또는 애플리케이션 간에 모양을 유지 관리 및 공유하려면 강력한 스타일 지정 및 템플릿 모델이 필요합니다.Although developers and or designers can customize the appearance extensively on an application-by-application basis, a strong styling and templating model is necessary to allow maintenance and sharing of the appearance within and among applications. WPF(Windows Presentation Foundation)Windows Presentation Foundation (WPF)에서 이 모델을 제공합니다.provides that model.

WPFWPF 스타일 지정 모델의 또 다른 기능은 프레젠테이션과 논리의 분리입니다.Another feature of the WPFWPF styling model is the separation of presentation and logic. 즉, 개발자가 C# 또는 Visual Basic을 사용하여 프로그래밍 논리 작업을 수행할 때 동시에 디자이너가 XAMLXAML만 사용하여 애플리케이션 모양 작업을 수행할 수 있습니다.This means that designers can work on the appearance of an application by using only XAMLXAML at the same time that developers work on the programming logic by using C# or Visual Basic.

이 개요에서는 애플리케이션의 스타일 지정 및 템플릿 측면을 집중적으로 살펴보고 데이터 바인딩 개념은 설명하지 않습니다.This overview focuses on the styling and templating aspects of the application and does not discuss any data binding concepts. 데이터 바인딩에 대한 자세한 내용은 데이터 바인딩 개요를 참조하세요.For information about data binding, see Data Binding Overview.

또한 스타일 및 템플릿을 재사용할 수 있게 해주는 리소스를 이해해야 합니다.In addition, it is important to understand resources, which are what enable styles and templates to be reused. 리소스에 대한 자세한 내용은 XAML 리소스를 참조하세요.For more information about resources, see XAML Resources.

스타일 지정 및 템플릿 샘플Styling and Templating Sample

이 개요에 사용된 코드 예제는 다음 그림에 표시된 간단한 사진 샘플을 기반으로 합니다.The code examples used in this overview are based on a simple photo sample shown in the following illustration:

스타일 지정된 ListViewStyled ListView

이 간단한 사진 샘플에서는 스타일 지정 및 템플릿을 사용하여 시각적으로 눈에 띄는 사용자 환경을 만듭니다.This simple photo sample uses styling and templating to create a visually compelling user experience. 이 샘플에는 두 개의 TextBlock 요소 및 ListBox 이미지 목록에 바인딩되는 컨트롤입니다.The sample has two TextBlock elements and a ListBox control that is bound to a list of images. 전체 샘플을 보려면 Introduction to Styling and Templating Sample(스타일 지정 및 템플릿 샘플 소개)을 참조하세요.For the complete sample, see Introduction to Styling and Templating Sample.

스타일 기본 사항Style Basics

생각할 수 있습니다는 Style 둘 이상의 요소에 속성 값 집합을 적용 하는 편리한 방법으로 합니다.You can think of a Style as a convenient way to apply a set of property values to more than one element. 예를 들어, 다음 사항을 고려 TextBlock 요소와 기본 모양을:For example, consider the following TextBlock elements and their default appearance:

<TextBlock>My Pictures</TextBlock>
<TextBlock>Check out my new pictures!</TextBlock>

스타일 샘플 스크린 샷Styling sample screenshot

와 같은 속성을 설정 하 여 기본 모양을 변경할 수 있습니다 FontSize 하 고 FontFamily, 각 TextBlock 요소에서 직접.You can change the default appearance by setting properties, such as FontSize and FontFamily, on each TextBlock element directly. 그러나 하려는 경우에 TextBlock 일부 속성을 공유 하는 요소 만들 수 있습니다를 StyleResources 의 섹션에 XAMLXAML 파일을 다음과 같이:However, if you want your TextBlock elements to share some properties, you can create a Style in the Resources section of your XAMLXAML file, as shown here:

<Window.Resources>
<!--A Style that affects all TextBlocks-->
<Style TargetType="TextBlock">
  <Setter Property="HorizontalAlignment" Value="Center" />
  <Setter Property="FontFamily" Value="Comic Sans MS"/>
  <Setter Property="FontSize" Value="14"/>
</Style>
</Window.Resources>

설정 하는 경우는 TargetType 에 스타일의는 TextBlock 형식 스타일을 적용할 모든는 TextBlock 창에서 구성 요소입니다.When you set the TargetType of your style to the TextBlock type, the style is applied to all the TextBlock elements in the window.

이제는 TextBlock 요소가 다음과 같이 나타납니다.Now the TextBlock elements appear as follows:

스타일 샘플 스크린 샷Styling sample screenshot

스타일 확장Extending Styles

두 하려는 경우가 있을 것 TextBlock 와 같은 일부 속성 값을 공유 하는 요소는 FontFamily 가운데에 맞춰진 및 HorizontalAlignment, 텍스트 "내 사진" 몇 가지 추가 속성을 가질 수도 있지만.Perhaps you want your two TextBlock elements to share some property values, such as the FontFamily and the centered HorizontalAlignment, but you also want the text "My Pictures" to have some additional properties. 이 작업을 수행하려면 다음과 같이 첫 번째 스타일을 기반으로 새 스타일을 만듭니다.You can do that by creating a new style that is based on the first style, as shown here:

<Window.Resources>
<!--A Style that extends the previous TextBlock Style-->
<!--This is a "named style" with an x:Key of TitleText-->
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
       TargetType="TextBlock"
       x:Key="TitleText">
  <Setter Property="FontSize" Value="26"/>
  <Setter Property="Foreground">
  <Setter.Value>
      <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
        <LinearGradientBrush.GradientStops>
          <GradientStop Offset="0.0" Color="#90DDDD" />
          <GradientStop Offset="1.0" Color="#5BFFFF" />
        </LinearGradientBrush.GradientStops>
      </LinearGradientBrush>
    </Setter.Value>
  </Setter>
</Style>
</Window.Resources>

이전 스타일에는 x:Key가 제공됨을 알 수 있습니다.Notice that the previous style is given an x:Key. 설정한 스타일을 적용 하는 Style 속성에 TextBlockx:Key 값을 다음과 같이:To apply the style, you set the Style property on your TextBlock to the x:Key value, as shown here:

<TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
<TextBlock>Check out my new pictures!</TextBlock>

TextBlock 스타일 설정 되었습니다를 HorizontalAlignment 의 값 Center, FontFamilyComic Sans MS, FontSize 26의 값 및 Foreground 값으로 설정 합니다 LinearGradientBrush 예제와 같이 합니다.This TextBlock style now has a HorizontalAlignment value of Center, a FontFamily value of Comic Sans MS, a FontSize value of 26, and a Foreground value set to the LinearGradientBrush shown in the example. 재정의 하는 FontSize 기본 스타일의 값입니다.Notice that it overrides the FontSize value of the base style. 둘 이상 있으면 Setter 에서 동일한 속성을 설정를 StyleSetter 즉 선언 된 마지막 우선 적용 됩니다.If there is more than one Setter setting the same property in a Style, the Setter that is declared last takes precedence.

다음은 무엇을 TextBlock 요소의 모양을:The following shows what the TextBlock elements now look like:

스타일 지정된 TextBlockStyled TextBlocks

TitleText 스타일에 대해 만들어진 스타일을 확장 합니다 TextBlock 형식입니다.This TitleText style extends the style that has been created for the TextBlock type. x:Key 값을 사용하여 x:Key가 포함된 스타일을 확장할 수도 있습니다.You can also extend a style that has an x:Key by using the x:Key value. 예를 들어 제공 하는 예제를 참조 합니다 BasedOn 속성입니다.For an example, see the example provided for the BasedOn property.

TargetType 속성 및 x:Key 특성의 관계Relationship of the TargetType Property and the x:Key Attribute

첫 번째 예제와 같이 설정 합니다 TargetType 속성을 TextBlock 스타일을 할당 하지 않고는 x:Key 모두에 적용할 스타일을 사용 하면 TextBlock 요소입니다.As shown in the first example, setting the TargetType property to TextBlock without assigning the style an x:Key causes the style to be applied to all TextBlock elements. 이 경우 x:Key는 암시적으로 {x:Type TextBlock}으로 설정됩니다.In this case, the x:Key is implicitly set to {x:Type TextBlock}. 즉, 명시적으로 설정 하는 경우는 x:Key 이외의 모든 항목에 값 {x:Type TextBlock}Style 모두에 적용 되지 않습니다 TextBlock 요소 자동으로 합니다.This means that if you explicitly set the x:Key value to anything other than {x:Type TextBlock}, the Style is not applied to all TextBlock elements automatically. 스타일을 적용 해야 하는 대신 (사용 하 여 합니다 x:Key 값)에 TextBlock 요소 명시적으로 합니다.Instead, you must apply the style (by using the x:Key value) to the TextBlock elements explicitly. 스타일 리소스 섹션에 있고 설정 하지 않으면 경우는 TargetType 속성에서 스타일을 지정 해야 합니다는 x:Key합니다.If your style is in the resources section and you do not set the TargetType property on your style, then you must provide an x:Key.

에 대 한 기본값을 제공 하는 것 외에도 합니다 x:Key, TargetType 속성 setter 속성이 적용 되는 형식을 지정 합니다.In addition to providing a default value for the x:Key, the TargetType property specifies the type to which setter properties apply. 지정 하지 않는 경우는 TargetType의 속성을 정규화 해야 하 Setter 구문을 사용 하 여 클래스 이름으로 개체 Property="ClassName.Property"합니다.If you do not specify a TargetType, you must qualify the properties in your Setter objects with a class name by using the syntax Property="ClassName.Property". 예를 들어, 설정 하는 대신 Property="FontSize"를 설정 해야 합니다 Property"TextBlock.FontSize" 또는 "Control.FontSize".For example, instead of setting Property="FontSize", you must set Property to "TextBlock.FontSize" or "Control.FontSize".

대부분의 WPFWPF 컨트롤은 다른 WPFWPF 컨트롤의 조합으로 구성됩니다.Also note that many WPFWPF controls consist of a combination of other WPFWPF controls. 한 형식의 모든 컨트롤에 적용되는 스타일을 만들 경우 예기치 않은 결과가 발생할 수 있습니다.If you create a style that applies to all controls of a type, you might get unexpected results. 예를 들어 대상으로 하는 스타일을 만들를 TextBlock 입력을 Window, 모든 스타일 적용 됩니다 TextBlock 창에서 컨트롤 경우에는 TextBlock 와 같은 다른 컨트롤의 파트는는 ListBox.For example, if you create a style that targets the TextBlock type in a Window, the style is applied to all TextBlock controls in the window, even if the TextBlock is part of another control, such as a ListBox.

스타일 및 리소스Styles and Resources

파생 된 모든 요소에 스타일을 사용할 수 있습니다 FrameworkElement 또는 FrameworkContentElement합니다.You can use a style on any element that derives from FrameworkElement or FrameworkContentElement. 스타일을 선언하는 가장 일반적인 방법은 이전 예제와 같이 XAMLXAML 파일의 Resources 섹션에서 리소스로 선언하는 것입니다.The most common way to declare a style is as a resource in the Resources section in a XAMLXAML file, as shown in the previous examples. 스타일은 리소스이므로 모든 리소스에 적용되는 동일한 범위 지정 규칙을 따라야 합니다. 스타일을 선언하는 위치가 스타일이 적용될 수 있는 위치에 영향을 미칩니다.Because styles are resources, they obey the same scoping rules that apply to all resources; where you declare a style affects where the style can be applied. 예를 들어 스타일을 애플리케이션 정의 XAMLXAML 파일의 루트 요소에서 선언하면 애플리케이션의 모든 곳에서 스타일을 사용할 수 있습니다.For example, if you declare the style in the root element of your application definition XAMLXAML file, the style can be used anywhere in your application. 탐색 애플리케이션을 만들고 스타일을 애플리케이션의 XAMLXAML 파일 중 하나에서 선언하면 해당 XAMLXAML 파일에서만 스타일을 사용할 수 있습니다.If you create a navigation application and declare the style in one of the application's XAMLXAML files, the style can be used only in that XAMLXAML file. 리소스 범위 지정 규칙에 대한 자세한 내용은 XAML 리소스를 참조하세요.For more information about scoping rules for resources, see XAML Resources.

또한 이 개요의 뒷부분에 있는 공유 리소스 및 테마에서 스타일 및 리소스에 대한 추가 정보를 찾을 수 있습니다.In addition, you can find more information about styles and resources in Shared Resources and Themes later in this overview.

프로그래밍 방식으로 스타일 설정Setting Styles Programmatically

요소에 명명된 된 스타일에 프로그래밍 방식으로 할당 하려면 스타일 리소스 컬렉션에서 가져오고 요소에 할당할 Style 속성입니다.To assign a named style to an element programmatically, get the style from the resources collection and assign it to the element's Style property. 형식의 리소스 컬렉션의 항목에는 Object합니다.Note that the items in a resources collection are of type Object. 따라서 검색된 된 스타일을 캐스팅 해야 합니다는 Style 에 할당 하기 전에 Style 속성입니다.Therefore, you must cast the retrieved style to a Style before assigning it to the Style property. 예를 들어 정의 된 설정 TitleText 에서 스타일을 TextBlock 라는 textblock1, 다음을 수행:For example, to set the defined TitleText style on a TextBlock named textblock1, do the following:

textblock1.Style = (Style)(this.Resources["TitleText"]);
textblock1.Style = CType(Me.Resources("TitleText"), Style)

스타일이 적용된 후에는 봉인되고 변경할 수 없습니다.Note that once a style has been applied, it is sealed and cannot be changed. 이미 적용된 스타일을 동적으로 변경하려면 기존 스타일을 대체할 새 스타일을 만들어야 합니다.If you want to dynamically change a style that has already been applied, you must create a new style to replace the existing one. 자세한 내용은 IsSealed 속성을 참조하세요.For more information, see the IsSealed property.

사용자 지정 논리에 따라 적용할 스타일을 선택하는 개체를 만들 수 있습니다.You can create an object that chooses a style to apply based on custom logic. 예를 들어 제공 하는 예제를 참조 합니다 StyleSelector 클래스입니다.For an example, see the example provided for the StyleSelector class.

바인딩, 동적 리소스 및 이벤트 처리기Bindings, Dynamic Resources, and Event Handlers

Setter.Value 속성을 사용하여 Binding 태그 확장 또는 DynamicResource 태그 확장을 지정할 수 있습니다.Note that you can use the Setter.Value property to specify a Binding Markup Extension or a DynamicResource Markup Extension. 자세한 내용은 참조에 대 한 제공 된 예제는 Setter.Value 속성입니다.For more information, see the examples provided for the Setter.Value property.

지금까지 이 개요에서는 setter를 사용하여 속성 값을 설정하는 방법만 설명했습니다.So far, this overview only discusses the use of setters to set property value. 스타일에서 이벤트 처리기를 지정할 수도 있습니다.You can also specify event handlers in a style. 자세한 내용은 EventSetter을 참조하세요.For more information, see EventSetter.

데이터 템플릿Data Templates

이 샘플 응용 프로그램에는 ListBox 사진 목록에 바인딩된 컨트롤입니다.In this sample application, there is a ListBox control that is bound to a list of photos:

<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
         Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>

ListBox 현재 다음과 같이 보입니다.This ListBox currently looks like the following:

템플릿 적용 전의 ListBoxListBox before applying template

대부분 컨트롤에는 몇 가지 콘텐츠 형식이 있고 해당 콘텐츠는 보통 바인딩할 데이터에서 나옵니다.Most controls have some type of content, and that content often comes from data that you are binding to. 이 샘플에서 데이터는 사진 목록입니다.In this sample, the data is the list of photos. WPFWPF, 사용을 DataTemplate 데이터의 시각적 표현을 정의 합니다.In WPFWPF, you use a DataTemplate to define the visual representation of data. 기본적으로, 새로운 넣은 DataTemplate 렌더링된 된 응용 프로그램에 데이터 모양을 결정 합니다.Basically, what you put into a DataTemplate determines what the data looks like in the rendered application.

샘플 애플리케이션에서 각 사용자 지정 Photo 개체에는 이미지의 파일 경로를 지정하는 string 형식의 Source 속성이 있습니다.In our sample application, each custom Photo object has a Source property of type string that specifies the file path of the image. 현재 사진 개체는 파일 경로로 표시됩니다.Currently, the photo objects appear as file paths.

만든 이미지로 표시할 사진에 대 한는 DataTemplate 리소스로:For the photos to appear as images, you create a DataTemplate as a resource:

<Window.Resources>
<!--DataTemplate to display Photos as images
    instead of text strings of Paths-->
<DataTemplate DataType="{x:Type local:Photo}">
  <Border Margin="3">
    <Image Source="{Binding Source}"/>
  </Border>
</DataTemplate>
</Window.Resources>

DataType 속성은 매우 비슷합니다는 TargetType 의 속성을 Style.Notice that the DataType property is very similar to the TargetType property of the Style. 경우에 DataTemplate 지정할 때는 리소스 섹션에는 합니다 DataType 속성을 형식 할당 하 고는 x:KeyDataTemplate 해당 형식이 나타날 때마다 적용 됩니다.If your DataTemplate is in the resources section, when you specify the DataType property to a type and not assign it an x:Key, the DataTemplate is applied whenever that type appears. 할당 하는 옵션을 항상 해야 합니다 DataTemplate 사용 하 여는 x:Key 로 설정한 후를 StaticResource 사용 하는 속성에 대 한 DataTemplate 같은 형식을 ItemTemplate 속성 또는 ContentTemplate 속성.You always have the option to assign the DataTemplate with an x:Key and then set it as a StaticResource for properties that take DataTemplate types, such as the ItemTemplate property or the ContentTemplate property.

기본적으로 DataTemplate 위의 예제에서 정의 될 때마다를 Photo 개체로 표시 됩니다는 Image 내에서 Border.Essentially, the DataTemplate in the above example defines that whenever there is a Photo object, it should appear as an Image within a Border. 이 사용 하 여 DataTemplate, 이제 응용 프로그램은 다음과 같습니다.With this DataTemplate, our application now looks like this:

사진 이미지Photo image

데이터 템플릿 모델은 다른 기능을 제공합니다.The data templating model provides other features. 예를 들어, 사용 하 여 다른 컬렉션이 포함 된 컬렉션 데이터를 표시 하는 경우는 HeaderedItemsControl 등의 입력을 Menu 또는 TreeViewHierarchicalDataTemplate합니다.For example, if you are displaying collection data that contains other collections using a HeaderedItemsControl type such as a Menu or a TreeView, there is the HierarchicalDataTemplate. 다른 데이터 템플릿 기능은 합니다 DataTemplateSelector를 선택할 수 있습니다는 DataTemplate 에 따라 사용자 지정 논리를 사용 하 합니다.Another data templating feature is the DataTemplateSelector, which allows you to choose a DataTemplate to use based on custom logic. 자세한 내용은 다양한 데이터 템플릿 기능을 자세히 설명하는 템플릿 개요를 참조하세요.For more information, see Data Templating Overview, which provides a more in-depth discussion of the different data templating features.

컨트롤 템플릿Control Templates

WPFWPF, ControlTemplate 컨트롤의 컨트롤의 모양을 정의 합니다.In WPFWPF, the ControlTemplate of a control defines the appearance of the control. 새 정의 하 여 컨트롤의 모양과 구조를 변경할 수 있습니다 ControlTemplate 컨트롤에 대 한 합니다.You can change the structure and appearance of a control by defining a new ControlTemplate for the control. 대부분의 경우 이 방법을 사용하면 충분하므로 자체 사용자 지정 컨트롤을 작성할 필요가 없습니다.In many cases, this gives you enough flexibility so that you do not have to write your own custom controls. 자세한 내용은 ControlTemplate을 만들어 기존 컨트롤의 모양 사용자 지정을 참조하세요.For more information, see Customizing the Appearance of an Existing Control by Creating a ControlTemplate.

트리거Triggers

트리거는 속성 값이 변경되거나 이벤트가 발생할 때 속성을 설정하거나 애니메이션 등의 작업을 시작합니다.A trigger sets properties or starts actions, such as an animation, when a property value changes or when an event is raised. StyleControlTemplate, 및 DataTemplate 모두는 Triggers 트리거 집합을 포함할 수 있는 속성입니다.Style, ControlTemplate, and DataTemplate all have a Triggers property that can contain a set of triggers. 다양한 형식의 트리거가 있습니다.There are various types of triggers.

속성 트리거Property Triggers

Trigger 집합 속성 값 또는 속성의 값을 기반으로 하는 작업을 시작 하는 속성 트리거 호출 됩니다.A Trigger that sets property values or starts actions based on the value of a property is called a property trigger.

속성 트리거를 사용 하는 방법을 보여 주기 위해, 할 수 있습니다 각 ListBoxItem 선택 되지 않은 경우 부분적으로 투명 하 게 합니다.To demonstrate how to use property triggers, you can make each ListBoxItem partially transparent unless it is selected. 다음 스타일 집합을 Opacity 의 값을 ListBoxItem0.5합니다.The following style sets the Opacity value of a ListBoxItem to 0.5. 경우는 IsSelected 속성은 true그러나 합니다 Opacity 로 설정 된 1.0:When the IsSelected property is true, however, the Opacity is set to 1.0:

<Style TargetType="ListBoxItem">
  <Setter Property="Opacity" Value="0.5" />
  <Setter Property="MaxHeight" Value="75" />
  <Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
        <Setter Property="Opacity" Value="1.0" />
    </Trigger>
  </Style.Triggers>
</Style>

이 예에서는 Trigger 속성 값을 설정 하는 합니다 Trigger 클래스에는 EnterActionsExitActions 작업을 수행 하는 트리거를 사용 하도록 설정 하는 속성입니다.This example uses a Trigger to set a property value, but note that the Trigger class also has the EnterActions and ExitActions properties that enable a trigger to perform actions.

있음을 MaxHeight 의 속성을 ListBoxItem 로 설정 된 75합니다.Notice that the MaxHeight property of the ListBoxItem is set to 75. 다음 그림에서 세 번째 항목이 선택된 항목입니다.In the following illustration, the third item is the selected item:

스타일 지정된 ListViewStyled ListView

EventTrigger 및 and StoryboardEventTriggers and Storyboards

다른 유형의 트리거를 EventTrigger, 일련의 이벤트의 발생을 기반으로 하는 작업을 시작 하는 합니다.Another type of trigger is the EventTrigger, which starts a set of actions based on the occurrence of an event. 예를 들어, 다음 EventTrigger 마우스 포인터가 내부로 들어갈 때 개체가 지정 하는 ListBoxItem, MaxHeight 속성의 값에 애니메이션 효과 90 조치를 0.2 두 번째 기간.For example, the following EventTrigger objects specify that when the mouse pointer enters the ListBoxItem, the MaxHeight property animates to a value of 90 over a 0.2 second period. 마우스가 항목을 떠나면 속성은 1초 기간에 걸쳐 원래 값으로 돌아갑니다.When the mouse moves away from the item, the property returns to the original value over a period of 1 second. 확인 되는 방법을 지정 하는 데 필요한를 To 에 대 한 값을 MouseLeave 애니메이션 합니다.Note how it is not necessary to specify a To value for the MouseLeave animation. 이는 애니메이션은 원래 값을 추적할 수 있기 때문입니다.This is because the animation is able to keep track of the original value.

<EventTrigger RoutedEvent="Mouse.MouseEnter">
  <EventTrigger.Actions>
    <BeginStoryboard>
      <Storyboard>
        <DoubleAnimation
          Duration="0:0:0.2"
          Storyboard.TargetProperty="MaxHeight"
          To="90"  />
      </Storyboard>
    </BeginStoryboard>
  </EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="Mouse.MouseLeave">
  <EventTrigger.Actions>
    <BeginStoryboard>
      <Storyboard>
        <DoubleAnimation
          Duration="0:0:1"
          Storyboard.TargetProperty="MaxHeight"  />
      </Storyboard>
    </BeginStoryboard>
  </EventTrigger.Actions>
</EventTrigger>

자세한 내용은 스토리보드 개요를 참조하세요.For more information, see the Storyboards Overview.

다음 그림에서 마우스는 세 번째 항목을 가리키고 있습니다.In the following illustration, the mouse is pointing to the third item:

스타일 샘플 스크린 샷Styling sample screenshot

MultiTrigger, DataTrigger 및 MultiDataTriggerMultiTriggers, DataTriggers, and MultiDataTriggers

외에 TriggerEventTrigger, 다른 형식의 트리거가 있습니다.In addition to Trigger and EventTrigger, there are other types of triggers. MultiTrigger 여러 조건에 따라 속성 값을 설정할 수 있습니다.MultiTrigger allows you to set property values based on multiple conditions. 사용할 DataTriggerMultiDataTrigger 조건의 속성이 데이터 바인딩된 경우입니다.You use DataTrigger and MultiDataTrigger when the property of your condition is data-bound.

공유 리소스 및 테마Shared Resources and Themes

일반적인 Windows Presentation Foundation (WPF) 응용 프로그램을 응용 프로그램에 걸쳐 적용 되는 여러 사용자 인터페이스 (UI) 리소스가 있을 수 있습니다.A typical Windows Presentation Foundation (WPF) application might have multiple user interface (UI) resources that are applied throughout the application. 전체적으로 이 리소스 집합을 애플리케이션에 대한 테마로 간주할 수 있습니다.Collectively, this set of resources can be considered the theme for the application. Windows Presentation Foundation (WPF) 지 패키징 사용자 인터페이스 (UI) 리소스를 테마로 캡슐화 된 리소스 사전을 사용 하 여는 ResourceDictionary 클래스입니다.Windows Presentation Foundation (WPF) provides support for packaging user interface (UI) resources as a theme by using a resource dictionary that is encapsulated as the ResourceDictionary class.

Windows Presentation Foundation (WPF) 테마는 요소의 시각적 개체를 사용자 지정에 대 한 스타일 지정 및 Windows Presentation Foundation (WPF)를 노출 하는 템플릿 메커니즘을 사용 하 여 정의 됩니다.Windows Presentation Foundation (WPF) themes are defined by using the styling and templating mechanism that Windows Presentation Foundation (WPF) exposes for customizing the visuals of any element.

Windows Presentation Foundation (WPF) 테마 리소스는 포함 된 리소스 사전에 저장 됩니다.Windows Presentation Foundation (WPF) theme resources are stored in embedded resource dictionaries. 이러한 리소스 사전은 서명된 어셈블리에 포함되어야 하고 같은 어셈블리에 코드 자체로 포함되거나 side-by-side 어셈블리에 포함될 수 있습니다.These resource dictionaries must be embedded within a signed assembly, and can either be embedded in the same assembly as the code itself or in a side-by-side assembly. PresentationFramework.dll, Windows Presentation Foundation (WPF) 컨트롤을 포함 하는 어셈블리의 경우 테마 리소스는 일련의 side-by-side-어셈블리에서.In the case of PresentationFramework.dll, the assembly which contains Windows Presentation Foundation (WPF) controls, theme resources are in a series of side-by-side assemblies.

테마는 요소의 스타일을 검색할 때 보이는 마지막 위치가 됩니다.The theme becomes the last place to look when searching for the style of an element. 일반적으로 적절한 리소스를 검색할 때 요소 트리에서 위로 이동하면 검색이 시작되고 애플리케이션 리소스 컬렉션을 확인하고 마지막으로 시스템을 쿼리합니다.Typically, the search will begin by walking up the element tree searching for an appropriate resource, then look in the application resource collection and finally query the system. 이를 통해 애플리케이션 개발자는 테마에 도달하기 전에 트리 또는 애플리케이션 수준에서 개체에 대한 스타일을 다시 정의할 수 있습니다.This gives application developers a chance to redefine the style for any object at the tree or application level before reaching the theme.

리소스 사전을 여러 애플리케이션에 걸쳐 테마를 재사용할 수 있는 개별 파일로 정의할 수 있습니다.You can define resource dictionaries as individual files that enable you to reuse a theme across multiple applications. 또한 같은 형식의 리소스를 제공하지만 값이 서로 다른 여러 리소스 사전을 정의하여 전환 가능한 테마를 만들 수 있습니다.You can also create swappable themes by defining multiple resource dictionaries that provide the same types of resources but with different values. 애플리케이션에 스킨을 지정하려면 애플리케이션 수준에서 이러한 스타일이나 다른 리소스를 다시 정의하는 것이 좋습니다.Redefining these styles or other resources at the application level is the recommended approach for skinning an application.

스타일 및 템플릿, 여러 응용 프로그램에서 같은 리소스 집합을 공유를 만들 수 있습니다는 XAMLXAML 파일 및 정의 ResourceDictionary입니다.To share a set of resources, including styles and templates, across applications, you can create a XAMLXAML file and define a ResourceDictionary. 예를 들어 Styling with ControlTemplates Sample(ControlTemplate으로 스타일 지정 샘플)의 일부를 보여 주는 다음 그림을 살펴보겠습니다.For example, take a look at the following illustration that shows part of the Styling with ControlTemplates Sample:

컨트롤 템플릿 예제Control Template Examples

샘플에서 XAMLXAML 파일을 살펴보면 파일에 모두 다음 항목이 포함됨을 알 수 있습니다.If you look at the XAMLXAML files in the sample, you will notice that the files all have the following:

<ResourceDictionary.MergedDictionaries>
  <ResourceDictionary Source="Shared.xaml" />
</ResourceDictionary.MergedDictionaries>

공유 하는 것 shared.xaml를 정의 하는 한 ResourceDictionary 동일 하 게 표시 하려면이 샘플의 컨트롤을 활성화 하는 스타일 및 브러시 리소스 집합이 포함 된 합니다.It is the sharing of shared.xaml, which defines a ResourceDictionary that contains a set of style and brush resources that enables the controls in the sample to have a consistent look.

자세한 내용은 병합된 리소스 사전을 참조하세요.For more information, see Merged Resource Dictionaries.

사용자 지정 컨트롤에 대한 테마를 만들 경우 컨트롤 작성 개요의 외부 컨트롤 라이브러리 섹션을 참조하세요.If you are creating a theme for you custom control, see the External Control Library section of the Control Authoring Overview.

참고자료See also