【转】[C#][WPF] 旋转的播放按钮

转自：http://www.dmskin.com

运行后播放按钮就会一直旋转，而暂停按钮不动。

<Window x:Class="WPF.Views.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WPF.Views"
        mc:Ignorable="d"Height="450" Width="800">
    <Window.Resources>
        <ResourceDictionary>
            <SolidColorBrush x:Key="ThemeColor" Color="#efefef" />
            <Geometry x:Key="Icon_Play">M995.76206814 481.44796294L614.67632587 261.43256005C609.21769525 258.2551482 603.1480239 256.66644227 596.99688042 256.66644227c-6.06967137 0-12.18007878 1.58870593-17.63870938 4.76611779C568.44090979 267.66517562 561.71946164 279.39715784 561.71946164 291.98459711l0 440.15301391c0 12.62817532 6.72144816 24.27868545 17.67944544 30.55203707 5.41789458 3.13667581 11.52830199 4.72538173 17.6387094 4.72538173 6.11040741 0 12.18007878-1.58870593 17.67944544-4.72538173l381.08574227-220.05613893C1006.72006543 536.27868545 1013.44151358 524.62817532 1013.44151358 512 1013.44151358 499.41256073 1006.72006543 487.76205059 995.76206814 481.44796294z</Geometry>
            <Geometry x:Key="Icon_Pause">M347.648 873.472c0 54.784-45.568 99.84-102.4 99.84s-102.4-44.544-102.4-99.84V151.04c0-54.784 45.568-99.84 102.4-99.84s102.4 44.544 102.4 99.84v722.432z m533.504 0c0 54.784-45.568 99.84-102.4 99.84s-102.4-44.544-102.4-99.84V151.04c0-54.784 45.568-99.84 102.4-99.84s102.4 44.544 102.4 99.84v722.432z</Geometry>

            <Style TargetType="TextBlock">
                <Setter Property="FontSize" Value="14" />
            </Style>
            <Style TargetType="TextBox" x:Key="row1">
                <Setter Property="FontSize" Value="14" />
                <Setter Property="HorizontalContentAlignment" Value="Center" />
            </Style>
  
            <Style x:Key="MusicPlayButton" TargetType="ToggleButton">
                <Setter Property="Cursor" Value="Hand" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}">                            
                            <Border
                                x:Name="bg"
                                Background="White"
                                CornerRadius="100"
                                UseLayoutRounding="True">
                                <Path
                                    x:Name="icon"
                                    Width="16"
                                    Height="16"
                                    Margin="5,0,0,0"
                                    Data="{StaticResource Icon_Play}"
                                    Fill="Green"
                                    Stretch="Uniform" />
                                <Border.RenderTransform>
                                    <RotateTransform x:Name="rotateTransform" Angle="0" CenterX="16" CenterY="16" />
                                </Border.RenderTransform>
                            </Border>
                            
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsChecked" Value="True">
                                    <Setter TargetName="icon" Property="Margin" Value="5,0,0,0" />
                                    <Setter TargetName="icon" Property="Data" Value="{StaticResource Icon_Play}" />
                                </Trigger>
                                <Trigger Property="IsChecked" Value="False">
                                    <Setter TargetName="icon" Property="Margin" Value="0" />
                                    <Setter TargetName="icon" Property="Data" Value="{StaticResource Icon_Pause}" />
                                    <Setter TargetName="icon" Property="Fill" Value="Red" />
                                </Trigger>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter TargetName="bg" Property="Background" Value="{StaticResource ThemeColor}" />
                                </Trigger>

                                <EventTrigger RoutedEvent="ToggleButton.Checked">
                                    <BeginStoryboard x:Name="Spinner">
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="rotateTransform"
                                                             Storyboard.TargetProperty="Angle"
                                                             To="360"
                                                             RepeatBehavior="Forever"
                                                             Duration="0:0:10" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger>
                                <EventTrigger RoutedEvent="ToggleButton.MouseEnter">
                                    <PauseStoryboard BeginStoryboardName="Spinner" />
                                </EventTrigger>
                                <EventTrigger RoutedEvent="ToggleButton.MouseLeave">
                                    <ResumeStoryboard BeginStoryboardName="Spinner" />
                                </EventTrigger>
                                <EventTrigger RoutedEvent="ToggleButton.Unchecked">
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="rotateTransform"
                                                             Storyboard.TargetProperty="Angle"
                                                             To="0"
                                                             Duration="0:0:0.1" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </Window.Resources>

    <Grid>
        <Grid.RowDefinitions >
            <RowDefinition Height="36" />
            <RowDefinition />
        </Grid.RowDefinitions>

        <TextBlock Text="{Binding NowTimeText}" Margin="10 0" VerticalAlignment="Center" />

        <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
            <ToggleButton Width="32" Height="32" Style="{StaticResource MusicPlayButton}" IsChecked="{Binding RunState}" />
        </StackPanel>

        <TextBox Margin="3" Grid.Row="1" AcceptsReturn="True" TextWrapping="Wrap" 
                 VerticalScrollBarVisibility="Auto" />
    </Grid>
</Window>