WPF CheckBox 滑块 样式 开关

2017-08-28 19:45:51来源:CSDN作者:zhumingyan人点击

分享

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}" />

最新文章

123

最新摄影

闪念基因

微信扫一扫

第七城市微信公众平台