|
|
|
@ -0,0 +1,203 @@ |
|
|
|
|
<Window x:Class="MVVMwithWPF.Views.SliderCheckBoxWindow" |
|
|
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" |
|
|
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
|
|
|
|
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" |
|
|
|
|
xmlns:local="clr-namespace:MVVMwithWPF.Views" |
|
|
|
|
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" |
|
|
|
|
Title="SliderCheckBoxWindow" |
|
|
|
|
Width="800" |
|
|
|
|
Height="450" |
|
|
|
|
mc:Ignorable="d"> |
|
|
|
|
<Window.Resources> |
|
|
|
|
<!-- 색상 --> |
|
|
|
|
<Color x:Key="GreenColor">#00C28C</Color> |
|
|
|
|
<Color x:Key="LightGrayColor">#C5C5C5</Color> |
|
|
|
|
<SolidColorBrush x:Key="GreenBrush" Color="{StaticResource GreenColor}" /> |
|
|
|
|
<SolidColorBrush x:Key="LightGrayBrush" Color="{StaticResource LightGrayColor}" /> |
|
|
|
|
|
|
|
|
|
<!-- 스타일 --> |
|
|
|
|
<Style x:Key="SliderCheckBox" TargetType="{x:Type CheckBox}"> |
|
|
|
|
<Setter Property="MaxHeight" Value="20" /> |
|
|
|
|
<Setter Property="MaxWidth" Value="35" /> |
|
|
|
|
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" /> |
|
|
|
|
<Setter Property="BorderThickness" Value="1" /> |
|
|
|
|
<Setter Property="Cursor" Value="Hand" /> |
|
|
|
|
<Setter Property="Template"> |
|
|
|
|
<Setter.Value> |
|
|
|
|
<ControlTemplate TargetType="{x:Type CheckBox}"> |
|
|
|
|
<ControlTemplate.Resources> |
|
|
|
|
<Storyboard x:Key="StoryboardIsChecked"> |
|
|
|
|
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckFlag" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0" Value="0" /> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="14" /> |
|
|
|
|
</DoubleAnimationUsingKeyFrames> |
|
|
|
|
</Storyboard> |
|
|
|
|
<Storyboard x:Key="StoryboardIsCheckedOff"> |
|
|
|
|
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckFlag" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0" Value="14" /> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" /> |
|
|
|
|
</DoubleAnimationUsingKeyFrames> |
|
|
|
|
</Storyboard> |
|
|
|
|
</ControlTemplate.Resources> |
|
|
|
|
<BulletDecorator Background="Transparent" SnapsToDevicePixels="true"> |
|
|
|
|
<BulletDecorator.Bullet> |
|
|
|
|
<Border x:Name="ForegroundPanel" |
|
|
|
|
Width="35" Height="20" |
|
|
|
|
BorderThickness="1" CornerRadius="10"> |
|
|
|
|
<Canvas> |
|
|
|
|
<!-- 원 색상 --> |
|
|
|
|
<Border x:Name="CheckFlag" |
|
|
|
|
Width="19" Height="18" |
|
|
|
|
VerticalAlignment="Center" |
|
|
|
|
Background="White" BorderThickness="1" CornerRadius="10" RenderTransformOrigin="0.5,0.5"> |
|
|
|
|
<Border.RenderTransform> |
|
|
|
|
<TransformGroup> |
|
|
|
|
<ScaleTransform /> |
|
|
|
|
<SkewTransform /> |
|
|
|
|
<RotateTransform /> |
|
|
|
|
<TranslateTransform /> |
|
|
|
|
</TransformGroup> |
|
|
|
|
</Border.RenderTransform> |
|
|
|
|
<Border.Effect> |
|
|
|
|
<DropShadowEffect Direction="180" ShadowDepth="1" /> |
|
|
|
|
</Border.Effect> |
|
|
|
|
</Border> |
|
|
|
|
</Canvas> |
|
|
|
|
</Border> |
|
|
|
|
</BulletDecorator.Bullet> |
|
|
|
|
<ContentPresenter Margin="{TemplateBinding Padding}" |
|
|
|
|
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" |
|
|
|
|
VerticalAlignment="Center" |
|
|
|
|
RecognizesAccessKey="True" |
|
|
|
|
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> |
|
|
|
|
</BulletDecorator> |
|
|
|
|
<ControlTemplate.Triggers> |
|
|
|
|
<Trigger Property="HasContent" Value="true"> |
|
|
|
|
<Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}" /> |
|
|
|
|
<Setter Property="Padding" Value="4,0,0,0" /> |
|
|
|
|
</Trigger> |
|
|
|
|
<Trigger Property="IsEnabled" Value="false"> |
|
|
|
|
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" /> |
|
|
|
|
</Trigger> |
|
|
|
|
<Trigger Property="IsChecked" Value="True"> |
|
|
|
|
<Setter TargetName="ForegroundPanel" Property="Background" Value="{StaticResource GreenBrush}" /> |
|
|
|
|
<Trigger.EnterActions> |
|
|
|
|
<BeginStoryboard x:Name="BeginStoryboardCheckedTrue" Storyboard="{StaticResource StoryboardIsChecked}" /> |
|
|
|
|
<RemoveStoryboard BeginStoryboardName="BeginStoryboardCheckedFalse" /> |
|
|
|
|
</Trigger.EnterActions> |
|
|
|
|
</Trigger> |
|
|
|
|
<Trigger Property="IsChecked" Value="False"> |
|
|
|
|
<Setter TargetName="ForegroundPanel" Property="Background" Value="{StaticResource LightGrayBrush}" /> |
|
|
|
|
<Trigger.EnterActions> |
|
|
|
|
<BeginStoryboard x:Name="BeginStoryboardCheckedFalse" Storyboard="{StaticResource StoryboardIsCheckedOff}" /> |
|
|
|
|
<RemoveStoryboard BeginStoryboardName="BeginStoryboardCheckedTrue" /> |
|
|
|
|
</Trigger.EnterActions> |
|
|
|
|
</Trigger> |
|
|
|
|
</ControlTemplate.Triggers> |
|
|
|
|
</ControlTemplate> |
|
|
|
|
</Setter.Value> |
|
|
|
|
</Setter> |
|
|
|
|
</Style> |
|
|
|
|
<Style x:Key="SliderCheckBox_Square" TargetType="{x:Type CheckBox}"> |
|
|
|
|
<Setter Property="MaxHeight" Value="20" /> |
|
|
|
|
<Setter Property="MaxWidth" Value="35" /> |
|
|
|
|
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" /> |
|
|
|
|
<Setter Property="BorderThickness" Value="1" /> |
|
|
|
|
<Setter Property="Cursor" Value="Hand" /> |
|
|
|
|
<Setter Property="Template"> |
|
|
|
|
<Setter.Value> |
|
|
|
|
<ControlTemplate TargetType="{x:Type CheckBox}"> |
|
|
|
|
<ControlTemplate.Resources> |
|
|
|
|
<Storyboard x:Key="StoryboardIsChecked"> |
|
|
|
|
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckFlag" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0" Value="0" /> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="14" /> |
|
|
|
|
</DoubleAnimationUsingKeyFrames> |
|
|
|
|
</Storyboard> |
|
|
|
|
<Storyboard x:Key="StoryboardIsCheckedOff"> |
|
|
|
|
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckFlag" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0" Value="14" /> |
|
|
|
|
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" /> |
|
|
|
|
</DoubleAnimationUsingKeyFrames> |
|
|
|
|
</Storyboard> |
|
|
|
|
</ControlTemplate.Resources> |
|
|
|
|
<BulletDecorator Background="Transparent" SnapsToDevicePixels="true"> |
|
|
|
|
<BulletDecorator.Bullet> |
|
|
|
|
<Border x:Name="ForegroundPanel" |
|
|
|
|
Width="35" Height="20" |
|
|
|
|
BorderThickness="1" CornerRadius="3"> |
|
|
|
|
<Canvas> |
|
|
|
|
<!-- 원 색상 --> |
|
|
|
|
<Border x:Name="CheckFlag" |
|
|
|
|
Width="19" Height="18" |
|
|
|
|
VerticalAlignment="Center" |
|
|
|
|
Background="White" BorderThickness="1" CornerRadius="3" RenderTransformOrigin="0.5,0.5"> |
|
|
|
|
<Border.RenderTransform> |
|
|
|
|
<TransformGroup> |
|
|
|
|
<ScaleTransform /> |
|
|
|
|
<SkewTransform /> |
|
|
|
|
<RotateTransform /> |
|
|
|
|
<TranslateTransform /> |
|
|
|
|
</TransformGroup> |
|
|
|
|
</Border.RenderTransform> |
|
|
|
|
<Border.Effect> |
|
|
|
|
<DropShadowEffect Direction="180" ShadowDepth="1" /> |
|
|
|
|
</Border.Effect> |
|
|
|
|
</Border> |
|
|
|
|
</Canvas> |
|
|
|
|
</Border> |
|
|
|
|
</BulletDecorator.Bullet> |
|
|
|
|
<ContentPresenter Margin="{TemplateBinding Padding}" |
|
|
|
|
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" |
|
|
|
|
VerticalAlignment="Center" |
|
|
|
|
RecognizesAccessKey="True" |
|
|
|
|
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> |
|
|
|
|
</BulletDecorator> |
|
|
|
|
<ControlTemplate.Triggers> |
|
|
|
|
<Trigger Property="HasContent" Value="true"> |
|
|
|
|
<Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}" /> |
|
|
|
|
<Setter Property="Padding" Value="4,0,0,0" /> |
|
|
|
|
</Trigger> |
|
|
|
|
<Trigger Property="IsEnabled" Value="false"> |
|
|
|
|
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" /> |
|
|
|
|
</Trigger> |
|
|
|
|
<Trigger Property="IsChecked" Value="True"> |
|
|
|
|
<Setter TargetName="ForegroundPanel" Property="Background" Value="{StaticResource GreenBrush}" /> |
|
|
|
|
<Trigger.EnterActions> |
|
|
|
|
<BeginStoryboard x:Name="BeginStoryboardCheckedTrue" Storyboard="{StaticResource StoryboardIsChecked}" /> |
|
|
|
|
<RemoveStoryboard BeginStoryboardName="BeginStoryboardCheckedFalse" /> |
|
|
|
|
</Trigger.EnterActions> |
|
|
|
|
</Trigger> |
|
|
|
|
<Trigger Property="IsChecked" Value="False"> |
|
|
|
|
<Setter TargetName="ForegroundPanel" Property="Background" Value="{StaticResource LightGrayBrush}" /> |
|
|
|
|
<Trigger.EnterActions> |
|
|
|
|
<BeginStoryboard x:Name="BeginStoryboardCheckedFalse" Storyboard="{StaticResource StoryboardIsCheckedOff}" /> |
|
|
|
|
<RemoveStoryboard BeginStoryboardName="BeginStoryboardCheckedTrue" /> |
|
|
|
|
</Trigger.EnterActions> |
|
|
|
|
</Trigger> |
|
|
|
|
</ControlTemplate.Triggers> |
|
|
|
|
</ControlTemplate> |
|
|
|
|
</Setter.Value> |
|
|
|
|
</Setter> |
|
|
|
|
</Style> |
|
|
|
|
|
|
|
|
|
<Style x:Key="CheckRadioFocusVisual"> |
|
|
|
|
<Setter Property="Control.Template"> |
|
|
|
|
<Setter.Value> |
|
|
|
|
<ControlTemplate> |
|
|
|
|
<Rectangle Margin="14,0,0,0" |
|
|
|
|
SnapsToDevicePixels="true" |
|
|
|
|
Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" |
|
|
|
|
StrokeDashArray="1 2" StrokeThickness="1" /> |
|
|
|
|
</ControlTemplate> |
|
|
|
|
</Setter.Value> |
|
|
|
|
</Setter> |
|
|
|
|
</Style> |
|
|
|
|
</Window.Resources> |
|
|
|
|
<Grid> |
|
|
|
|
<StackPanel Orientation="Vertical"> |
|
|
|
|
<CheckBox Style="{StaticResource SliderCheckBox}"/> |
|
|
|
|
<CheckBox Style="{StaticResource SliderCheckBox_Square}"/> |
|
|
|
|
</StackPanel> |
|
|
|
|
</Grid> |
|
|
|
|
</Window> |