사용할 수 있는 기능 집합(스타일, 템플릿, 트리거 및 스토리보드)을 가리킵니다.
Style은 시각적 속성 설정을 재사용 가능한 리소스로 추출합니다.
암시적 또는 명시적 스타일 적용이 가능하며,
파생스타일을 사용할 수도 있습니다.
두 개의 TextBlock의 공통속성들을 Style로 간편하게 적용해보겠습니다.
공통속성들을 Style로 만든 모습.
<Window.Resources>
<Style x:Key="TextBlockStyle1" TargetType="{x:Type TextBlock}">
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Top"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="FontSize" Value="16"/>
</Style>
</Window.Resources>
<Grid>
<TextBlock Text="WPF" Style="{DynamicResource TextBlockStyle1}" />
<TextBlock Text="Style, CotrolTemplate" Margin="0,26,0,0" Style="{DynamicResource TextBlockStyle1}" FontSize="14" />
</Grid>
<Style x:Key="TextBlockStyle1" TargetType="{x:Type TextBlock}">
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Top"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="FontSize" Value="16"/>
</Style>
</Window.Resources>
<Grid>
<TextBlock Text="WPF" Style="{DynamicResource TextBlockStyle1}" />
<TextBlock Text="Style, CotrolTemplate" Margin="0,26,0,0" Style="{DynamicResource TextBlockStyle1}" FontSize="14" />
</Grid>
암시적 또는 명시적 Style 적용
Style을 Resource로 정의할 경우 다음 두 가지 방법으로 스타일을 컨트롤에 적용할 수 있습니다.
-암시적 적용 - Style에 대하여 TargetType만 지정합니다. 이 경우, 명시하지 않은 같은 TargetType 모두에게 적용됩니다.
-명시적 적용 - Style에 대해 TargetType 및 x:Key 특성을 지정한 다음 명시적 키를 사용하는 StaticResource 참조로 대상 컨트롤의 Style 속성을 설정합니다.
Style에 TargetType만 지정하여 모든 TextBlock에 암시적 스타일을 적용 한 모습.
Style="{x:Null}" 을 사용하여, 암시적 스타일을 거부하는 모습
파생스타일은 스타일 재사용을 최적화하기 위해 BasedOn 속성을 사용하여, 다른 스타일에서 상속받는 스타일을 만들 수 있습니다.
- 공통적인 건 상속받고, 다른 부분만 설정하여 최적화합니다.
<Window.Resources>
<Style x:Key="TextBlockStyle1" TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="White"/>
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Top"/>
<Setter Property="FontSize" Value="16"/>
</Style>
<Style x:Key="TextBlockStyle2" BasedOn="{StaticResource TextBlockStyle1}" TargetType="{x:Type TextBlock}">
<Setter Property="FontSize" Value="14"/>
<Setter Property="Margin" Value="0,26,0,0"/>
</Style>
</Window.Resources>
<Grid>
<TextBlock Text="WPF" Style="{DynamicResource TextBlockStyle1}" />
<TextBlock Text="Style, CotrolTemplate" Style="{DynamicResource TextBlockStyle2}" />
</Grid>
<Style x:Key="TextBlockStyle1" TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="White"/>
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Top"/>
<Setter Property="FontSize" Value="16"/>
</Style>
<Style x:Key="TextBlockStyle2" BasedOn="{StaticResource TextBlockStyle1}" TargetType="{x:Type TextBlock}">
<Setter Property="FontSize" Value="14"/>
<Setter Property="Margin" Value="0,26,0,0"/>
</Style>
</Window.Resources>
<Grid>
<TextBlock Text="WPF" Style="{DynamicResource TextBlockStyle1}" />
<TextBlock Text="Style, CotrolTemplate" Style="{DynamicResource TextBlockStyle2}" />
</Grid>
스타일 편집하는 방법은
뷰화면에서 편집할 컨트롤 우클릭으로 하는 방법
레이어에서 편집할 컨트롤 우클릭으로 하는 방법(왼쪽)
상단개체 메뉴를 이용하는 방법(오른쪽) 세가지가 있습니다.
복사본 편집은 Blend에서 기본 적용돼 있는 스타일을 복사편집하는 것이구요,
빈 항목 만들기는 새로이 만들겠다는 뜻입니다.
0 개의 댓글:
댓글 쓰기