title: WPF Move image with arrow keys
body: <p>Hello i am trying to make a snake game, but instead of using a shape i want to use an image for the head and some other image for the rest of the body.
  I am new to WPF and all the tutorials i found only use shapes.
  What i want to be able to do at this point is move my image by using the arrow keys and eventually after i get that working  detect collision with other images on the board.
  This is my mainwindow xaml code. It consists of a simple image(DogeIcon) that i want to move as explained above and another image(cat) that is an obstacle.</p>
  
  <pre><code>&lt;Window x:Class="DogeSNake.MainWindow"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:local="clr-namespace:DogeSNake"
      mc:Ignorable="d"
      Title="MainWindow" Height="350" Width="525"&gt;
  &lt;Grid&gt;
      &lt;Image Name="DogeIcon" HorizontalAlignment="Left" Height="64" Margin="33,27,0,0" VerticalAlignment="Top" Width="64" Source="media/doge.png" MouseEnter="RectangleMouseEnter" /&gt;
      &lt;Image Name="CatIcon" HorizontalAlignment="Left" Height="40" Margin="445,247,0,0" VerticalAlignment="Top" Width="40" Source="media/cat.png" /&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p></p>