react-native-view-overflow icon indicating copy to clipboard operation
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

Open EdwardDrapkin opened this issue 7 years ago • 2 comments

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 :(

EdwardDrapkin avatar Jun 27 '18 09:06 EdwardDrapkin

Hello @EdwardDrapkin. Thanks for reaching out! PRs improving README are welcome \o/

jgcmarins avatar Jun 27 '18 12:06 jgcmarins

I'll see what I can do after work and give it some more thought

EdwardDrapkin avatar Jun 27 '18 12:06 EdwardDrapkin