In WPF: how to disable the animation when the button after be pressed?

Question

I want no animation when button is pressed, but only the foreground and the background are changed, just like metro style. I'm so perplexed.

Edit:

I create a sample in Expression Blend 4. There are 3 states: Normal, IsMouseOver, IsPressed:

Edit 2:

I just modify the Title "In WPF: how to disable the animation when the button is pressed?" to "In WPF: how to disable the animation when the button after be pressed?"

I find some problems:

1. When the mouse is over or press the button, the backgroud of button is not changed;
2. The animation run after the button has be pressed, I just want to disable the animation.

Edit 3:

This .xaml can run in VS.

<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="WpfApplication17.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">
<Window.Resources>
    <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Foreground" Value="White"/>
                <Setter Property="BorderBrush" Value="Black"/>
                <Setter Property="Background" Value="Black"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="True">
                <Setter Property="Background" Value="Black"/>
                <Setter Property="BorderBrush" Value="Black"/>
                <Setter Property="Foreground" Value="Red"/>
            </Trigger>
        </Style.Triggers>
        <Setter Property="Background" Value="White"/>
        <Setter Property="BorderBrush" Value="White"/>
        <Setter Property="Foreground" Value="Black" />
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Padding" Value="1"/>
    </Style>

</Window.Resources>

<Grid x:Name="LayoutRoot" >
    <Button Content="Button" 
            HorizontalAlignment="Left" 
            VerticalAlignment="Top" 
            Width="75" 
            Style="{DynamicResource ButtonStyle1}"/>
</Grid>

Answer 1

Try this (create a new project and just paste it beneath your definition) :

<Window.Resources>
        <Style x:Key="NoAnimations" TargetType="{x:Type Button}" >
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="Background" Value="White"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border BorderBrush="Black" BorderThickness="1">
                            <Border Name="border" Background="{TemplateBinding Background}" Padding="3">
                                <Grid>
                                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="content" />
                                </Grid>
                            </Border>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                               <Setter Property="Background" Value="Black"></Setter>
                                <Setter Property="Foreground" Value="White"></Setter>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="False">
                                <Setter Property="Background" Value="White"></Setter>
                                <Setter Property="Foreground" Value="Black"></Setter>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" Value="Black"></Setter>
                                <Setter Property="Foreground" Value="Red"></Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <StackPanel>
        <Button Style="{StaticResource NoAnimations}"
                Content="Testing"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Margin="20"

                />
    </StackPanel>