Button growing 8 pixels when MouseOver WPF XAML

Question

I'm dealing with a rather frustrating bug. My ultimate goal is to have an image, which glows on IsMouseOver, and can be clicked to call an event. This seems all too complicated, but the other alternative I found was creating a custom user control, which is even more excessive. This is what I've done so far:

<Style x:Key="DelButton" TargetType="Button">
        <Setter Property="Padding" Value="0" />
        <Setter Property="Background" Value="Red" />
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Image Source="/HaskList;component/Images/Del24.png" Stretch="None"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Image Source="/HaskList;component/Images/Del24h.png" Stretch="None"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>

My button is defined as:

<Button HorizontalAlignment="Right" Margin="0,28,6,0" Name="delButton" VerticalAlignment="Top" Style="{DynamicResource DelButton}" Click="delButton_Click" />

This is what's happening:

Thanks for any suggestions.

Answer 1

Alright, I found the culprit. Sort of. I started trying the usercontrol method, and when I dragged the hover images directly on the screen, they were also larger, so it had nothing to do with the control template.

I had used Photoshop to edit the colors to give them the hover glow, and saved them as png files from there. This must be a bug in one of the programs, as visual studio/WPF interpreted the Photoshopped images as larger than they actually were. I opened each png image in paint and resaved it, and it works well now.

Just for future reference.

Answer 2

i ran into this the other day too, and it might be that one of the images is a standard 96dpi, and the other was something else. I had one image that somehow was 78 dpi or something else, and thats why it was getting strange sizing.