feat: Add spacing feature to flex example ✨

[kdheepak]

This adds the spacing using + and - to the flex example:

space-flex.mov

This was useful to find and debug spacing related bugs like this: #829

[Valentin271]

I like this a lot, could we display the current spacing value somewhere? And maybe add a note that Space* don't support spacing.

I see you fixed the proportional bug in #829 (I rebased locally and tested). I still can see a bug with Percentage or maybe Length.

flex-bug-2024-01-16_13.18.21.mp4

I also recommend bumping the layout cache to 200 because every + or - is a lot of "layouting" added. I can really feel it on my machine.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (813f707) 92.5% compared to head (59a352b) 92.5%.
Report is 2 commits behind head on main.

Additional details and impacted files

@@          Coverage Diff           @@
##            main    #830    +/-   ##
======================================
  Coverage   92.5%   92.5%            
======================================
  Files         59      59            
  Lines      15745   15849   +104     
======================================
+ Hits       14571   14675   +104     
  Misses      1174    1174            

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[kdheepak]

I like this a lot, could we display the current spacing value somewhere?

Good idea. I added it to the axis.

I also fixed the axis to show the correct width of the blocks when there is a scrollbar or not.

And maybe add a note that Space* don't support spacing.

Done.

I still can see a bug with Percentage or maybe Length.

Yes, that can only be fixed with this PR though: #788
Trying to get other PRs through and will work on the constraint weights at the end.

I also recommend bumping the layout cache to 200

I bumped it to a higher number because I was seeing lag too.

Thanks for the comments!

[Valentin271]

Works for me then!