在 XAML 中禁用快照 points/bounce 回到 ScrollViewer
Disabling snap points/bounce back on ScrollViewer in XAML
我在 ScrollViewer 中有一个带有图像的网格。用户需要能够放大和缩小图像。问题是当我缩放滚动查看器时,它似乎快速回到图像的左侧,尽管我希望查看器保持在缩放位置。 XAML 代码如下所示
<ScrollViewer Name="ScrollViewer" HorizontalSnapPointsType="None" VerticalSnapPointsType="None" ZoomSnapPointsType="None">
<Grid x:Name="RenderedGrid" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Image x:Name="RenderedImage" Stretch="Fill" />
<canvas:CanvasControl Name="DrawingCanvas" Draw="CanvasControl_Draw" ClearColor="Transparent"/>
</Grid>
</ScrollViewer>
我认为将 SnapPointType 设置为 "None" 就足够了,但这似乎不起作用。
我写了一篇博客 post 正是关于这个问题:Why is my zoomable ScrollViewer snapping the image to the left?
问题的第一部分是 ScrollViewer 本身,它需要 HorizontalScrollBarVisibility
和 VerticalScrollBarVisibility
设置为自动。
<ScrollViewer ZoomMode="Enabled"
MinZoomFactor="1"
MaxZoomFactor="4"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto">
要使其真正起作用,您需要将图像大小限制为 width/height,如下所示:
<Image Source="{Binding ImageUri}"
MaxWidth="{Binding DataContext.PageWidth, ElementName=MyPage}"
MaxHeight="{Binding DataContext.PageHeight, ElementName=MyPage}"/>
您可以在我的博客 post 中找到更多详细信息,并在 GitHub 上找到完整的源代码。
我在 ScrollViewer 中有一个带有图像的网格。用户需要能够放大和缩小图像。问题是当我缩放滚动查看器时,它似乎快速回到图像的左侧,尽管我希望查看器保持在缩放位置。 XAML 代码如下所示
<ScrollViewer Name="ScrollViewer" HorizontalSnapPointsType="None" VerticalSnapPointsType="None" ZoomSnapPointsType="None">
<Grid x:Name="RenderedGrid" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Image x:Name="RenderedImage" Stretch="Fill" />
<canvas:CanvasControl Name="DrawingCanvas" Draw="CanvasControl_Draw" ClearColor="Transparent"/>
</Grid>
</ScrollViewer>
我认为将 SnapPointType 设置为 "None" 就足够了,但这似乎不起作用。
我写了一篇博客 post 正是关于这个问题:Why is my zoomable ScrollViewer snapping the image to the left?
问题的第一部分是 ScrollViewer 本身,它需要 HorizontalScrollBarVisibility
和 VerticalScrollBarVisibility
设置为自动。
<ScrollViewer ZoomMode="Enabled"
MinZoomFactor="1"
MaxZoomFactor="4"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto">
要使其真正起作用,您需要将图像大小限制为 width/height,如下所示:
<Image Source="{Binding ImageUri}"
MaxWidth="{Binding DataContext.PageWidth, ElementName=MyPage}"
MaxHeight="{Binding DataContext.PageHeight, ElementName=MyPage}"/>
您可以在我的博客 post 中找到更多详细信息,并在 GitHub 上找到完整的源代码。