WPF CheckBox 滑块 样式 开关

效果图

样式代码

<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}}" StrokeThickness="1" StrokeDashArray="1 2"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="SliderCheckBox" TargetType="{x:Type CheckBox}"> <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.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="CheckFlag"> <EasingDoubleKeyFrame KeyTime="0" Value="0"/> <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="14"/> </DoubleAnimationUsingKeyFrames> </Storyboard> <Storyboard x:Key="StoryboardIsCheckedOff"> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="CheckFlag"> <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" BorderThickness="1" Width="35" Height="20" CornerRadius="10"> <Canvas> <Border Background="White" x:Name="CheckFlag" CornerRadius="10" VerticalAlignment="Center" BorderThickness="1" Width="19" Height="18" RenderTransformOrigin="0.5,0.5"> <Border.RenderTransform> <TransformGroup> <ScaleTransform/> <SkewTransform/> <RotateTransform/> <TranslateTransform/> </TransformGroup> </Border.RenderTransform> <Border.Effect> <DropShadowEffect ShadowDepth="1" Direction="180" /> </Border.Effect> </Border> </Canvas> </Border> </BulletDecorator.Bullet> <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/> </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="{DynamicResource Accent}" />--> <Setter TargetName="ForegroundPanel" Property="Background" Value="Green" /> <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="Gray" /> <Trigger.EnterActions> <BeginStoryboard x:Name="BeginStoryboardCheckedFalse" Storyboard="{StaticResource StoryboardIsCheckedOff}" /> <RemoveStoryboard BeginStoryboardName="BeginStoryboardCheckedTrue" /> </Trigger.EnterActions> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>

引用代码

<CheckBox Name="Checker1" Style="{DynamicResource SliderCheckBox}" Content="{Binding ElementName=Checker1,Path=IsChecked}" />

转载于:https://www.cnblogs.com/sjqq/p/8392266.html