WPF: Doing storyboard animation before click event

[ZeroZen]

Hey Folks

I've created a template and storyboard that applies to all buttons in my application. When you click the button, it drops to the right and down a bit, then snaps back up.

The problem is, when I handle the click in code, it executes before (or during?) the click event. The animation never happens in any case.

This is in my Application.xaml

        <Style TargetType="{x:Type Button}">
            <Style.Resources>
                <Storyboard x:Key="OnClick1">
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="{x:Null}">
                        <EasingDoubleKeyFrame KeyTime="0" Value="2"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="0"/>
                    </DoubleAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="{x:Null}">
                        <EasingDoubleKeyFrame KeyTime="0" Value="2"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="0"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </Style.Resources>
            <Style.Triggers>
                <EventTrigger RoutedEvent="ButtonBase.Click">
                    <BeginStoryboard x:Name="OnClick1_BeginStoryboard" Storyboard="{StaticResource OnClick1}"/>
                </EventTrigger>
            </Style.Triggers>
            <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
            <Setter Property="RenderTransform">
                <Setter.Value>
                    <TransformGroup>
                        <ScaleTransform/>
                        <SkewTransform/>
                        <RotateTransform/>
                        <TranslateTransform/>
                    </TransformGroup>
                </Setter.Value>
            </Setter>
            <Setter Property="SnapsToDevicePixels" Value="true"/>
            <Setter Property="OverridesDefaultStyle" Value="true"/>
            <Setter Property="MinHeight" Value="20"/>
            <Setter Property="MinWidth" Value="20"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Name="Border"  
                        CornerRadius="2" 
                        BorderThickness="0"
                        Background="{TemplateBinding Background}"
                        BorderBrush="#404040">
                            <ContentPresenter Margin="2" 
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center" 
                                      RecognizesAccessKey="True"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="Background">
                <Setter.Value>
                    <ImageBrush Stretch="None"/>
                </Setter.Value>
            </Setter>
        </Style>

And this is in my MainServices.xaml.vb

    Private Sub Button_New_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button_New.Click
        kioskConfirmIdentity.ShowMe(kioskNew_Scan)
        Me.Hide()
    End Sub

If I put nothing in my codebehind it works just fine, but if the Click event is fired the animation doesn't happen.

[ZeroZen]

I've been wrestling with this for about 3 weeks.
I post on here and I solve it by myself in a few minutes.

I should post here more often. This always happens!!!

THE SOLUTION:

<EventTrigger RoutedEvent="ButtonBase.Click">

Change to:
<EventTrigger RoutedEvent="ButtonBase.PreviewMouseLeftButtonDown">