WPF之CheckBox样式

2017-06-23 11:29:38来源:CSDN作者:qq_23018459人点击

  <Style x:Key="qq.checkbox"
           TargetType="{x:Type CheckBox}">
        <Setter Property="FocusVisualStyle"
                Value="{DynamicResource FocusVisual}" />
        <Setter Property="Background"
                Value="#FFFFFF" />
        <Setter Property="BorderBrush"
                Value="#ABADB3" />
        <Setter Property="Foreground"
                Value="#656565" />
        <Setter Property="BorderThickness"
                Value="1" />
        <Setter Property="Padding"
                Value="5,4" />
        <Setter Property="VerticalAlignment"
                Value="Center" />
        <Setter Property="VerticalContentAlignment"
                Value="Center" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type CheckBox}">
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="AyWhenCheckedBox">
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)"
                                                           Storyboard.TargetName="indeterminateMark">
                                <EasingDoubleKeyFrame KeyTime="0"
                                                      Value="0" />
                            </DoubleAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)"
                                                           Storyboard.TargetName="optionMark">
                                <EasingDoubleKeyFrame KeyTime="0"
                                                      Value="0">
                                    <EasingDoubleKeyFrame.EasingFunction>
                                        <CircleEase EasingMode="EaseOut" />
                                    </EasingDoubleKeyFrame.EasingFunction>
                                </EasingDoubleKeyFrame>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.15"
                                                      Value="17" />
                                <EasingDoubleKeyFrame KeyTime="0:0:0.3"
                                                      Value="11" />
                            </DoubleAnimationUsingKeyFrames>
                            <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.Padding)"
                                                              Storyboard.TargetName="CheckOutBorder">
                                <EasingThicknessKeyFrame KeyTime="0:0:0.1"
                                                         Value="4" />
                                <EasingThicknessKeyFrame KeyTime="0:0:0.15"
                                                         Value="1" />
                                <EasingThicknessKeyFrame KeyTime="0:0:0.3"
                                                         Value="4" />
                            </ThicknessAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="AyWhenCheckBoxUnCheck">
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)"
                                                           Storyboard.TargetName="optionMark">
                                <EasingDoubleKeyFrame KeyTime="0"
                                                      Value="11" />
                                <EasingDoubleKeyFrame KeyTime="0:0:0.1"
                                                      Value="17" />
                                <EasingDoubleKeyFrame KeyTime="0:0:0.3"
                                                      Value="0" />
                            </DoubleAnimationUsingKeyFrames>
                            <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.Padding)"
                                                              Storyboard.TargetName="CheckOutBorder">
                                <EasingThicknessKeyFrame KeyTime="0"
                                                         Value="4" />
                                <EasingThicknessKeyFrame KeyTime="0:0:0.1"
                                                         Value="1" />
                                <EasingThicknessKeyFrame KeyTime="0:0:0.15"
                                                         Value="4" />
                            </ThicknessAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)"
                                                           Storyboard.TargetName="indeterminateMark">
                                <EasingDoubleKeyFrame KeyTime="0"
                                                      Value="0" />
                                <EasingDoubleKeyFrame KeyTime="0:0:0.3"
                                                      Value="1" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="AyCheckBoxNull">
                            <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)"
                                                              Storyboard.TargetName="nullMark">
                                <EasingThicknessKeyFrame KeyTime="0"
                                                         Value="9"></EasingThicknessKeyFrame>
                                <EasingThicknessKeyFrame KeyTime="0:0:0.15"
                                                         Value="1" />
                                <EasingThicknessKeyFrame KeyTime="0:0:0.3"
                                                         Value="3" />
                            </ThicknessAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="AyCheckBoxNullExit">
                            <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)"
                                                              Storyboard.TargetName="nullMark">
                                <EasingThicknessKeyFrame KeyTime="0"
                                                         Value="3">
                                    <EasingThicknessKeyFrame.EasingFunction>
                                        <CircleEase EasingMode="EaseOut" />
                                    </EasingThicknessKeyFrame.EasingFunction>
                                </EasingThicknessKeyFrame>
                                <EasingThicknessKeyFrame KeyTime="0:0:0.1"
                                                         Value="1" />
                                <EasingThicknessKeyFrame KeyTime="0:0:0.3"
                                                         Value="9" />
                            </ThicknessAnimationUsingKeyFrames>
                        </Storyboard>
                    </ControlTemplate.Resources>
                    <StackPanel Orientation="Horizontal"
                                x:Name="templateRoot"
                                Background="Transparent"
                                SnapsToDevicePixels="True">
                        <Border x:Name="CheckOutBorder"
                                Padding="4"
                                Width="21"
                                Height="21">
                            <Border x:Name="checkBoxBorder"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="1"
                                    Background="{TemplateBinding Background}"
                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                    MinWidth="13"
                                    MinHeight="13">
                                <Grid x:Name="markGrid">
                                    <Path Width="0"
                                          x:Name="optionMark"
                                          Stretch="Uniform"
                                          RenderTransformOrigin="0.5,0.5"
                                          Data="F1M5.095,11.131C5.095,11.131 1.107,16.095 1.107,16.095 1.107,16.095 3.991,19.357 6.277,22.564 6.559,22.96 6.843,23.381 7.12,23.806 8.392,25.761 9.503,27.798 9.503,27.798 9.503,27.798 11.786,27.952 11.786,27.952 11.786,27.952 16.066,21.908 20.851,15.898 26.005,9.425 31.94,4.202 31.94,4.202 31.94,4.202 29.714,1.476 29.714,1.476 29.714,1.476 24.586,4.752 20.043,8.787 17.521,11.026 11.628,18.722 11.628,18.722 11.628,18.722 10.19,18.667 10.19,18.667 10.19,18.667 8.573,15.665 7.842,14.508 6.569,12.494 5.095,11.131 5.095,11.131z"
                                          Fill="{DynamicResource AyCheckBox.OptionMark.Static.Glyph}" />
                                    <Rectangle Margin="1"
                                               x:Name="indeterminateMark"
                                               Fill="#FFFFFF"
                                               Opacity="1" />
                                    <Rectangle Margin="9"
                                               x:Name="nullMark"
                                               Fill="{DynamicResource AyCheckBox.OptionMark.Static.Glyph}" />
                                </Grid>
                            </Border>
                        </Border>
                        <ContentPresenter x:Name="contentPresenter"
                                          Focusable="False"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          Margin="{TemplateBinding Padding}"
                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                          VerticalAlignment="Center" />
                    </StackPanel>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver"
                                 Value="true">
                            <Setter Property="Background"
                                    TargetName="checkBoxBorder"
                                    Value="{DynamicResource AyCheckBox.OptionMark.MouseOver.Background}" />
                            <Setter Property="BorderBrush"
                                    TargetName="checkBoxBorder"
                                    Value="{DynamicResource AyCheckBox.OptionMark.MouseOver.Border}" />
                            <Setter Property="Opacity"
                                    TargetName="indeterminateMark"
                                    Value="0" />
                        </Trigger>
                        <Trigger Property="IsEnabled"
                                 Value="false">
                            <Setter Property="Opacity"
                                    Value="0.5" />
                        </Trigger>
                        <Trigger Property="IsChecked"
                                 Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard x:Name="AyWhenCheckedBox_BeginStoryboard"
                                                 Storyboard="{StaticResource AyWhenCheckedBox}" />
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard x:Name="AyWhenCheckBoxUnCheck_BeginStoryboard"
                                                 Storyboard="{StaticResource AyWhenCheckBoxUnCheck}" />
                            </Trigger.ExitActions>
                            <Setter Property="Opacity"
                                    TargetName="indeterminateMark"
                                    Value="0" />
                            <Setter Property="Background"
                                    TargetName="checkBoxBorder"
                                    Value="{DynamicResource AyCheckBox.OptionMark.MouseOver.Background}" />
                            <Setter Property="BorderBrush"
                                    TargetName="checkBoxBorder"
                                    Value="{DynamicResource AyCheckBox.OptionMark.MouseOver.Border}" />
                        </Trigger>
                        <Trigger Property="IsChecked"
                                 Value="{x:Null}">
                            <Trigger.ExitActions>
                                <BeginStoryboard x:Name="AyCheckBoxNullExit_BeginStoryboard"
                                                 Storyboard="{StaticResource AyCheckBoxNullExit}" />
                            </Trigger.ExitActions>
                            <Trigger.EnterActions>
                                <BeginStoryboard x:Name="AyCheckBoxNull_BeginStoryboard"
                                                 Storyboard="{StaticResource AyCheckBoxNull}" />
                            </Trigger.EnterActions>
                            <Setter Property="Opacity"
                                    TargetName="indeterminateMark"
                                    Value="0" />
                            <Setter Property="BorderBrush"
                                    TargetName="checkBoxBorder"
                                    Value="{DynamicResource AyCheckBox.OptionMark.MouseOver.Border}" />
                            <Setter Property="Background"
                                    TargetName="checkBoxBorder"
                                    Value="{DynamicResource AyCheckBox.OptionMark.MouseOver.Background}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>


 <CheckBox Style="{DynamicResource qq.checkbox}" KeyboardNavigation.TabIndex="2" Canvas.Left="152" Canvas.Top="103" Foreground="#ABADB3">忘记密码</CheckBox>
 <CheckBox Style="{DynamicResource qq.checkbox}" KeyboardNavigation.TabIndex="3" Canvas.Left="306" Canvas.Top="103" Foreground="#ABADB3">自动登录</CheckBox>



最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台