search

pmndrs / react-three-flex

💪📦 Flexbox for react-three-fiber
MIT License
1.65k stars 42 forks source link

Recalculate layout on Box size change #4

Closed giulioz closed 4 years ago

giulioz commented 4 years ago

There seems to be some issues with layout recalc when Box sizes change, especially when using useLoader

talentlessguy commented 4 years ago

what is a good way to detect these changes?

giulioz commented 4 years ago

No idea, I'm trying to investigate.

A silly solution could be to expose an API to imperatively invalidate the layout:

const { invalidateSize } = useFlex()
useEffect(invalidateSize, [width, height]);
talentlessguy commented 4 years ago

@giulioz hmmm should it resize on Box change btw? And what resizes, a Box or content inside a Box?

I guess it's easier to do for the first variant (recalculate Box parameters)

drcmda commented 4 years ago

i dont think resize can be easily detected. manual invalidate is probably the way to go. that also allows for some cool tricks, like users can offset their contents and not inform the flex layout, which works like css transforms.