search

gorhom / react-native-portal

A simplified portal implementation for ⭕️ React Native & Web ⭕️.
MIT License
660 stars 38 forks source link

FullWindowOverlay and Portal fails on react native fullscreen presentation modal #41

Open Jonatthu opened 1 year ago

Jonatthu commented 1 year ago

Whenever you have a react navigation full screen presentation modal, the Button element does not outputs the console.log value

I I remove and leave the rest, it would start working again.

<Portal>
    <FullWindowOverlay>
        <View className="mt-52 h-full w-full bg-red-400">
            <Button title="Hello world" onPress={() => console.log('HELLO')} />
        </View>
    </FullWindowOverlay>

</Portal>
e-younan commented 1 year ago

Noticed this too - just realized that a Portal component I implemented stops displaying if a "fullscreen" modal is open on iOS.

eagleeyejack commented 1 year ago

can confirm, seeing this too

eagleeyejack commented 1 year ago

Doing further inspection and it looks like the Portal is being rendered behind the full screen as when I switched to presentation: "modal" on my stack, I could see it behind the stack.

Currently looking to see what I can do to render my portal "above the stack"

Can't help but this this is related: https://github.com/gorhom/react-native-bottom-sheet/pull/1309

so will leave for now

epolat-github commented 10 months ago

Same problem on me too. I tried wrapping the content with FullWindowOverlay from react-native-screens, but that didn't work also. I built a snackbar feature for my app but it shows up behind the stack when the screen is presented as "modal" or equivalent.

ismoiliy98 commented 2 weeks ago

Is there any workaround to use the portal in the presentation: "modal" screen?