UWP: RadListView - Scroll list with UP - DOWN arrow key

[Paresh]

I am using RadListView with Xamarin Forms 3.2.0.

I want to scroll list view's individual item using up and down arrow key. How can I enable this behavior?

Thanks

 

[Lance | Senior Manager Technical Support]

Hello Paresh,

The RadListView does have an API that lets you programmatically scroll to items, however the native platform Keyboard events will be up to you to subscribe to.

You could use a Custom Renderer or Platform Effect in order to get to the Keyboard events. I think a Xamarin.Forms Effect would be best for this, you could implement some custom events in your Platform Effect and then trigger the Xamarin.Forms.

If you've never written a Platform Effect before, you can learn by following the tutorial series in the Microsoft Documentation: Xamarin.Forms Introduction to Effects.

If you've never written code for events or event handlers before, I have written a blog post that shows how to do this. It's not the same as what you're trying to do here, but the concepts are the same and can be applied here.

Here's the concept's life-cycle:

1. Subscribe to UWP's keyboard events
2. when the up key or down key is pressed, invoke your Effect's custom event.
3. In the event handlers, programmatically scroll the RadListView

public void MyCustomEventHandler
{
    MyRadListView.ScrollItemIntoView(itemYouWantToScrollTo);
}

We do not have any demos you can use for reference as this is custom development unrelated to the Telerik Controls. If you get stuck, you can post to StackOverflow or Xamarin Forums and request help for "How to Subscribe to UWP Keyboard Event in Platform Effect".

I hope this information was helpful.

Regards,
Lance | Technical Support Engineer, Principal
Progress Telerik

[Paresh]

Thanks for giving direction.

So,How exactly MyRadListView.ScrollItemIntoView works? Does it scroll to specific item we are passing in? What I am looking for is user scrolls through list using keyboard up and down key, rather than mouse scroll button. 

 

Thanks

 

 

[Paresh]

Also in UWP app, if user does not  have mouse and using laptop trackpad there is no way to scroll. Can we show scroll bar explicitly which can be used to scroll in that case. 

[Lance | Senior Manager Technical Support]

Hi Paresh,

Let me answer your first question: You pass the actual data item to scroll to, it's not an X/Y offset. We internally calculate that because there is UI virtualization in operation (only a certain number of items are realized at any given time).

Onto you question about scrolling gesture. If the user is only using trackpad, they would use a two-finger gesture to scroll. 

That being said, in UWP you can set ScrollViewer properties to always show the scrollbar. This isn't a Telerik API, so you'll need to gain access to the native UWP RadListView and set the ScrollViewer properties.

To make this easier, you can use the UWP Toolkit's Visual Tree Extensions (search NuGet for Microsoft.Toolkit.Uwp.UI) and find the ScrollViewer child and set the scrollbar mode.

For example, in the Effect, get a reference to the native RadListView and do the following:

ScrollViewer sv = myUwpRadListView.FindDescendant<ScrollViewer>();
sv.VerticalScrollBarVisibility = ScrollBarVisibility.Visible;

For more information on using the toolkit, you can find the root documentation here.


Regards,
Lance | Technical Support Engineer, Principal
Progress Telerik