Skip to main content

Scroll

A gesture recognizer that tracks a scrolling gesture for panning content. ScrollGestureRecognizer detects when a pointer drags inside a control's bounds and translates the movement into scroll deltas, with support for inertia (the content continues scrolling after the pointer is released and gradually decelerates). It supports horizontal scrolling, vertical scrolling, or both simultaneously.

Use ScrollGestureRecognizer when a control needs to pan its content freely in one or more directions. For a deliberate, single-direction edge-to-edge drag (such as pull-to-refresh), use PullGestureRecognizer instead.

Vertical

Horizontal

Using a ScrollGestureRecognizer​

A ScrollGestureRecognizer can be attached to a control using the control's GestureRecognizers property.

<Image Stretch="UniformToFill"
        Margin="5"
        Name="image"
        Source="/image.jpg">
  <Image.GestureRecognizers>
    <ScrollGestureRecognizer CanHorizontallyScroll="True"
                              CanVerticallyScroll="True"/>
  </Image.GestureRecognizers>
</Image>
C#
image.GestureRecognizers.Add(new ScrollGestureRecognizer()
{
    CanVerticallyScroll = true,
    CanHorizontallyScroll = true,
});

The ScrollGestureRecognizer raises a InputElement.ScrollGestureEvent when it detects the start of a scroll gesture. When the scroll ends, from the pointer being released or another gesture start, it raises a InputElement.ScrollGestureEndedEvent.

Binding events​

After the ScrollGestureRecognizer has been added to your control, you need to bind them in your code behind either through an inline handler or to an event function:

C#
image.AddHandler(InputElement.ScrollGestureEvent, (s, e) => { });
image.AddHandler(InputElement.ScrollGestureEndedEvent, (s, e) => { });
C#
image.AddHandler(InputElement.ScrollGestureEvent, Image_ScrollGesture);
image.AddHandler(InputElement.ScrollGestureEndedEvent, Image_ScrollGestureEnded);
...
private void Image_ScrollGesture(object? sender, ScrollGestureEventArgs e) { }
private void Image_ScrollGestureEnded(object? sender, ScrollGestureEndedEventArgs e) { }

If your event handles the gesture completely, you can mark the event as handled by setting:

C#
e.Handled = true;

Useful properties​

You will probably use these properties most often:

PropertyDescription
CanVerticallyScrollDefines whether the content can be scrolled vertically.
CanHorizontallyScrollDefines whether the content can be scrolled horizontally.

More information​

info

For the complete API documentation about this gesture recognizer, see the ScrollGestureRecognizer API reference.

info

View the source code on GitHub ScrollGestureRecognizer.cs

See also​

On this page