728x90
반응형
728x170
■ ControlTemplate 엘리먼트를 사용해 ToolBar 엘리먼트를 정의하는 방법을 보여준다.
▶ 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="WindowColorKey">#ffe8edf9</Color>
<Color x:Key="DisabledControlDarkColorKey">#ffc5cbf9</Color>
<Color x:Key="ControlLightColorKey">White</Color>
<Color x:Key="ControlMediumColorKey">#ff7381f9</Color>
<Color x:Key="ControlMouseOverColorKey">#ff3843c4</Color>
<Color x:Key="ControlPressedColorKey">#ff211aa9</Color>
<Color x:Key="BorderLightColorKey">#ffcccccc</Color>
<Color x:Key="BorderMediumColorKey">#ff888888</Color>
<Color x:Key="BorderDarkColorKey">#ff444444</Color>
<Color x:Key="DisabledBorderLightColorKey">#ffaaaaaa</Color>
<Style x:Key="ToolBarButtonBaseStyleKey" TargetType="{x:Type ButtonBase}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ButtonBase}">
<Border Name="border"
BorderThickness="1">
<Border.BorderBrush>
<LinearGradientBrush
StartPoint="0.5 0"
EndPoint="0.5 1">
<GradientStop Offset="0" Color="{DynamicResource BorderLightColorKey}" />
<GradientStop Offset="1" Color="{DynamicResource BorderMediumColorKey}" />
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush
StartPoint="0.5 0"
EndPoint="0.5 1">
<GradientStop Offset="0" Color="{DynamicResource ControlLightColorKey}" />
<GradientStop Offset="1" Color="{DynamicResource ControlMediumColorKey}" />
</LinearGradientBrush>
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CommonStates">
<VisualState Name="Normal" />
<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="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlDarkColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup Name="CheckStates">
<VisualState Name="Checked">
<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="Unchecked" />
<VisualState Name="Indeterminate" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ContentPresenter
HorizontalAlignment="Center"
VerticalAlignment="Center"
Margin="2"
RecognizesAccessKey="True" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Static ToolBar.ButtonStyleKey}" TargetType="{x:Type Button}"
BasedOn="{StaticResource ToolBarButtonBaseStyleKey}" />
<Style x:Key="{x:Static ToolBar.ToggleButtonStyleKey}" TargetType="{x:Type ToggleButton}"
BasedOn="{StaticResource ToolBarButtonBaseStyleKey}" />
<Style x:Key="{x:Static ToolBar.CheckBoxStyleKey}" TargetType="{x:Type CheckBox}"
BasedOn="{StaticResource ToolBarButtonBaseStyleKey}" />
<Style x:Key="{x:Static ToolBar.RadioButtonStyleKey}" TargetType="{x:Type RadioButton}"
BasedOn="{StaticResource ToolBarButtonBaseStyleKey}" />
<Style x:Key="{x:Static ToolBar.TextBoxStyleKey}" TargetType="{x:Type TextBox}">
<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 TextBox}">
<Border Name="border"
BorderThickness="1"
Padding="2">
<Border.Background>
<SolidColorBrush Color="{DynamicResource ControlLightColorKey}" />
</Border.Background>
<Border.BorderBrush>
<SolidColorBrush Color="{StaticResource 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 DisabledControlDarkColorKey}" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledBorderLightColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="ReadOnly" />
<VisualState Name="MouseOver" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ScrollViewer Name="PART_ContentHost"
Margin="0" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ToolBarThumbStyleKey" TargetType="{x:Type Thumb}">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Cursor" Value="SizeAll" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Border
Background="Transparent"
SnapsToDevicePixels="True">
<Rectangle Margin="0 2">
<Rectangle.Fill>
<DrawingBrush
ViewboxUnits="Absolute"
Viewbox="0 0 8 8"
ViewportUnits="Absolute"
Viewport="0 0 4 4"
TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing
Brush="#aaa"
Geometry="M 4 4 L 4 8 L 8 8 L 8 4 z" />
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Rectangle.Fill>
</Rectangle>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ToolBarOverflowButtonStyleKey" TargetType="{x:Type ToggleButton}">
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border Name="border"
CornerRadius="0 3 3 0"
SnapsToDevicePixels="true">
<Border.Background>
<LinearGradientBrush
StartPoint="0.5 0"
EndPoint="0.5 1">
<GradientStop Offset="0" Color="#00000000" />
<GradientStop Offset="1" />
</LinearGradientBrush>
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CommonStates">
<VisualState Name="Normal" />
<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="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetName="border"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledBorderLightColorKey}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid>
<Path
VerticalAlignment="Bottom"
Margin="2 3"
Fill="Black"
Data="M -0.5 3 L 5.5 3 L 2.5 6 Z" />
<ContentPresenter />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type ToolBar}" TargetType="{x:Type ToolBar}">
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolBar}">
<Border Name="border"
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 Offset="0.0" Color="#fff" />
<GradientStop Offset="1.0" Color="{DynamicResource ControlMediumColorKey}" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.Background>
<DockPanel>
<ToggleButton DockPanel.Dock="Right"
Style="{StaticResource ToolBarOverflowButtonStyleKey}"
ClickMode="Press"
IsEnabled="{TemplateBinding HasOverflowItems}"
IsChecked="{Binding IsOverflowOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">
<Popup
Placement="Bottom"
AllowsTransparency="true"
PopupAnimation="Slide"
StaysOpen="false"
Focusable="false"
IsOpen="{Binding IsOverflowOpen, RelativeSource={RelativeSource TemplatedParent}}">
<Border
BorderThickness="1">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource BorderMediumColorKey}" />
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush
StartPoint="0.5 0"
EndPoint="0.5 1">
<GradientStop Color="{DynamicResource ControlLightColorKey}" />
<GradientStop Offset="1" Color="{DynamicResource ControlMediumColorKey}" />
</LinearGradientBrush>
</Border.Background>
<ToolBarOverflowPanel Name="PART_ToolBarOverflowPanel"
FocusVisualStyle="{x:Null}"
Margin="2"
WrapWidth="200"
Focusable="true"
KeyboardNavigation.TabNavigation="Cycle"
KeyboardNavigation.DirectionalNavigation="Cycle" />
</Border>
</Popup>
</ToggleButton>
<Thumb Name="toolBarThumb"
Style="{StaticResource ToolBarThumbStyleKey}"
Width="10" />
<ToolBarPanel Name="PART_ToolBarPanel"
Margin="0 1 2 2"
IsItemsHost="true" />
</DockPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsOverflowOpen" Value="true">
<Setter
TargetName="toolBarThumb"
Property="IsEnabled"
Value="false" />
</Trigger>
<Trigger Property="ToolBarTray.IsLocked" Value="true">
<Setter
TargetName="toolBarThumb"
Property="Visibility"
Value="Collapsed" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type ToolBarTray}" TargetType="{x:Type ToolBarTray}">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush
StartPoint="0 0"
EndPoint="1 0">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0.0" Color="#fff" />
<GradientStop Offset="1.0" Color="{DynamicResource WindowColorKey}" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<DockPanel LastChildFill="False">
<ToolBarTray DockPanel.Dock="Top">
<ToolBar>
<Button Content="Button" />
<CheckBox Content="CheckBox" />
<TextBox Text="TextBox" />
<TextBox Text="Disabled TextBox"
IsEnabled="False" />
<ToggleButton Content="ToggleButton" />
<RadioButton IsChecked="True"
Content="RadioButton 1" />
<RadioButton IsChecked="True"
Content="RadioButton 1" />
<Button Content="Button"
ToolBar.OverflowMode="Always" />
<CheckBox Content="CheckBox"
ToolBar.OverflowMode="Always" />
<TextBox Text="TextBox"
ToolBar.OverflowMode="Always" />
</ToolBar>
</ToolBarTray>
</DockPanel>
</Window>
728x90
반응형
그리드형(광고전용)
'C# > WPF' 카테고리의 다른 글
[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 엘리먼트 : TreeView 엘리먼트 정의하기 (0) | 2023.02.10 |
[C#/WPF] ControlTemplate 엘리먼트 : ToolTip 엘리먼트 정의하기 (0) | 2023.02.10 |
[C#/WPF] ControlTemplate 엘리먼트 : Thumb 엘리먼트 정의하기 (0) | 2023.02.08 |
[C#/WPF] ControlTemplate 엘리먼트 : TextBox 엘리먼트 정의하기 (0) | 2023.02.07 |
[C#/WPF] ControlTemplate 엘리먼트 : TabControl 엘리먼트 정의하기 (0) | 2023.02.07 |
[C#/WPF] ControlTemplate 엘리먼트 : StatusBar 엘리먼트 정의하기 (0) | 2023.02.07 |
[C#/WPF] ControlTemplate 엘리먼트 : Slider 엘리먼트 정의하기 (0) | 2023.02.06 |
댓글을 달아 주세요