How to Make Scrollable Areas "pan with Touch or Mouse Drag"?

[najak3d]

On Mobile devices, it is expected that dragging the screen content scrolls the view (and even has momentum, allowing you to flick-throw the content, which continues and decelerates after the flick).

Is this type of behavior already planned for this year as a "base behavior option" of Avalonia? Or will we need to make some sort of Custom Behavior to make it work like this?

[kekekeks]

ScrollViewer enables touch-based scrolling out of the box. You can enable it for custom controls by adding ScrollGestureRecognizer like this:

Avalonia/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml

Lines 39 to 43 in fed6363

	<ScrollContentPresenter.GestureRecognizers>
	<ScrollGestureRecognizer
	CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
	CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
	</ScrollContentPresenter.GestureRecognizers>

[najak3d]

That's Perfect, thanks! Avalonia wins the day again. (and again, and again!)

[nettlep]

Can you confirm if this should also work on Desktop applications? I'm building for Raspberry Pi with a touchscreen (no keyboard or mouse) and find the mouse drag does not work. For my case, I must touch the scrollbar, wait for it to expand, then drag the scrollbar. This makes for a rather quirky and awkward user experience.

[thevortexcloud]

Some of the gestures are touch only (meaning they will work on a desktop, as long as it has a touch screen). Still not clear why. Not sure if the scroll one is one of those though.

#17493

[nettlep]

I may not have been clear. I'm using a touchscreen and the touch gestures are not working. I'm wondering if it is because it is a desktop application (runs on raspberry pi using the classic desktop lifetime.)

In my case, it is a standalone device with a touchscreen as the only IO device (no keyboard or mouse.)

[marcussacana]

Just a note to anyone reading this too.
I created a ScrollViewner with buttons inside, and the button does not allow the propagation of the touch event, I managed to solve it by making a new class to extends the button

public class TapScrollableButton : Button, IStyleable
{
    Type IStyleable.StyleKey => typeof(Button);
    protected override void OnPointerPressed(PointerPressedEventArgs e)
    {
        base.OnPointerPressed(e);

        //Allow ScrollViewer handle touch scroll 
        e.Handled = false;
    }
}

If anyone knows better implementation for my case, just tell me, I'm still new to avalonia.