WPF 基础控件之CheckBox样式
Posted dotNET跨平台
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了WPF 基础控件之CheckBox样式相关的知识,希望对你有一定的参考价值。
WPF开发者QQ群:340500857
由于微信群人数太多入群请添加小编微信号
yanjinhuawechat 或 W_Feng_aiQ 邀请入群
需备注WPF开发者
PS:有更好的方式欢迎推荐。
支持Nuget
Install-Package WPFDevelopers.Minimal -Version 3.0.0
01
—
代码如下
一、创建 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>
02
—
效果预览
鸣谢素材提供者 - 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 国际」许可协议进行许可。
转载请著名作者 出处 https://github.com/WPFDevelopersOrg
扫一扫关注我们,
更多知识早知道!
点击阅读原文可跳转至源代码
以上是关于WPF 基础控件之CheckBox样式的主要内容,如果未能解决你的问题,请参考以下文章