Message shows underneath modal

[lucasferreira]

Message shows underneath modal

[lucasferreira]

Hi @ucallQA and @lisa-nguyen-goldenowl

As we could see in https://github.com/react-native-community/react-native-modal README:

"Since react-native-modal is an extension of the original react native modal, it works in a similar fashion react-native original modal."

The original react native modal it's a "100% native solution" it works in another UI thread inside the app like a portal, só it runs always above everything in your app.

The only solution we had in this case it's described here: #1 (comment)

Basically you will need to put a second instance of <FlashMessage /> component inside your modals and call the show message by the ref, ex: this.refs.mySecondFlashMessage.showMessage({ ... })

[ucallQA]

I actually double checked if we were using a built in modal and we are using this library

https://github.com/react-native-community/react-native-modal

I think there might be a priority issue with this library, is there some way I can prioritize the react-native-flash-message over this one? I use the modal nested deep within one of my react components while the react-native-flash-message is initialized and called within the root/first layer of the project so I would imagine it would take priority.

Unless I'm misunderstanding the issue and it's related to react-navigation (we're on a much older version of it, this might be why it's acting weird)

[GustavoBonfimS]

I had this problem and found this solution in the official examples. maybe it helps too

https://github.dev/lucasferreira/react-native-flash-message/tree/master/examples/FlashMessagePlayground

[lucasferreira]

Hi @ucallQA

I've made a small sample at expo using react-navigation and Modals:

https://snack.expo.io/SJ7LNmIKB

As you can see when you click "Go to logout screen" a new screen are open in modal way, and the flash message keeps working.

If your setup it's different from my sample, please let me know and send me more code or prints.

[lisa-nguyen-goldenowl]

It worked like a charm!!! Thanks, @lucasferreira!

[sam9010]

@GustavoBonfimS https://github.dev/lucasferreira/react-native-flash-message/tree/master/examples/FlashMessagePlayground/components/CustomModal was useful for me... tnx

[lucasferreira]

Hi @ucallQA

What kind of navigation lib are you using?

[ucallQA]

Hi @lucasferreira ,
Currently we are using react-navigation although it is not the latest version, maybe that's why?

[lisa-nguyen-goldenowl]

I have the same problem as @ucallQA

[lucasferreira]

You're welcome @lisa-nguyen-goldenowl ;)