从WPF按钮中的代码隐藏控制动画?

从WPF按钮中的代码隐藏控制动画?,wpf,animation,button,code-behind,Wpf,Animation,Button,Code Behind,我的按钮有以下XAML样式: <Style TargetType="{x:Type Button}"> <Setter Property="VerticalContentAlignment" Value="Center" /> <Setter Property="FontFamily" Value="Calibri" /> <Setter Property="Foreground" Value="White" />

我的按钮有以下XAML样式:

    <Style TargetType="{x:Type Button}">
    <Setter Property="VerticalContentAlignment" Value="Center" />
    <Setter Property="FontFamily" Value="Calibri" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border x:Name="BtnBorder" Width="{TemplateBinding ActualWidth}" Height="{TemplateBinding ActualHeight}" CornerRadius="5" VerticalAlignment="Center" BorderBrush="White" BorderThickness="0" ClipToBounds="True" HorizontalAlignment="Center">
                    <Grid Width="{Binding ElementName=BtnBorder, Path=ActualWidth}">        
                        <Rectangle Name="BtnRect" RadiusX="6" RadiusY="5" Opacity="0.2" Fill="White" />
                        <Rectangle x:Name="progressIndicator" Width="0" HorizontalAlignment="Left" RadiusX="8" RadiusY="8" Margin="1">
                            <Rectangle.Fill>
                                <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
                                    <GradientStop Color="Transparent" Offset="0" />
                                    <GradientStop Color="#88FFFFFF" Offset="0.945" />
                                    <GradientStop Color="White" Offset="1" />
                                </LinearGradientBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" x:Name="BtnCP" />
                      </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="Mouse.MouseEnter">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BtnRect" Storyboard.TargetProperty="Opacity" From="0.25" To="0.5" Duration="0:0:0.2" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Mouse.MouseLeave">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BtnRect" Storyboard.TargetProperty="Opacity" From="0.5" To="0.25" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="BtnBorder" Property="BorderThickness" Value="1.3" />
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="progressIndicator" Storyboard.TargetProperty="Width" From="0" To="300" Duration="0:0:5" AutoReverse="True" RepeatBehavior="5x" />
                                </Storyboard>
                             </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter TargetName="BtnBorder" Property="BorderThickness" Value="1.5,0,1.5,0" />
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsFocused" Value="True" />
                            <Condition Property="IsPressed" Value="True" />
                        </MultiTrigger.Conditions>
                        <Setter TargetName="BtnBorder" Property="BorderThickness" Value="1.3" />
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

如何在单击按钮时通过代码隐藏控制按钮矩形属性的动画。
当用户单击按钮时,名为“progressIndicator”的矩形将通过动画增加宽度。

当前动画以Xaml开始。为什么要在代码隐藏中使用它?

实际上,我需要一个后台进程来决定按钮上动画的持续时间。因此,动画从用户单击按钮开始,经过一定的验证后,在后台处理完成时结束。
    <Style TargetType="{x:Type Button}">
    <Setter Property="VerticalContentAlignment" Value="Center" />
    <Setter Property="FontFamily" Value="Calibri" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border x:Name="BtnBorder" Width="{TemplateBinding ActualWidth}" Height="{TemplateBinding ActualHeight}" CornerRadius="5" VerticalAlignment="Center" BorderBrush="White" BorderThickness="0" ClipToBounds="True" HorizontalAlignment="Center">
                    <Grid Width="{Binding ElementName=BtnBorder, Path=ActualWidth}">        
                        <Rectangle Name="BtnRect" RadiusX="6" RadiusY="5" Opacity="0.2" Fill="White" />
                        <Rectangle x:Name="progressIndicator" Width="0" HorizontalAlignment="Left" RadiusX="8" RadiusY="8" Margin="1">
                            <Rectangle.Fill>
                                <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
                                    <GradientStop Color="Transparent" Offset="0" />
                                    <GradientStop Color="#88FFFFFF" Offset="0.945" />
                                    <GradientStop Color="White" Offset="1" />
                                </LinearGradientBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" x:Name="BtnCP" />
                      </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="Mouse.MouseEnter">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BtnRect" Storyboard.TargetProperty="Opacity" From="0.25" To="0.5" Duration="0:0:0.2" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Mouse.MouseLeave">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BtnRect" Storyboard.TargetProperty="Opacity" From="0.5" To="0.25" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="BtnBorder" Property="BorderThickness" Value="1.3" />
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="progressIndicator" Storyboard.TargetProperty="Width" From="0" To="300" Duration="0:0:5" AutoReverse="True" RepeatBehavior="5x" />
                                </Storyboard>
                             </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter TargetName="BtnBorder" Property="BorderThickness" Value="1.5,0,1.5,0" />
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsFocused" Value="True" />
                            <Condition Property="IsPressed" Value="True" />
                        </MultiTrigger.Conditions>
                        <Setter TargetName="BtnBorder" Property="BorderThickness" Value="1.3" />
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>