Set button background style in wpf - wpf

Question

i have one button and i set button background style with LinearGradientBrush. everything works fine but when i run button and press click on button then gradient color is showing ob button with bit of animation but i have not write anything for animation for button background style.
here is my full code
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<DockPanel>
<Button Content="Button" Height="23" Name="button1" Width="75">
<Button.Background>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
<GradientStop Color="#FFD9EDFF" Offset="0"/>
<GradientStop Color="#FFC0DEFF" Offset="0.445"/>
<GradientStop Color="#FFAFD1F8" Offset="0.53"/>
</LinearGradientBrush>
</Button.Background>
</Button>
</DockPanel>
</Window>
i want that when user click on button then gradient animation anything like will not start on button. please guide me. thanks

Answer 1

You need to redefine button style, You can do it using ControlTemplate. Here is example how to write reusable style that redefines button.
I have added also an example how to implement color change on IsPressed event.
<Window x:Class="ColorTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<ResourceDictionary>
<LinearGradientBrush x:Key="ButtonBackground" StartPoint="0,0" EndPoint="1,1">
<GradientStop Color="#FFD9EDFF" Offset="0"/>
<GradientStop Color="#FFC0DEFF" Offset="0.445"/>
<GradientStop Color="#FFAFD1F8" Offset="0.53"/>
</LinearGradientBrush>
<Style x:Key="SimpleButtonStyle" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Border Background="{StaticResource ButtonBackground}" VerticalAlignment="Stretch" CornerRadius="2" HorizontalAlignment="Stretch"/>
<Border x:Name="BorderPressed" Opacity="0" Background="Blue" VerticalAlignment="Stretch" CornerRadius="2" HorizontalAlignment="Stretch"/>
<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" x:Name="MainContent" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="BorderPressed" Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0.2"/>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="BorderPressed" Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.2"/>
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
</Window.Resources>
<DockPanel>
<Button Content="Button" Height="23" Name="button1" Width="75" Style="{StaticResource SimpleButtonStyle}"/>
</DockPanel>

Answer 2

This happens because of the buttons default style.
You need to set a new Style.
EDIT :
<Button Content="Button" Height="23" Name="button1" Width="75">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
<GradientStop Color="#FFD9EDFF" Offset="0"/>
<GradientStop Color="#FFC0DEFF" Offset="0.445"/>
<GradientStop Color="#FFAFD1F8" Offset="0.53"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding IsDefaulted}" SnapsToDevicePixels="true">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Microsoft_Windows_Themes:ButtonChrome>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Button.Style>
</Button>
If you want to have this style more than once use it as a resource:
Putting it to sets you this style for every button in your Window.xaml
Moving the style to a higher scope like App.xaml applies the style for every button in your application