WPF 基础控件之CheckBox样式

WPF开发者QQ群：340500857

由于微信群人数太多入群请添加小编微信号

yanjinhuawechat 或 W_Feng_aiQ 邀请入群

需备注WPF开发者

PS：有更好的方式欢迎推荐。

支持Nuget

Install-Package WPFDevelopers.Minimal -Version 3.0.0

—

代码如下

一、创建 Styles.CheckBox.xaml 代码如下。

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:sys="clr-namespace:System;assembly=mscorlib"><ResourceDictionary.MergedDictionaries><ResourceDictionary Source="../Themes/Basic/ControlBasic.xaml"/><ResourceDictionary Source="../Themes/Basic/Animations.xaml"/></ResourceDictionary.MergedDictionaries><Style TargetType="{x:Type CheckBox}" BasedOn="{StaticResource ControlBasicStyle}"><Setter Property="FocusVisualStyle" Value="{x:Null}" /><Setter Property="Cursor" Value="Hand"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type CheckBox}"><BulletDecorator Background="Transparent"><BulletDecorator.Bullet><Border CornerRadius="{Binding ElementName=PART_Border,Path=CornerRadius}"Background="{Binding ElementName=PART_Border,Path=Background}"><Border x:Name="PART_Border" Width="16" Height="16"CornerRadius="3"BorderThickness="1"BorderBrush="{DynamicResource BaseSolidColorBrush}"Background="{DynamicResource WhiteSolidColorBrush}"><Grid><Path x:Name="PART_CheckMark" SnapsToDevicePixels="False" VerticalAlignment="Center" HorizontalAlignment="Center"Data="{StaticResource PathCheckMark}"RenderTransformOrigin=".5,.5"Stretch="Fill" Fill="{DynamicResource WhiteSolidColorBrush}"><Path.RenderTransform><ScaleTransform ScaleX="0" ScaleY="0"/></Path.RenderTransform></Path><Rectangle Width="6" Height="2" VerticalAlignment="Center" HorizontalAlignment="Center"x:Name="PART_InderminateMark"RenderTransformOrigin=".5,.5"Fill="{DynamicResource PrimaryNormalSolidColorBrush}"><Rectangle.RenderTransform><ScaleTransform ScaleX="0"/></Rectangle.RenderTransform></Rectangle></Grid></Border></Border></BulletDecorator.Bullet><ContentPresenter x:Name="PART_ContentPresenter"Focusable="False"HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="2,0,0,0" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"TextElement.Foreground="{DynamicResource PrimaryTextSolidColorBrush}"></ContentPresenter><VisualStateManager.VisualStateGroups><VisualStateGroup x:Name="CheckStates"><VisualState x:Name="Checked"><Storyboard><DoubleAnimation Storyboard.TargetName="PART_CheckMark"Storyboard.TargetProperty="(Path.RenderTransform).(ScaleTransform.ScaleX)" To=".7" Duration="00:00:.2"EasingFunction="{StaticResource ExponentialEaseOut}"/><DoubleAnimation Storyboard.TargetName="PART_CheckMark"Storyboard.TargetProperty="(Path.RenderTransform).(ScaleTransform.ScaleY)" To=".5" Duration="00:00:.2"EasingFunction="{StaticResource ExponentialEaseOut}"/></Storyboard></VisualState><VisualState x:Name="Unchecked" /><VisualState x:Name="Indeterminate"/></VisualStateGroup></VisualStateManager.VisualStateGroups></BulletDecorator><ControlTemplate.Triggers><Trigger Property="IsChecked" Value="True"><Setter Property="Background" TargetName="PART_Border" Value="{DynamicResource PrimaryNormalSolidColorBrush}"/><Setter Property="BorderBrush" TargetName="PART_Border" Value="{DynamicResource PrimaryNormalSolidColorBrush}"/><Setter Property="TextElement.Foreground" TargetName="PART_ContentPresenter" Value="{DynamicResource PrimaryNormalSolidColorBrush}"/></Trigger><Trigger Property="IsChecked" Value="{x:Null}"><Trigger.EnterActions><BeginStoryboard x:Name="PART_BeginStoryboardIsCheckedNull"><Storyboard><DoubleAnimation Storyboard.TargetName="PART_InderminateMark"Storyboard.TargetProperty="(Path.RenderTransform).(ScaleTransform.ScaleX)" To="1" Duration="00:00:.2"EasingFunction="{StaticResource ExponentialEaseOut}"/></Storyboard></BeginStoryboard></Trigger.EnterActions><Trigger.ExitActions><RemoveStoryboard BeginStoryboardName="PART_BeginStoryboardIsCheckedNull"></RemoveStoryboard></Trigger.ExitActions></Trigger><MultiTrigger><MultiTrigger.Conditions><Condition Property="IsChecked" Value="False" /><Condition Property="IsMouseOver" Value="True" /></MultiTrigger.Conditions><Setter Property="BorderBrush" TargetName="PART_Border" Value="{DynamicResource PrimaryMouseOverSolidColorBrush}"/></MultiTrigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style></ResourceDictionary>

二、使用 Styles.CheckBox.xaml 代码如下。

<TextBlock Text="Checkbox" FontSize="20" Margin="0,20,0,0"/><WrapPanel Margin="0,10"><CheckBox Content="Option A"/><CheckBox Content="Option B" Margin="10,0" IsChecked="True"/><CheckBox Content="Option C" IsChecked="{x:Null}"/><CheckBox Content="Option D" Margin="10,0" IsEnabled="False"/></WrapPanel>

—

效果预览

鸣谢素材提供者 - element

源码地址如下

Github：https://github.com/WPFDevelopersOrg

Gitee：https://gitee.com/WPFDevelopersOrg

https://gitee.com/WPFDevelopersOrg/WPFDevelopers.Minimal

https://github.com/WPFDevelopersOrg/WPFDevelopers.Minimal

WPF开发者QQ群： 340500857

Github：https://github.com/WPFDevelopersOrg

出处：https://www.cnblogs.com/yanjinhua

版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。