c# WPF中CheckBox樣式的使用總結
背景
很多時候我們使用WPF開發界面的時候經常會用到各種空間，很多時候我們需要去自定義控件的樣式來替換默認的樣式，今天通過兩個方法來替換WPF中的CheckBox樣式，透過這兩個例子我們可以掌握基本的WPF樣式的開發如何定義ControlTemplate以及使用附加屬性來為我們的控件增加新的樣式。
常規使用
我們在使用CheckBox的時候，原始的樣式有時不能滿足我們的需求，這是我們就需要更改其模板，比如我們常用的一種，在播放器中“播放”、“暫停”按鈕，其實這也是一種CheckBox,隻不過我們隻是修改瞭其相關的模板罷瞭，下面貼出相關代碼：
<CheckBox.Style>
<Style TargetType="{x:Type CheckBox}">
<Setter Property="Focusable" Value="False" />
<Setter Property="IsTabStop" Value="False" />
<!--把OverridesDefaultStyle設置為True，表示這個控件不使用當前Themes的任何屬性。-->
<Setter Property="OverridesDefaultStyle" Value="True" />
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<Grid Background="Transparent">
<Image Source="/EarthSimulation;component/Images/按鈕-播放.png"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<Grid Background="Transparent">
<Image Source="/EarthSimulation;component/Images/按鈕-暫停.png"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
</CheckBox>
進階用法
上面的使用較為簡單，下面我們通過一個更加復雜一些的例子來增加對自定義控件模板的理解，我們先來看看我們定義的樣式。
<Style x:Key="CheckBoxStyle" TargetType="{x:Type CheckBox}">
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<Border x:Name="templateRoot" Background="{TemplateBinding Background}" >
<Grid SnapsToDevicePixels="True">
<Grid.Resources>
<PathGeometry x:Key="geometryCheck" Figures="M540.5696 102.4c-225.83296 0-409.6 183.74656-409.6 409.6s183.76704 409.6 409.6 409.6c225.87392 0 409.6-183.74656 409.6-409.6S766.44352 102.4 540.5696 102.4zM721.16224 468.48l-175.37024 175.39072c-12.20608 12.1856-28.20096 18.28864-44.19584 18.28864-15.95392 0-31.96928-6.10304-44.15488-18.28864l-97.44384-97.44384c-24.39168-24.39168-24.39168-63.93856 0-88.33024 24.39168-24.41216 63.91808-24.41216 88.35072 0l53.248 53.248 131.23584-131.21536c24.35072-24.3712 63.95904-24.3712 88.33024 0C745.55392 404.52096 745.55392 444.08832 721.16224 468.48z"/>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="30"/>
</Grid.ColumnDefinitions>
<Border>
<Path Width="18" Height="18" Stretch="Uniform"
Data="{Binding (local_ctrl:GeometryAP.IconGeometry), RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type CheckBox}}}"
Fill="{Binding (local_ctrl:GeometryAP.IconFill), RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type CheckBox}}}"/>
</Border>
<ContentPresenter x:Name="contentPresenter" Grid.Column="1" Focusable="False"
Margin="{TemplateBinding Padding}"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
HorizontalAlignment="Left"
VerticalAlignment="Center"/>
<Border x:Name="checkBoxBorder"
Grid.Column="2"
Margin="1"
BorderBrush="Transparent"
BorderThickness="1"
Background="Transparent"
HorizontalAlignment="Left"
VerticalAlignment="Center">
<Grid x:Name="markGrid">
<Path x:Name="optionMark" Width="20" Height="20"
Stretch="Uniform"
Data="{StaticResource geometryCheck}"
Fill="LightSeaGreen" Margin="1" Opacity="0"/>
</Grid>
</Border>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="HasContent" Value="true">
<Setter Property="Padding" Value="4,-1,0,0"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Background" Value="#22222222"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value=".3"/>
</Trigger>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Background" Value="#22333333"/>
</Trigger>
<Trigger Property="IsChecked" Value="true">
<Setter Property="Opacity" TargetName="optionMark" Value="1"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
後面我們再來看看，我們使用CheckBox的地方。
<CheckBox Grid.Row="1" Grid.Column="1"
IsChecked="{Binding VM.IsHorizontal,ElementName=_this}" Content="Horizontal"
Style="{StaticResource CheckBoxStyle}"
local_ctrl:GeometryAP.IconGeometry="{StaticResource geometryDirection}"
local_ctrl:GeometryAP.IconFill="LightSeaGreen"/>
這個地方我們為CheckBox增加瞭兩個附加屬性IconGeometry、IconFill這樣我們就能夠將這兩個附加屬性綁定到CheckBox樣式中的Path裡面的Data和Fill依賴項屬性上面，通過上面的過程我們就能夠定義各種各樣的CheckBox樣式瞭，下面我們看看我們定義的這兩個附加屬性具體的代碼。
public class GeometryAP : DependencyObject
{
public static PathGeometry GetIconGeometry(DependencyObject obj)
{
return (PathGeometry)obj.GetValue(IconGeometryProperty);
}
public static void SetIconGeometry(DependencyObject obj, PathGeometry value)
{
obj.SetValue(IconGeometryProperty, value);
}
public static Brush GetIconFill(DependencyObject obj)
{
return (Brush)obj.GetValue(IconFillProperty);
}
public static void SetIconFill(DependencyObject obj, Brush brush)
{
obj.SetValue(IconFillProperty, brush);
}
public static readonly DependencyProperty IconGeometryProperty = DependencyProperty.RegisterAttached("IconGeometry", typeof(PathGeometry), typeof(GeometryAP));
public static readonly DependencyProperty IconFillProperty = DependencyProperty.RegisterAttached("IconFill", typeof(Brush), typeof(GeometryAP), new PropertyMetadata(Brushes.Transparent));
}
樣式欣賞
以上就是c# WPF中CheckBox樣式的使用總結的詳細內容，更多關於c# WPF中CheckBox樣式的資料請關註WalkonNet其它相關文章！
推薦閱讀：
- 在C# WPF下自定義滾動條ScrollViewer樣式的操作
- WPF開發技巧之花式控件功能擴展詳解
- C# WPF 自定義按鈕的方法
- C# wpf簡單顏色板的實現
- c# WPF實現Windows資源管理器(附源碼)