2

我正在创建一个 Windows 商店应用程序,并且在一个页面上,我在 ScrollViewer 中放置了一个大图像,以使用户能够使用触摸手势来平移和缩放图像。到目前为止,一切都很好,除了一件事。我想对其进行调整,以便有一个用于平移的“缓冲区”,以便用户可以“过度平移”到最多一半图像不在屏幕上的程度,无论 ZoomFactor 或用户缩放了多少进或出。

我的问题是,我将如何实施这个?有人建议用透明的 uielements 填充图像的顶部、左侧、底部、右侧,但我不认为静态大小的插入 uielements 将能够实现“最多一半的图像离开屏幕”的要求。

有任何想法吗?提前谢谢你的帮助。

编辑:每个请求添加代码

<Grid x:Name="LayoutRoot" Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <ScrollViewer x:Name="ImageViewer" Background="White" ZoomMode="Enabled" 
                  IsVerticalRailEnabled="False" IsHorizontalRailEnabled="False" 
                  VerticalScrollMode="Enabled" HorizontalScrollMode="Enabled" 
                  VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" 
                  MinZoomFactor=".22" MaxZoomFactor="2"
                  VerticalContentAlignment="Center" HorizontalContentAlignment="Center">
            <Image x:Name="map" Source="map.png" ImageOpened="map_Loaded_1"/>

    </ScrollViewer>
</Grid>

这是事件背后的代码

    const float _defaultZoomFactor = 0.23F;
    private void map_Loaded_1(object sender, RoutedEventArgs e)
    {
        ImageViewer.ZoomToFactor(_defaultZoomFactor);
    }
4

1 回答 1

0

您可以为图像 UI 元素添加动态边距,该边距是根据Loaded事件上的图像大小计算得出的,与ImageOpened.

Xaml 方面:

<Image x:Name="map" Source="map.png" ImageOpened="map_Loaded_1" Loaded="OnImageElementLoaded"/>

和代码方面(样机):

private void OnImageUILoaded( object sender , RoutedEventArgs e)
{
  //Get image size
  //Calculate margin size
  //Set (Image)sender's new margin
}
于 2013-08-19T14:39:16.407 回答