重写控件模板
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="CheckBox">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{TemplateBinding Content}" Grid.Column="1" Name="ShowText" Margin="5,0,0,0"/>
<Rectangle Name="Rect" Grid.Column="0" Height="{Binding ElementName=ShowText,Path=ActualHeight}"
Width="{Binding RelativeSource={RelativeSource Mode=Self},Path=ActualHeight}"/>
<TextBlock Text="L" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" RenderTransformOrigin="0.5,0.5" Foreground="White">
<TextBlock.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="1" ScaleX="-1"/>
<SkewTransform AngleY="0" AngleX="0"/>
<RotateTransform Angle="45"/>
<TranslateTransform/>
</TransformGroup>
</TextBlock.RenderTransform>
</TextBlock>
</Grid>
</Setter.Value>
</Setter>
触发器,当IsChecked
为true
时填充个颜色指向Rectangle
<Trigger Property="IsChecked" Value="true">
<Setter Property="Fill" Value="#555ED4" TargetName="Rect"/>
</Trigger>
<Trigger Property="IsChecked" Value="false">
<Setter Property="Fill" Value="Lightgray" TargetName="Rect"/>
</Trigger>
引用资源样式
<CheckBox IsChecked="True" Content="记住密码"
Height="15" Style="{StaticResource checkboxStyle}"
Foreground="Gray"/>
效果图
完整代码
<Style x:Key="checkboxStyle" TargetType="CheckBox">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="CheckBox">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{TemplateBinding Content}" Grid.Column="1" Name="ShowText" Margin="5,0,0,0"/>
<Rectangle Name="Rect" Grid.Column="0" Height="{Binding ElementName=ShowText,Path=ActualHeight}"
Width="{Binding RelativeSource={RelativeSource Mode=Self},Path=ActualHeight}"/>
<TextBlock Text="L" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" RenderTransformOrigin="0.5,0.5" Foreground="White">
<TextBlock.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="1" ScaleX="-1"/>
<SkewTransform AngleY="0" AngleX="0"/>
<RotateTransform Angle="45"/>
<TranslateTransform/>
</TransformGroup>
</TextBlock.RenderTransform>
</TextBlock>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="true">
<Setter Property="Fill" Value="#555ED4" TargetName="Rect"/>
</Trigger>
<Trigger Property="IsChecked" Value="false">
<Setter Property="Fill" Value="Lightgray" TargetName="Rect"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Cursor" Value="Hand"/>
</Style>