image is not displaying properly

Question

So using snoop I can see that the properties are as follows

Image 1
Height = 160
ActualHeight = 160
Width = 372
ActualWidth = 299.7468...
x = 0
y = 0

image 2
Height = 50
ActualHeight = 26.6891...
Width = 50
ActualWidth = 50 
x = 20
y = 20


Image 2
Height = 50
ActualHeight = 26.6891...
Width = 50
ActualWidth = 50 
x = 60
y = 60

So my questions is how do I get the ActualHeight and ActualWidth to always be equal to the Height and Width? Also why does image one not appear to be placed at 0,0 on the canvas?

Answer 1

In order to make sure that ActualWidth and ActualHeight are equal to Width and Height (provided that they are actually set), you should set the Image's Stretch property to Fill:

<Image ... Width="50" Height="50" Stretch="Fill"/>