search

brentvatne / react-native-overlay

An <Overlay /> component that brings content inside to the front of the view regardless of its current position in the component tree.
638 stars 79 forks source link

Overlay not covering TabBar #12

Closed albertwchang closed 9 years ago

albertwchang commented 9 years ago

Wondering whether Overlay layers should be able to cover TabBar's. In my use case, I am setting up an Overlay within a scene that is 2 "stacks" deep from the Navigator (e.g. the 2nd scene that has been navigator.push()).

brentvatne commented 9 years ago

This should be possible, can you post a reproducible example of this not working?

albertwchang commented 9 years ago

Here's a React Native Playground link to a sample app: https://rnplay.org/apps/9vk0RA. Since I cannot get this app running in Playground, use the entire codebase within this Playground file, and follow these instructions:

Instructions: 1) react-native init Test 1) Replace all contents of index.ios.js with this entire codebase. 2) npm install latest version of all required dependencies within the codebase 3) rm -rf react-native from within node_modules folder of the "react-native-device-display" module. If you don't do this, the app will give an error and not run.

*\ At the bottom of the 2nd scene, you'll notice a dark blue bar with a thick "X" in the middle. That bar should cover the TabBar...

albertwchang commented 9 years ago

I got the Overlay to work. Looks like the bottom-most component needs to sit within the Overlay module, and the Overlay module needs to be declared in the parent-level component (that renders the bottom-most component)...

brentvatne commented 9 years ago

Weird! Thanks for the follow up