728x90
반응형
728x170
▶ 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="VisualStateManager 엘리먼트 : 커스텀 CheckBox 엘리먼트 정의하기"
FontFamily="나눔고딕코딩"
FontSize="16">
<Window.Resources>
<Style x:Key="CheckBoxStyleKey" TargetType="CheckBox">
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="CheckBox">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CommonStates">
<VisualStateGroup.Transitions>
<VisualTransition From="Pressed" To="Normal">
<Storyboard>
<ColorAnimation
Storyboard.TargetName="checkRectangle"
Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"
Duration="00:00:00.5"
To="Red" />
</Storyboard>
</VisualTransition>
</VisualStateGroup.Transitions>
<VisualState Name="MouseOver">
<Storyboard>
<ColorAnimation
Storyboard.TargetName="checkRectangle"
Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"
Duration="00:00:00.5"
To="PaleGreen" />
</Storyboard>
</VisualState>
<VisualState Name="Pressed">
<Storyboard>
<ColorAnimation
Storyboard.TargetName="checkRectangle"
Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"
Duration="00:00:00.5"
To="Navy" />
</Storyboard>
</VisualState>
<VisualState Name="Disabled">
<Storyboard>
<ColorAnimation
Storyboard.TargetName="checkRectangle"
Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"
Duration="00:00:00.5"
To="Gray" />
</Storyboard>
</VisualState>
<VisualState Name="Normal">
<Storyboard>
<ColorAnimation
Storyboard.TargetName="checkRectangle"
Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"
Duration="00:00:00.5" />
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup Name="CheckStates">
<VisualState Name="Checked">
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="tickPath"
Storyboard.TargetProperty="Opacity"
Duration="0"
To="1" />
</Storyboard>
</VisualState>
<VisualState Name="Unchecked" />
</VisualStateGroup>
<VisualStateGroup Name="FocusStates">
<VisualState Name="Unfocused" />
<VisualState Name="Focused">
<Storyboard>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="focusRectangle"
Storyboard.TargetProperty="Visibility"
Duration="0">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="ContentFocused">
<Storyboard>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="focusRectangle"
Storyboard.TargetProperty="Visibility"
Duration="0">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Rectangle Name="checkRectangle" Grid.Row="0"
HorizontalAlignment="Left"
Width="12"
Height="12"
RadiusX="2"
RadiusY="2"
Stroke="Blue"
Fill="Aqua" />
<Path Name="tickPath" Grid.Row="0"
HorizontalAlignment="Left"
Width="12"
Height="12"
StrokeThickness="2"
Stroke="Black"
Opacity="0"
Data="M 3 6 L 5 9 9 2" />
<Rectangle Name="focusRectangle" Grid.Column="1"
Margin="-2 -2 0 -2"
StrokeDashArray=".2 2"
StrokeDashCap="Round"
Visibility="Collapsed"
IsHitTestVisible="false"
Stroke="#ff333333" />
<ContentPresenter Grid.Column="1"
VerticalAlignment="Center" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<StackPanel
HorizontalAlignment="Center"
VerticalAlignment="Center">
<CheckBox
Style="{StaticResource CheckBoxStyleKey}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Height="25"
IsChecked="True"
Content="체크 항목 1" />
<CheckBox
Style="{StaticResource CheckBoxStyleKey}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Margin="0 10 0 0"
Height="25"
IsChecked="True"
Content="체크 항목 2" />
</StackPanel>
</Grid>
</Window>728x90
반응형
그리드형(광고전용)
'C# > WPF' 카테고리의 다른 글
| [C#/WPF] IValueConverter 인터페이스 : 높이→반경 변환자 사용하기 (0) | 2021.02.26 |
|---|---|
| [C#/WPF] AnimationTimeline 클래스 : 커스텀 브러시 애니메이션 사용하기 (0) | 2021.02.26 |
| [C#/WPF] UI 자동화 사용하기 (0) | 2021.02.25 |
| [C#/WPF] TextBox 엘리먼트 : Text 속성 변경시 애니메이션 사용하기 (0) | 2021.02.25 |
| [C#/WPF] Storyboard 엘리먼트 : 행진하는 개미, 펄스, 뒤집기, 탄성 줄, 나이트 라이더 애니메이션 사용하기 (0) | 2021.02.25 |
| [C#/WPF] DropShadowEffect 엘리먼트 사용하기 (0) | 2021.02.21 |
| [C#/WPF] RichTextBox 클래스 : RTF 파일 로드하기 (0) | 2021.02.21 |
| [C#/WPF] FocusManager 클래스 : SetFocusedElement 정적 메소드를 사용해 논리적 포커스 설정하기 (0) | 2021.02.21 |
| [C#/WPF] Keyboard 클래스 : Focus 정적 메소드를 사용해 포커스 설정하기 (0) | 2021.02.21 |
| [C#/WPF] Typography 엘리먼트 : Capitals 첨부 속성 사용하기 (0) | 2021.02.21 |
댓글을 달아 주세요