BindableLayout for FlexLayout?

[lochidev]

` <FlexLayout Wrap="FlexWrap.Wrap" AlignContent="FlexAlignContent.SpaceEvenly" JustifyContent="FlexJustify.SpaceEvenly"> @foreach (var list in Config.Memes) { foreach (var meme in list) { <VerticalStackLayout Padding="new Thickness(5,5,5,5)"
Spacing="5" BackgroundColor="Config.ColorList[RandomNumberGenerator.GetInt32(0, Config.ColorList.Count)]" WidthRequest="100" HeightRequest="100">

                    <Button OnClick="async() => await PlaySoundAsync(meme)" BackgroundColor="Config.Primary" Text="PLAY"/>
                </VerticalStackLayout>
            }
        }
</FlexLayout>`

Hi, I'm trying to fit a lot of stacklayouts into a flexlayout and it takes a quite a while to load. Anyway I could use an observable collection with bindable layout?

[Dreamescaper]

BindableLayout is not really applicable for Blazor diff approach. Maybe it is possible to make it work, but it doesn't make much sense.

Still, while Blazor diff-ing had some perf overhead, it should not cause any noticeable effect in most cases. Have you tried implementing it with xaml and BindableLayout, does it work faster? How many items to you have there btw? And how do you plan to use BindableLayout anyway?

[Dreamescaper]

Btw, this part will probably cause issues:

BackgroundColor="Config.ColorList[RandomNumberGenerator.GetInt32(0, Config.ColorList.Count)]"

It will probably change the color on any interaction.

You can either store that color per meme somehow, or extract Meme component separately (probably a better approach).

[lochidev]

Hi, I fixed this by switching over to shell. Was using tabbedpage and was confused 😂 Amazing project btw, loving it!