Modal prompts on iOS overlay the toast about react-native-toast-message HOT 13 OPEN

On IOS you have create a new toast element inside each modal, refs are auto handled
https://github.com/calintamas/react-native-toast-message/blob/main/docs/modal-usage.md#notes-regarding-react-native-modal-or-nativestacknavigator

from react-native-toast-message.

@Kief5555 Were you able to figure out a solution?

from react-native-toast-message.

@Kief5555 Were you able to figure out a solution?

No, I might try to import the toast in the modal and try to display it there.

from react-native-toast-message.

same issue

from react-native-toast-message.

Are you tried this ? Notes regarding react-native-modal or NativeStackNavigator

from react-native-toast-message.

@jmcartlamy Hey! I'm using an Expo router so if I use it this way I get a warning. Also i saw this comment #195 (comment) so i will try containedModal

from react-native-toast-message.

Im getting the same issue too.

from react-native-toast-message.

Any news on this? Using 'containedModal' as suggested in #195 is not a sustainable solution.
The user looses the ability to swipe down the modal on iOS, therefore compromising intuitive behaviour of the app.

from react-native-toast-message.

On IOS you have create a new toast element inside each modal, refs are auto handled

https://github.com/calintamas/react-native-toast-message/blob/main/docs/modal-usage.md#notes-regarding-react-native-modal-or-nativestacknavigator

This is a different type of modal, I think. Shown in the screenshot is the native Modal Component (not view)

from react-native-toast-message.

On IOS you have create a new toast element inside each modal, refs are auto handled
https://github.com/calintamas/react-native-toast-message/blob/main/docs/modal-usage.md#notes-regarding-react-native-modal-or-nativestacknavigator

This is a different type of modal, I think. Shown in the screenshot is the native Modal Component (not view)

It's the same for both stack modals and the RN Modal component.

from react-native-toast-message.

Rendering content on top of native views (presentation="modal") is a bit tricky. What works for me is rendering the Toast component again in the Screen using @gorhom/portal as following:

<Portal hostName="toast">
  <FullWindowOverlay>
    <Toast />
  </FullWindowOverlay>
</Portal>

Be aware that this solution does not work when running the app on the simulator. It somehow only works on the final build.
See React Native Screens Integration docs for more details.

from react-native-toast-message.

For me, it worked when I added the Toast to the modal view, but the Toast has to be the last component.

export function ModalView({ children }: ModalViewProps) {
  return (
    <>
      {children}
      <Toast />
    </>
  )
}

from react-native-toast-message.

Use FullWindowOverlay from react-native-screens

from react-native-toast-message.