title: Draw a connection line between two elements in pure XAML
body: <p>I'm very very new to WPF and XAML.
  I've two <code>Image</code> elements placed on a 4x4 <code>Grid</code> (say <code>x:Name='LHImage'</code> <code>x:Name='RHImage</code>) and and I would like to connect them with a line.</p>
  
  <p>Something like this:</p>
  
  <pre><code>&lt;Line
      X1="{Binding ElementName=LHImage, Path=RenderedBoundingRect.Right}"
      Y1="{Binding ElementName=LHImage, Path=RenderedBoundingRect.Middle}"
      X2="{Binding ElementName=RHImage, Path=RenderedBoundingRect.Left}"
      Y2="{Binding ElementName=RHImage, Path=RenderedBoundingRect.Middle}"
      Stroke="Gray"
      StrokeThickness="5" Grid.ColumnSpan="4" Grid.RowSpan="4"/&gt;
  </code></pre>
  
  <p>Of course <code>RenderedBoundingRect</code> and its <code>Left</code> <code>Right</code> <code>Middle</code> properties don't exist and should be replaced by some other expression that it's just what I'm looking for.
  Is that possible in pure XAML (no C# side code)?</p>
  
  <p><strong>EDIT:</strong>
  As requested here is a screenshot of the desired result:</p>
  
  <p><a href="https://i.stack.imgur.com/bEqNz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/bEqNz.png" alt="enter image description here"></a></p>