Search code examples
uwpuwp-xamlwindows-community-toolkit

How to make a infinite cycling GridView(one row enabled)

I'm using AdaptiveGridView with OneRowEnabled import from windows community toolkit, and found NetFlix app having an interesting thing. All the category items are infinite cycle, ie, when scrolling to the last item, and then the first item comes following the last item. It's like a circle list, the last one connect with the first one.

I think the picture may be more intuitive.

The Green area is user visible. When I scroll right, the items goes left. When scroll the last item, item 100, for example, the item 1 follows to appear into the user visual area. It seems that item 100 and item 1 are always seamless connected. This is fantastic.

So how to do like this, thx.

enter image description here

Solution

  • What you need actually is a looping list control. The telerik UI for UWP has a ready-made control 'LoopingList' control. It's now open source. You could check its source code: https://github.com/telerik/UI-For-UWP/tree/master/Controls/Primitives/Primitives.UWP/LoopingList

    You could use it directly in your code.

    xmlns:telerikLoopingList="using:Telerik.UI.Xaml.Controls.Primitives.LoopingList"

<telerikLoopingList:RadLoopingList x:Name="loopingList"/>

    loopingList.ItemsSource = Enumerable.Range(0,100).ToList();