WPF自定义开关切换按钮
突发奇想先要自己写一个开关按钮，说干就开干了，以下为View视图布局代码，开关按钮的样式就直接在这里定义了，主要呢通过定义触发器来完成按钮的切换。
```csharp<Window x:Class="DEMO.View.StatusWindow"xmlns="/winfx//xaml/presentation"xmlns:x="/winfx//xaml"xmlns:d="/expression/blend/"xmlns:mc="/markup-compatibility/"xmlns:local="clr-namespace:DEMO.View"DataContext="{Binding Source={StaticResource Locator},Path=Status}"mc:Ignorable="d"Title="StatusWindow" Height="200" Width="250"><Window.Resources><ResourceDictionary><Style x:Key="ToggleButtonStyle" TargetType="{x:Type ToggleButton}"><Setter Property="Width" Value="45"></Setter><Setter Property="Height" Value="20"></Setter><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="ToggleButton"><!--定义视觉树--><Border x:Name="border" BorderThickness="1.5" CornerRadius="9" BorderBrush="#aaa" Background="#2790ff"><Grid x:Name="togglebutton" HorizontalAlignment="Right" ><Border Width="17" Height="17" CornerRadius="9" Background="White"/></Grid><!--阴影设置--><Border.Effect><DropShadowEffect Color="Gray" BlurRadius="5" ShadowDepth="0" Opacity="0.5" /></Border.Effect></Border><!--定义触发器--><ControlTemplate.Triggers><Trigger Property="IsChecked" Value="false"><Setter TargetName="border" Property="Background" Value="#ccc"/><Setter TargetName="togglebutton" Property="HorizontalAlignment" Value="Left"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style></ResourceDictionary></Window.Resources><Grid><StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center"><ToggleButton Style="{StaticResource ToggleButtonStyle}" IsChecked="{Binding ToggleBtnIsCheck}"/><TextBlock Text="{Binding ToggleStatus}" Margin="10 0 0 0"/></StackPanel></Grid></Window>
再来看看页面搭好了就得看看开关按钮时相应的文字状态如何切换吧！新建一个ViewModel，去ViewModelLocator.cs注册好后，再去到页面绑定它，接下来看代码，如下，两个字段分别是状态文字和按钮状态，主要是运用三目运算符去设置。```csharppublic class StatusViewModel : ViewModelBase{private String toggleStatus;/// <summary>/// 开关状态/// </summary>public String ToggleStatus{get { return toggleStatus; }set { toggleStatus = value; RaisePropertyChanged(() => ToggleStatus); }}private bool toggleBtnIsCheck = true;/// <summary>/// 开关按钮/// </summary>public bool ToggleBtnIsCheck{get { return toggleBtnIsCheck; }set{toggleBtnIsCheck = value;RaisePropertyChanged(() => ToggleBtnIsCheck);ToggleStatus = toggleBtnIsCheck ? "开" : "关";}}}
写完了下面就启动运行看一下页面的效果吧！启动默认是开启的状态，移上去点击就关闭了，大家伙也快点去尝试一下吧！
那么本篇学习文章就分享到这里啦！若有不足的地方，还望请多多指教！
