[Feature] StaggeredLayout based on ItemsRepeater

[DL444]

Describe the problem this feature would solve

The current StaggeredPanel in this toolkit is based on Panel class, which doesn't offer UI virtualization. Memory consumption can go very high when a large amount of items are loaded.

Describe the solution

We could enable UI virtualization if we build a StaggeredLayout based on ItemsRepeater. This new control could have the same API as the existing StaggeredPanel.

Additional context & Screenshots

I've already built a prototype in-house. It still needs some polishing, but I hope to get it ready in the WinUI 3.0 timeframe. This should be in-line with 7.0 release plan #3062.

[ghost]

Thanks for submitting a new feature request! I've automatically added a vote 👍 reaction to help get things started. Other community members can vote to help us prioritize this feature in the future!

[michael-hawker]

@DL444 @JustinXinLiu mentioned you had interest in working on this feature. Let us know. I know @skendrot had interest in this as well, so feel free to coordinate.

[skendrot]

@DL444 I'm currently in the process of converting all of the panels within the toolkit (WrapPanel and StaggeredPanel currently) to use the ItemsRepeater.
I took a look at your repo and it's looking good, however there are rendering issues. In the picture below the left side is my current StaggeredLayout control and the right is yours. You can see how the items are not rendering properly on the right hand side

It's not all roses on my side. This ItemsRepeater is taking some time learning how to work with it and there's no information out there except for the core **Layout source

[DL444]

@skendrot I see. This is what I mean by "polishing". That code wasn't really tested for all situations.
By the way, how could I reproduce that issue? It seems that one change is the width of the rectangles.

[skendrot]

@DL444 I just added a bunch of random items

for (int i = 0; i < random.Next(500, 5000); i++)
{
    Item item = new Item { Index = i, Width = random.Next(75, 250), Height = random.Next(75, 250), Color = Color.FromArgb(255, (byte)random.Next(0, 255), (byte)random.Next(0, 255), (byte)random.Next(0, 255)) };
    _items.Add(item);
}

[michael-hawker]

Thanks @skendrot for the updates! 🦙❤

I created a 7.0 branch. We should pull all the layout panels into their own package as a first step so we don't pull the WinUI dependency in for all the controls yet. Let me know if you need a hand creating the new project structure or not.