Windows Phone 8.1 中 ScrollViewer 中的图像

Question

我有一个 FlipView，它在用户滑动时显示传单的页面。我希望用户能够放大页面。 到目前为止，我发现如果我将 Image 包装在 ScrollViewer 中并设置 ZoomMode = Enabled，则用户可以进行缩放。奇怪的是，如果我放大页面的右侧，当我从屏幕上抬起手指后，它会自动回到左侧。知道如何解决这个问题吗？

XAML：

<Grid Name="grRoot">
    <FlipView x:Name="flipView1"
              BorderBrush="Black"
              ItemsSource="{Binding}">

        <FlipView.ItemTemplate>
            <DataTemplate>
                <ScrollViewer ZoomMode="Enabled" MinZoomFactor="1">
                    <Image Source="{Binding url_dotcom}"
                           Stretch="Fill" 
                           Holding="imgHolding"/>
                </ScrollViewer>
            </DataTemplate>
        </FlipView.ItemTemplate>
    </FlipView>
</Grid>

设置 FlipView 的宽高：

flipView1.Width = Window.Current.Bounds.Width;
flipView1.Height = Window.Current.Bounds.Height;

Answer 1

试试这样的：

<Grid Name="grRoot">
    <FlipView x:Name="flipView1"
              BorderBrush="Black"
              ItemsSource="{Binding}">

        <FlipView.ItemTemplate>
            <DataTemplate>
                <ScrollViewer ZoomMode="Enabled" MinZoomFactor="1"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <Image Source="{Binding url_dotcom}"
                           Stretch="Fill" 
                           Holding="imgHolding"
                           MaxWidth="{Binding ElementName=YourPage, Path=DataContext.Width}"
                           MaxHeight="{Binding ElementName=YourPage, Path=DataContext.Height}"/>
                </ScrollViewer>
            </DataTemplate>
        </FlipView.ItemTemplate>
    </FlipView>
</Grid>

这里有两个重要的变化：

• 将 ScrollViewer 的 Horizo​​ntalScrollBarVisibility 和 VerticalScrollBarVisibility 设置为 Auto
• 将图像的 MaxWidth 和 MaxHeight 绑定到 Window.Current.Bounds.Width 和 Window.Current.Bounds.Height 分别通过 ViewModel 中的 Width 和 Height 公共属性公开，该 ViewModel 是该特定页面的 DataContext。这适用于 FlipView 占据整个页面的情况。如果您需要在页面上缩小 FlipView，请根据您期望/需要/想要的大小在 ViewModel 中设置 Width 和 Height 属性。

编辑： 更多信息在我的博文Why is my zoomable ScrollViewer snapping the image to the left?