Windows 8 Store App中的XAML对齐方式

Question

一点也不熟悉XAML，我试图设计一个非常简单的布局，主页由两部分组成：

1. 在左侧，我想要一个可以缩放以适合可用高度但保持其宽高比的图像。
2. 在右边，我想要一个最终包含文本和控件的面板 - 目前我只有文字。

我可以使用ViewBox让图像表现良好，但我似乎无法在屏幕的右侧填充剩余的间隙。见截图：



我想要的是包含文本的区域向右伸展，文本居中于其中。

相关的XAML代码是：

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
  <StackPanel Orientation="Horizontal">
    <Viewbox HorizontalAlignment="Right">
      <Image Source="Assets/ABCImage.png"></Image>
    </Viewbox>
    <StackPanel Orientation="Vertical">
      <TextBlock Text="ABC Viewer"
                 TextAlignment="Center"
                 FontSize="48"></TextBlock>
      <TextBlock Text="Test application"
                 TextAlignment="Center"
                 FontSize="24"></TextBlock>
    </StackPanel>
  </StackPanel>
</Grid>

这让我花了很长时间才弄明白。有人可以把我从痛苦中解救出来吗？

Answer 1

试试这个：

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="*" />
  </Grid.ColumnDefinitions>
  <Viewbox Grid.Column="0"
           HorizontalAlignment="Right">
    <Image Source="Assets/ABCImage.png"></Image>
  </Viewbox>
  <StackPanel Grid.Column="1">
    <TextBlock Text="SEM Viewer"
               TextAlignment="Center"
               FontSize="48" />
    <TextBlock Text="Test application"
               TextAlignment="Center"
               FontSize="24" />
  </StackPanel>
</Grid>