Blue mouse over effect on button in Blend / WPF

Question

I just started getting used to WPF using Blend for Visual Studio. I created previous programs with the standart Windows Forms and now want to get to something more modern. But I already encountered a main problem after like 5 Minutes. I added a button with an background image with a transperancy. That worked like a charm, but the problem is that, when I run the application, the button always gets blue when the Mouse hovers it. I do not want this blue effect but can't find the option to disable it in Blend. Hope someone can help me with this stupid question, Windows Forms was a little

Solution

What you're describing is the default state behavior for the button. You would have to create a custom template or style to change it. Example:

<Button Content="Button">
    <Button.Style>
        <Style TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Black"/>
                    <Setter Property="Foreground" Value="White"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

I am demonstrating two properties changes here: Background & Foreground. You may have as many as you want and change them to whatever value you wish. If you don't want any changes, simply remove Style.Triggers or a particular property within it.

Here's a demo for you, since you're new:

Here's the Resource Dictionary way:

Create a Resource Dictionary and add a style to it:

<Style x:Key="CustomButtonStyle" TargetType="Button">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="Black"/>
            <Setter Property="Foreground" Value="White"/>
        </Trigger>
    </Style.Triggers>
</Style>

Place this in your App.xaml or wherever you merge your resource dictionaries:

<ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="ButtonStyles.xaml"/>
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

Then simply specify the style for your button:

Style="{StaticResource CustomButtonStyle}"