How to programatically scroll a ScrollViewer to the top in uwp xaml? - xaml

Question

I have applied ScrollViewer to a user control which automatically scrolls to the bottom if height exceeds.
Now my page is closing having the scrollbar at the bottom position and it remains at the bottom when I reopen the page.
How can I reset the scrollbar to the top every time I open that page.
<ScrollViewer x:Name="myScrollViewer">
<Grid Margin="0,0,0,40">
</Grid>
</ScrollViewer>

Answer 1

ScrollViewer provides the ChangeView method, which can be used to adjust the scrolling state:
// scroll to top
myScrollViewer.ChangeView(0, 0, 1);
You can call this method after the page is loaded to scroll the ScrollViewer to the top.
Update
If you want to access the control on the page in the ViewModel, there are two ways:
1. Public control
This method means that you need to create a public page instance, and then expose the control in XAML, as shown below:
ScrollViewerPage.xaml
<ScrollViewer x:Name="myScrollViewer" x:FieldModifier="public">
<!-- your code -->
</ScrollViewer>
ScrollViewerPage.xaml.cs
public sealed partial class ScrollViewerPage : Page
{
public static ScrollViewerPage Current;
public ScrollViewerPage()
{
this.InitializeComponent();
Current = this;
}
}
After the page is loaded, you can use this code to access the ScrollViewer.
ScrollViewerPage.Current.myScrollViewer.ChangeView(0, 0, 1);
2. Define control variable/property in ViewModel
You can define a variable or property (public) of type ScrollViewer in the ViewModel, and then assign a value to the property when the page loads, and then you can access the ScrollViewer by accessing the property in the ViewModel.
MyViewModel.cs
public class MyViewModel
{
public ScrollViewer MyScrollViewer { get; set; }
// Other code
}
ScrollViewerPage.xaml.cs
public ScrollViewerPage()
{
this.InitializeComponent();
var vm = new MyViewModel();
vm.MyScrollViewer = myScrollViewer;
}