title: XAML alignment in Windows 8 Store App
body: <p>Not being at all familiar with XAML, I'm trying to get a very simple layout designed where the main page consists of two parts:</p>
  
  <ol>
  <li>On the left, I want an image that will scale to fit the available height but maintain its aspect ratio.</li>
  <li>On the right, I want a panel that will eventually contain text and controls - at the moment I just have text.</li>
  </ol>
  
  <p>I can get the image to behave ok by using a <code>ViewBox</code> but I can't seem to get the right side of the screen to fill the remaining gap. See screenshot:</p>
  
  <p><img src="https://i.stack.imgur.com/S4LhH.jpg" alt="Screenshot showing alignment error"></p>
  
  <p>What I want is for the area that contains the text to stretch to the right with the text centred within it.</p>
  
  <p>The relevant XAML code is:</p>
  
  <pre><code>&lt;Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"&gt;
    &lt;StackPanel Orientation="Horizontal"&gt;
      &lt;Viewbox HorizontalAlignment="Right"&gt;
        &lt;Image Source="Assets/ABCImage.png"&gt;&lt;/Image&gt;
      &lt;/Viewbox&gt;
      &lt;StackPanel Orientation="Vertical"&gt;
        &lt;TextBlock Text="ABC Viewer"
                   TextAlignment="Center"
                   FontSize="48"&gt;&lt;/TextBlock&gt;
        &lt;TextBlock Text="Test application"
                   TextAlignment="Center"
                   FontSize="24"&gt;&lt;/TextBlock&gt;
      &lt;/StackPanel&gt;
    &lt;/StackPanel&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p>This is taking me far too long to figure out. Can someone please put me out of my misery?</p>