XAML 使图像适合 ScrollViewer 内的页面大小

Question

我在 ScrollViewer 中有一个 Image。一些图像太大，无法放入 Page。如何让 Image 在首次显示时缩小到 Page 大小？

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
    <Image Stretch="None" />
</ScrollViewer>

更新的答案

这是我根据 Filip 在这里的回答和另一个他对类似问题的回答 here 所做的

XAML:

<ScrollViewer x:Name="scrollViewer">
    <Image x:Name="image" Stretch="None" SizeChanged="ImageSizeChanged" />
</ScrollViewer>

代码隐藏:

private bool imageSizeSet;
private void ImageSizeChanged( object sender, SizeChangedEventArgs e )
{
    if( imageSizeSet || !( image.ActualWidth > scrollViewer.ViewportWidth ) && !( image.ActualHeight > scrollViewer.ViewportHeight ) )
    {
        return;
    }

    // If the image is larger than the screen, zoom it out.
    var zoomFactor = (float)Math.Min( scrollViewer.ViewportWidth / image.ActualWidth, scrollViewer.ViewportHeight / image.ActualHeight );
    scrollViewer.ZoomToFactor( zoomFactor );
    imageSizeSet = true;
}

Answer 1

<ScrollViewer
    x:Name="theScrollViewer"
    HorizontalScrollBarVisibility="Auto"
    VerticalScrollBarVisibility="Auto"
    SizeChanged="OnSizeChanged">
    <Image
        x:Name="theImage"
        Stretch="Uniform" />
</ScrollViewer>

private void OnSizeChanged(object sender, SizeChangedEventArgs args)
{
    theImage.Width = theScrollViewer.ViewportWidth;
    theImage.Height = theScrollViewer.ViewportHeight;
}