Microsoft-ui-xaml: Create FlexboxLayout for preview

[chrisglein]

Tracking feature for prototyping an implementation of Flexbox layout and putting into preview for community feedback.

• [x] Prototype panel based layout
• [x] Move to Repeater/LayoutPanel layout
• [x] Order
• [x] Grow
• [ ] Shrink
• [x] Wrap
• [x] Direction
• [x] Justifycontent
• [x] AlignItems
• [x] AlignContent
• [x] AlignSelf
• [x] Create demo pages
• [ ] Create tests
• [ ] Support virtualization

[rmarinho]

https://github.com/xamarin/Xamarin.Forms/blob/master/Xamarin.Flex/Flex.cs

One Microsoft :)

[chrisglein]

https://github.com/xamarin/Xamarin.Forms/blob/master/Xamarin.Flex/Flex.cs
One Microsoft :)

Love it! Unfortunately to meet the bar in WinUI I need a C++ implementation. I now have 3 C# implementations and 1 JS to reference, so mostly it's about transforming into C++ and picking the tightest solution to Flexbox (and can grow to support virtualization). At first glance the one you've linked seems broken up into a Measure/Arrange pattern, which most aren't. That's really helpful. I appreciate the reference!

[rmarinho]

https://github.com/xamarin/flex

you welcome ;)

[rmarinho]

what'0s broken in our link? we use it on our product. And it's performant on phones.
About virtualisation, that's another story not related with the flex spec right?
Does a Layout virtualise items ? I thought that was just controls like GridView

[chrisglein]

what'0s broken in our link? we use it on our product. And it's performant on phones.
About virtualisation, that's another story not related with the flex spec right?
Does a Layout virtualise items ? I thought that was just controls like GridView

Broken up in a good way, not a bad way :) XAML's layout system is a two pass layout system with different steps for Measure (how big do you want to be?) and Arrange (where should you go). Most layout solutions out there are written to do it all at once, which makes it more awkward to fit into XAML's layout system.

Virtualization is a something all well behaved layouts should do if they can. If we want to recommend a layout to developers we want to ensure that it's performant with various sizes of data. I think it's okay to omit virtualization from an early preview of Flexbox, but it's something we'll want to make sure to solve in eventually.