How to detect if the scroll viewer reaches bottom in winrt

Question

I'm wondering what's the best approach to detect if a ScrollViewer reaches the bottom, right etc.

I think I can achieve that by using both PointerWheelChanged for mouse and ManipulationDelta for touch. In these event handlers, I can record the HorizontalOffset to find out when will the scroller reach the end. But I think there could be a better way to do it.

I've found this article. But the compression visual states seem not working in winrt. The CurrentStateChanging event method is not getting called.

I also checked another article. But it just works for scroll bar, not a generic approach.

Anyone knows what's the best way to solve this problem?

Answer 1

XAML:

<ScrollViewer
    x:Name="sv"
    ViewChanged="OnScrollViewerViewChanged">
    <Rectangle
        x:Name="rect"
        Width="2000"
        Height="2000"
        Fill="Yellow"
        Margin="10" />
</ScrollViewer>

Code behind:

private void OnScrollViewerViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
{
    var verticalOffset = sv.VerticalOffset;
    var maxVerticalOffset = sv.ScrollableHeight; //sv.ExtentHeight - sv.ViewportHeight;

    if (maxVerticalOffset < 0 ||
        verticalOffset == maxVerticalOffset)
    {
        // Scrolled to bottom
        rect.Fill = new SolidColorBrush(Colors.Red);
    }
    else
    {
        // Not scrolled to bottom
        rect.Fill = new SolidColorBrush(Colors.Yellow);
    }
}

Answer 2

For UWP I got it like this

<ScrollViewer Name="scroll" ViewChanged="scroll_ViewChanged">
    <ListView />
</ScrollViewer>

private void scroll_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
{
    var scrollViewer = (ScrollViewer)sender;
    if (scrollViewer.VerticalOffset == scrollViewer.ScrollableHeight)
        btnNewUpdates.Visibility = Visibility.Visible;
}

private void btnNewUpdates_Click(object sender, RoutedEventArgs e)
{
    itemGridView.ScrollIntoView(itemGridView.Items[0]);
    btnNewUpdates.Visibility = Visibility.Collapsed;
}