728x90
반응형
728x170
■ ControlTemplate 엘리먼트를 사용해 TreeView 엘리먼트를 정의하는 방법을 보여준다.
▶ 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="DisabledForegroundColorKey">#ff888888</Color>
<Color x:Key="SelectedBackgroundColorKey">#ffc5cbf9</Color>
<Color x:Key="SelectedUnfocusedColorKey">#ffdddddd</Color>
<Color x:Key="ControlLightColorKey">White</Color>
<Color x:Key="ControlMediumColorKey">#ff7381f9</Color>
<Color x:Key="ControlPressedColorKey">#ff211aa9</Color>
<Color x:Key="GlyphColorKey">#ff444444</Color>
<Color x:Key="BorderLightColorKey">#ffcccccc</Color>
<Color x:Key="BorderMediumColorKey">#ff888888</Color>
<Color x:Key="BorderDarkColorKey">#ff444444</Color>
<Style x:Key="ScrollBarLineButtonStyleKey" TargetType="{x:Type RepeatButton}">
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Border Name="border"
Margin="1"
CornerRadius="2"
BorderThickness="1">
<Border.BorderBrush>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="0 1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0.0" Color="{DynamicResource BorderMediumColorKey}" />
<GradientStop Offset="1.0" Color="{DynamicResource BorderDarkColorKey }" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="0 1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="{DynamicResource ControlLightColorKey }" />
<GradientStop Offset="1.0" Color="{DynamicResource ControlMediumColorKey}" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CommonStates">
<VisualState Name="Normal" />
<VisualState Name="MouseOver" />
<VisualState Name="Pressed">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="arrowPath"
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Path Name="arrowPath"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}">
<Path.Fill>
<SolidColorBrush Color="{DynamicResource GlyphColorKey}" />
</Path.Fill>
</Path>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ScrollBarPageButtonStyleKey" TargetType="{x:Type RepeatButton}">
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="IsTabStop" Value="false" />
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Border Background="Transparent" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ScrollBarThumbStyleKey" TargetType="{x:Type Thumb}">
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="IsTabStop" Value="false" />
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Border
CornerRadius="2"
BorderThickness="1"
BorderBrush="{TemplateBinding BorderBrush}"
Background="{TemplateBinding Background}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<ControlTemplate x:Key="VerticalScrollBarTemplateKey" TargetType="{x:Type ScrollBar}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition MaxHeight="18" />
<RowDefinition Height="0.00001*" />
<RowDefinition MaxHeight="18" />
</Grid.RowDefinitions>
<Border Grid.RowSpan="3"
CornerRadius="2"
Background="#f0f0f0" />
<RepeatButton Grid.Row="0"
Style="{StaticResource ScrollBarLineButtonStyleKey}"
Height="18"
Command="ScrollBar.LineUpCommand"
Content="M 0 4 L 8 4 L 4 0 Z" />
<Track Name="PART_Track" Grid.Row="1"
IsDirectionReversed="true">
<Track.DecreaseRepeatButton>
<RepeatButton
Style="{StaticResource ScrollBarPageButtonStyleKey}"
Command="ScrollBar.PageUpCommand" />
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb
Style="{StaticResource ScrollBarThumbStyleKey}"
Margin="1 0 1 0">
<Thumb.BorderBrush>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="1 0">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0.0" Color="{DynamicResource BorderLightColorKey}" />
<GradientStop Offset="1.0" Color="{DynamicResource BorderDarkColorKey }" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Thumb.BorderBrush>
<Thumb.Background>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="1 0">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0.0" Color="{DynamicResource ControlLightColorKey }" />
<GradientStop Offset="1.0" Color="{DynamicResource ControlMediumColorKey}" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Thumb.Background>
</Thumb>
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton
Style="{StaticResource ScrollBarPageButtonStyleKey}"
Command="ScrollBar.PageDownCommand" />
</Track.IncreaseRepeatButton>
</Track>
<RepeatButton Grid.Row="2"
Style="{StaticResource ScrollBarLineButtonStyleKey}"
Height="18"
Command="ScrollBar.LineDownCommand"
Content="M 0 0 L 4 4 L 8 0 Z" />
</Grid>
</ControlTemplate>
<ControlTemplate x:Key="HorizontalScrollBarTemplateKey" TargetType="{x:Type ScrollBar}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition MaxWidth="18" />
<ColumnDefinition Width="0.00001*" />
<ColumnDefinition MaxWidth="18" />
</Grid.ColumnDefinitions>
<Border Grid.ColumnSpan="3"
CornerRadius="2"
Background="#f0f0f0" />
<RepeatButton Grid.Column="0"
Style="{StaticResource ScrollBarLineButtonStyleKey}"
Width="18"
Command="ScrollBar.LineLeftCommand"
Content="M 4 0 L 4 8 L 0 4 Z" />
<Track Name="PART_Track" Grid.Column="1"
IsDirectionReversed="False">
<Track.DecreaseRepeatButton>
<RepeatButton
Style="{StaticResource ScrollBarPageButtonStyleKey}"
Command="ScrollBar.PageLeftCommand" />
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb
Style="{StaticResource ScrollBarThumbStyleKey}"
Margin="0 1 0 1">
<Thumb.BorderBrush>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="1 0">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0.0" Color="{DynamicResource BorderLightColorKey}" />
<GradientStop Offset="1.0" Color="{DynamicResource BorderDarkColorKey }" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Thumb.BorderBrush>
<Thumb.Background>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="0 1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0.0" Color="{DynamicResource ControlLightColorKey }" />
<GradientStop Offset="1.0" Color="{DynamicResource ControlMediumColorKey}" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Thumb.Background>
</Thumb>
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton
Style="{StaticResource ScrollBarPageButtonStyleKey}"
Command="ScrollBar.PageRightCommand" />
</Track.IncreaseRepeatButton>
</Track>
<RepeatButton Grid.Column="2"
Style="{StaticResource ScrollBarLineButtonStyleKey}"
Width="18"
Command="ScrollBar.LineRightCommand"
Content="M 0 0 L 4 4 L 0 8 Z" />
</Grid>
</ControlTemplate>
<Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="OverridesDefaultStyle" Value="True" />
<Style.Triggers>
<Trigger Property="Orientation" Value="Horizontal">
<Setter Property="Width" Value="Auto" />
<Setter Property="Height" Value="18" />
<Setter Property="Template" Value="{StaticResource HorizontalScrollBarTemplateKey}" />
</Trigger>
<Trigger Property="Orientation" Value="Vertical">
<Setter Property="Width" Value="18" />
<Setter Property="Height" Value="Auto" />
<Setter Property="Template" Value="{StaticResource VerticalScrollBarTemplateKey}" />
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="ExpandCollapseToggleButtonStyleKey" TargetType="ToggleButton">
<Setter Property="Focusable" Value="False" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ToggleButton">
<Grid
Width="15"
Height="13"
Background="Transparent">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CheckStates">
<VisualState Name="Checked">
<Storyboard>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="collapsedPath"
Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Hidden}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="expandedPath"
Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="Unchecked" />
<VisualState Name="Indeterminate" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Path Name="collapsedPath"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="1 1 1 1"
Data="M 4 0 L 8 4 L 4 8 Z">
<Path.Fill>
<SolidColorBrush Color="{DynamicResource GlyphColorKey}" />
</Path.Fill>
</Path>
<Path Name="expandedPath"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="1 1 1 1"
Data="M 0 4 L 8 4 L 4 8 Z"
Visibility="Hidden">
<Path.Fill>
<SolidColorBrush Color="{DynamicResource GlyphColorKey}" />
</Path.Fill>
</Path>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="TreeViewItemFocusVisualStyleKey">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Border>
<Rectangle
Margin="0 0 0 0"
StrokeThickness="5"
Stroke="Black"
StrokeDashArray="1 2"
Opacity="0" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}">
<Setter Property="Background" Value="Transparent" />
<Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
<Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
<Setter Property="Padding" Value="1 0 0 0" />
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
<Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisualStyleKey}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TreeViewItem}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="19" Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="SelectionStates">
<VisualState Name="Selected">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedBackgroundColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="Unselected" />
<VisualState Name="SelectedInactive">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedUnfocusedColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup Name="ExpansionStates">
<VisualState Name="Expanded">
<Storyboard>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="itemsPresenter"
Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="Collapsed" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ToggleButton Name="expanderToggleButton"
Style="{StaticResource ExpandCollapseToggleButtonStyleKey}"
ClickMode="Press"
IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" />
<Border Name="border" Grid.Column="1"
BorderThickness="{TemplateBinding BorderThickness}"
BorderBrush="{TemplateBinding BorderBrush}"
Background="{TemplateBinding Background}"
Padding="{TemplateBinding Padding}">
<ContentPresenter Name="PART_Header"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
ContentSource="Header" />
</Border>
<ItemsPresenter Name="itemsPresenter" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"
Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasItems" Value="false">
<Setter
TargetName="expanderToggleButton"
Property="Visibility"
Value="Hidden" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasHeader" Value="false" />
<Condition Property="Width" Value="Auto" />
</MultiTrigger.Conditions>
<Setter
TargetName="PART_Header"
Property="MinWidth"
Value="75" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasHeader" Value="false" />
<Condition Property="Height" Value="Auto" />
</MultiTrigger.Conditions>
<Setter
TargetName="PART_Header"
Property="MinHeight"
Value="19" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type TreeView}" TargetType="TreeView">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TreeView">
<Border Name="border"
CornerRadius="1"
BorderThickness="1">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource BorderMediumColorKey}" />
</Border.BorderBrush>
<Border.Background>
<SolidColorBrush Color="{DynamicResource ControlLightColorKey}" />
</Border.Background>
<ScrollViewer
Padding="4"
Focusable="False"
CanContentScroll="False">
<ItemsPresenter />
</ScrollViewer>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Border
HorizontalAlignment="Center"
VerticalAlignment="Center"
BorderThickness="1"
BorderBrush="Black">
<TreeView
Width="150"
Height="150">
<TreeViewItem Header="Top One">
<TreeViewItem Header="Sub One" />
<TreeViewItem Header="Sub Two (Longer than Normal)" />
<TreeViewItem Header="Sub Three" />
<TreeViewItem Header="Sub Four">
<TreeViewItem Header="Sub One" />
<TreeViewItem Header="Sub Two" />
<TreeViewItem Header="Sub Three" />
</TreeViewItem>
<TreeViewItem Header="Sub Five" />
</TreeViewItem>
<TreeViewItem Header="Top Two">
<TreeViewItem Header="Sub One" />
<TreeViewItem Header="Sub Two" />
<TreeViewItem Header="Sub Three" />
<TreeViewItem Header="Sub Four">
<TreeViewItem Header="Sub One" />
<TreeViewItem Header="Sub Two" />
<TreeViewItem Header="Sub Three" />
</TreeViewItem>
<TreeViewItem Header="Sub Five" />
</TreeViewItem>
<TreeViewItem Header="Top Three">
<TreeViewItem Header="Sub One" />
<TreeViewItem Header="Sub Two" />
<TreeViewItem Header="Sub Three" />
<TreeViewItem Header="Sub Five" />
</TreeViewItem>
</TreeView>
</Border>
</Window>728x90
반응형
그리드형(광고전용)
'C# > WPF' 카테고리의 다른 글
| [C#/WPF] 데이터 바인딩 사용하기 (0) | 2023.02.16 |
|---|---|
| [C#/WPF] IValueConverter 인터페이스 : 날짜/시간↔문자열 변환자 사용하기 (0) | 2023.02.12 |
| [C#/WPF] ValidationRule 클래스 : 현재 날짜보다 미래 날짜 여부 검증하기 (0) | 2023.02.12 |
| [C#/WPF] IMultiValueConverter 인터페이스 사용하기 (0) | 2023.02.12 |
| [C#/WPF] ControlTemplate 엘리먼트 : Window 엘리먼트 정의하기 (0) | 2023.02.11 |
| [C#/WPF] ControlTemplate 엘리먼트 : ToolTip 엘리먼트 정의하기 (0) | 2023.02.10 |
| [C#/WPF] ControlTemplate 엘리먼트 : ToolBar 엘리먼트 정의하기 (0) | 2023.02.09 |
| [C#/WPF] ControlTemplate 엘리먼트 : Thumb 엘리먼트 정의하기 (0) | 2023.02.08 |
| [C#/WPF] ControlTemplate 엘리먼트 : TextBox 엘리먼트 정의하기 (0) | 2023.02.07 |
| [C#/WPF] ControlTemplate 엘리먼트 : TabControl 엘리먼트 정의하기 (0) | 2023.02.07 |
댓글을 달아 주세요