ScrollViewer内部具有拉伸垂直对齐的图像？

Question

当我在容器（例如HubSection）内部有VerticalAlignment="Stretch"的图像时，图像在我的页面中从上到下完美展开。即：

<HubSection>
  <DataTemplate>
      <Image
        Loaded="BigPic_Loaded"
        ImageFailed="BigPic_ImageFailed"
        x:Name="BigPic"
        Source="http://i.imgur.com/hd4tFk0.jpg"
        VerticalAlignment="Stretch" />
  </DataTemplate>
</HubSection>

然后，我希望能够放大图像，为此我在图像周围添加了一个ScrollViewer。然后，VerticalAlignment='Stretch'不能正常工作，图像的高度不再与页面的高度相匹配。即：

<HubSection>
  <DataTemplate>
    <ScrollViewer
      ZoomMode="Enabled"
      HorizontalScrollMode="Auto"
      HorizontalScrollBarVisibility="Auto"
      VerticalScrollMode="Auto"
      VerticalScrollBarVisibility="Auto"
      VerticalContentAlignment="Stretch"
      MinZoomFactor="1"
      MaxZoomFactor="4">
      <Image
        Loaded="BigPic_Loaded"
        ImageFailed="BigPic_ImageFailed"
        x:Name="BigPic"
        Source="http://i.imgur.com/hd4tFk0.jpg"
        VerticalAlignment="Stretch" />
    </ScrollViewer>
  </DataTemplate>
</HubSection>

这个问题有什么问题吗？

Answer 1

修复方法是处理SizeChanged的{​​{1}}事件，并将BigPic的大小设置为ScrollViewer的大小。