如何滚动到UWP中的元素

如何滚动到滚动查看器中的特定位置?

        

我正在尝试滚动到我的滚动查看器中的特定元素,但我是UWP的新手,我无法完全理解如何做到这一点。

我想在事件发生时在第二个文本块中设置MyScrollView的滚动位置。

更好的解决方案是使用ChangeView而不是ScrollToVerticalOffset / ScrollToHorizontalOffset因为后者在Windows 10中已过时。

 MyScrollView.ChangeView(null, abosulatePosition.Y, null, true); 

您甚至可以通过将最后一个参数设置为false启用滚动动画。


更新

为了完成,我为此创建了一个扩展方法。

 public static void ScrollToElement(this ScrollViewer scrollViewer, UIElement element, bool isVerticalScrolling = true, bool smoothScrolling = true, float? zoomFactor = null) { var transform = element.TransformToVisual((UIElement)scrollViewer.Content); var position = transform.TransformPoint(new Point(0, 0)); if (isVerticalScrolling) { scrollViewer.ChangeView(null, position.Y, zoomFactor, !smoothScrolling); } else { scrollViewer.ChangeView(position.X, null, zoomFactor, !smoothScrolling); } } 

所以在这种情况下,只需要打电话

 this.MyScrollView.ScrollToElement(otherTb); 

我找到了答案

  var transform = otherTb.TransformToVisual(ContentsPanel); Point absolutePosition = transform.TransformPoint(new Point(0,0)); MyScrollView.ScrollToVerticalOffset(absolutePosition.Y); 

更新

在UWP中,ScrollToVerticalOffset已经过时了

  MyScrollView.ChangeView(null,absolutePosition.Y,null,true) 

应该用来代替。 https://msdn.microsoft.com/en-us/library/windows/apps/dn252763.aspx

这是实现下面描述的方法的video演示 。

我曾经使用ScrollViewerOffsetMediator ,这是一种依赖ScrollToVerticalOffset方法的扩展方法,可以平滑地动画滚动ScrollViewer内容。 但是,ScrollToVerticalOffset在Windows 10中已被弃用,尽管它在某些早期版本的Windows 10中有效,但它不再适用。

新的ChangeView方法不提供ScrollViewer内容的平滑动画或可控制动画。 所以这是我找到的解决方案:

在ScrollViewer中放置一个网格。 使用RenderTransform为网格内容设置动画。 使用新的ChangeView方法在通过转换设置网格内容动画时设置最终所需的垂直和水平ScrollViewer位置。 在网格转换中,将初始值偏移最终所需的ChangeView偏移量,以便针对由ChangeView方法引起的立即跳转更正动画开始引用。

XAML:

             

码:

 Public Sub AnimateProperty(Obj As DependencyObject, PropPath As String, StartValue As Double, EndValue As Double, Optional PeriodMS As Integer = 350) Dim Storya As New Storyboard Dim DA1 As New DoubleAnimationUsingKeyFrames With {.BeginTime = New TimeSpan(0, 0, 0)} Storyboard.SetTarget(DA1, Obj) Storyboard.SetTargetProperty(DA1, PropPath) Dim ddkf1 As New DiscreteDoubleKeyFrame With {.KeyTime = New TimeSpan(0, 0, 0), .Value = StartValue} Dim edkf1 As New EasingDoubleKeyFrame With {.Value = EndValue, .KeyTime = New TimeSpan(0, 0, 0, 0, PeriodMS)} Dim pe1 As New PowerEase With {.EasingMode = EasingMode.EaseIn} edkf1.EasingFunction = pe1 DA1.KeyFrames.Add(ddkf1) DA1.KeyFrames.Add(edkf1) Storya.Children.Add(DA1) Storya.Begin() End Sub 

例:

  AnimateProperty(MyGrid, "(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)", 1, 1.4, 350) AnimateProperty(MyGrid, "(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)", 1, 1.4, 350) AnimateProperty(MyGrid, "(UIElement.RenderTransform).(TransformGroup.Children)[1].(TranslateTransform.Y)", -MyScrollView.VerticalOffset, -120, 350) MyScrollView.ChangeView(Nothing, 0, Nothing, True) 

在此示例中,无论ScrollView的初始垂直位置是什么,内容都将平滑地动画到固定的垂直位置和缩放。