react-native-view-overflow
react-native-view-overflow copied to clipboard
Add a note that you may need more than one component in the tree to properly cascade overflow upward
Hey there,
I love this component, it's probably saved me 2-3 days of refactoring a layout.
That said, I had some issues getting it to work because I to use multiple <ViewOverflow> components in the hierarchy to get things to render correctly. Basically my design has a screen split into two halves (when a menu is open) and icons from the right half (menu icons) are supposed to sit on top of the left half (an opacity overlay). I had to put a <ViewOverflow> on the Views that split the screen as well as inside the right side (the menu) itself. I've worked with some other graphics libraries before, so it didn't take more than a few minutes to figure out what was happening, but it wasn't super obvious initially and if I didn't have prior experience, I might not have known to figure out the multiple clipping points and use multiple <ViewOverlay> components.
So I think it might be worth mentioning in the README. Something along the lines of...
Clipping at multiple levels in the component tree
Sometimes absolutely positioned components can be clipped at multiple points in the rendering tree. Image you have a container element that renders a series of box elements and you want to absolutely position something from within the box component. The box itself will clip the absolutely positioned element as well as the container, so you will need to wrap both the container and the box component in
<ViewOverflow>.
... but that's pretty poorly worded and I can't do better :(
Hello @EdwardDrapkin. Thanks for reaching out! PRs improving README are welcome \o/
I'll see what I can do after work and give it some more thought