was facing the same issue.
seems like native-stack has some issue with "modal" but 'containedTransparentModal' was working.
"modal" works fine if we switch to a normal stack navigator

Yeah it looks like it's just not implemented? 🤔 weird that the documentation says

modal, containedModal, fullScreenModal, formSheet will use Screen.StackPresentation.MODAL.

when MODAL is essentially ignored in the android code.

react-native-screens on main ➜ rg MODAL android
android/src/main/java/com/swmansion/rnscreens/Screen.kt
240:        PUSH, MODAL, TRANSPARENT_MODAL

android/src/main/java/com/swmansion/rnscreens/ScreenViewManager.kt
58:                Screen.StackPresentation.MODAL
60:                Screen.StackPresentation.TRANSPARENT_MODAL

android/src/main/java/com/swmansion/rnscreens/ScreenStack.kt
90:        var visibleBottom: ScreenStackFragment? = null // this is only set if newTop has TRANSPARENT_MODAL presentation mode
328:            fragment.screen.stackPresentation === Screen.StackPresentation.TRANSPARENT_MODAL

Given that Screen's are backed by androidx Fragments, I expect the fix will be to have modal screens inherit from DialogFragment.

Also facing the same issue. Do we have a work around for this for android?

I'm facing the same issue. It's not working in android 💯

Is there anyone solved this issue ??

Yes it is not working. Can anyone suggest a workaround?

Hi, sorry for late response!

There is likely no workaround, because as @jaredly reported, indeed Android modal view are effectively not implemented. I recently started looking into it while attempting to implement bottom-sheets for Android -- and unfortunately there are some technical reasons why it is the case and Android modals were left behind. It looks that documentation is indeed misleading, sorry! Once I'll open PR with support for modals & I'll try to remember to link it here so you can track progress.

hey, @kkafar did you find the solution 😛 ?

6 months and the docs still say this presentation works on android and ios. Would appreciate any update :)

Any solution yet?

anything on this?

let's change to use flutter.

I think we should try to use animation API provided by Stack as an alternative to it

use
import {createStackNavigator} from "@react-navigation/stack";
instead of
import {createNativeStackNavigator} from "@react-navigation/native-stack";
working for both Android and IOS

after upgrading to react navigation V6 this code worked for me:

<Stack.Group screenOptions={{ presentation: 'modal' }}>

    <Stack.Screen name="ComponentName" component={Component} options={() => ({
            presentation: 'modal'
    })} />

</Stack.Group>

Any update on this?

working perfectly

Still not working

day 28 of september, Expo Router V2 and SDK 49, and still not working on android

It's been a so long, Tag "Zuck" now. 😬

still not working

add the below in screenOptions
: animation:"slide_from_bottom"

I want to make the previous screen appear a little bit in the current screen

I want to make the previous screen appear a little bit in the current screen

I want the same but i dont think is intended to work that way on android from what ive seen.

I'm using "expo": "~49.0.13", and I'm facing the same issue on Android. The Expo documentation has examples saying it should work, but I can't get it to work."

I want to make the previous screen appear a little bit in the current screen

Changing from modal to transparentModal worked for me.
@Paulods0 @izyspania

{
   presentation: "transparentModal"
}

ModalSlideFromBottomIOS worked but the screen still show in fullscreen, any solution?

ModalSlideFromBottomIOS worked but the screen still show in fullscreen, any solution?

Mine is working well not covering full screen. I am using createStackNavigator (non native) and screenOptions={{presentation: 'modal'}} I created a separated group for modal presentations by using <"StackName".Group screenOptions={{presentation: 'modal'}}>, hope that works

Mine is working well not covering full screen. I am using createStackNavigator (non native) and screenOptions={{presentation: 'modal'}} I created a separated group for modal presentations by using <"StackName".Group screenOptions={{presentation: 'modal'}}>, hope that works

thanks, but I native-stack is better performance, so I dont want to use non-native

Mine is working well not covering full screen. I am using createStackNavigator (non native) and screenOptions={{presentation: 'modal'}} I created a separated group for modal presentations by using <"StackName".Group screenOptions={{presentation: 'modal'}}>, hope that works

thanks, but I native-stack is better performance, so I dont want to use non-native

Yeah, your are right, but with Native unfortunately it won't work, I hope they fix that.

Any update on this problem? :(
react-navigation/stack didn't work also.

so with "expo": "~50.0.5", and "expo-router": "~3.4.6", it's still not working , shame because docs saying differently

Well over a year and still what most would call a key facility is non functional. What, do they all use iphones or what?

I am having the same issue, my app heavily relies on modal to work correctly. Is there any kind of communication regarding this being in the pipeline to be fixed?

My workaround using expo:

import Constants from 'expo-constants';

    <View
      style={{
        flex: 1,
        paddingTop: IS_ANDROID ? Constants.statusBarHeight : 0,
      }}>
      
      //...

    </View>

any updates?

Please this info should be included in expo docs, since this is causing confusion for many of us.

presentation=modal is still not working for bot ios and android

presentation=modal is still not working for bot ios and android

Same

looks like a few things could happen here for a way forward:

1. issue gets fixed (looking unlikely on a timeframe suitable for any of us with in-progress projects)
2. update docs
3. some kind of console warning if used on android
   ===
   as for my project, just living with the push navigation for now, unfortunately, and had to figure out a hack to hide the bottom navigation bar, because the purpose of the modal presentation was so that the presented flow was apart from the root navigation

looks like a few things could happen here for a way forward:

1. issue gets fixed (looking unlikely on a timeframe suitable for any of us with in-progress projects)
2. update docs

3. some kind of console warning if used on android

   as for my project, just living with the push navigation for now, unfortunately, and had to figure out a hack to hide the bottom navigation bar, because the purpose of the modal presentation was so that the presented flow was apart from the root navigation

You are absolutely right !. I am thinking of using this instead
react-native-bottom-sheet

looks like a few things could happen here for a way forward:

1. issue gets fixed (looking unlikely on a timeframe suitable for any of us with in-progress projects)
2. update docs

3. some kind of console warning if used on android

   as for my project, just living with the push navigation for now, unfortunately, and had to figure out a hack to hide the bottom navigation bar, because the purpose of the modal presentation was so that the presented flow was apart from the root navigation

You are absolutely right !. I am thinking of using this instead react-native-bottom-sheet

With the plan being to host the sheets inside of your routes?

looks like a few things could happen here for a way forward:

1. issue gets fixed (looking unlikely on a timeframe suitable for any of us with in-progress projects)
2. update docs

3. some kind of console warning if used on android

   as for my project, just living with the push navigation for now, unfortunately, and had to figure out a hack to hide the bottom navigation bar, because the purpose of the modal presentation was so that the presented flow was apart from the root navigation

You are absolutely right !. I am thinking of using this instead react-native-bottom-sheet

With the plan being to host the sheets inside of your routes?

No, just using them like a modal.

Hey, I just found a temporary workaround for this for android, if you want modal to be a bit of away from screen like IOS version, just add these screen options and you are good to go.

 <Stack.Group screenOptions={({navigation}) => ({
          ...TransitionPresets.ModalSlideFromBottomIOS,
          gestureEnabled: true,
          presentation: "modal",
          cardStyle: {marginTop: 10, borderTopStartRadius: 20, borderTopEndRadius: 20}

        })}>

damn

i wish the modal screen supported on android

they all use iPhones only 😥 .

Hey hey: you can track this PR: #2045 for progress in the matter. It's finally entering review process.

Hey hey: you can track this PR: #2045 for progress in the matter. It's finally entering review process.

Finally 😅

Hey hey: you can track this PR: #2045 for progress in the matter. It's finally entering review process.

Nice.

This works on android and IOS.
presentation: 'modal', gestureEnabled: true, ...(Platform.OS === 'android' && TransitionPresets.ModalPresentationIOS),

<ListStackNavigator.Group screenOptions={{ presentation: 'modal', gestureEnabled: true, ...(Platform.OS === 'android' && TransitionPresets.ModalPresentationIOS), }}> <ListStackNavigator.Screen name="NewList" component={NewList} options={{ headerShown: false, }} /> </ListStackNavigator.Group>

This works on android.
presentation: 'modal', gestureEnabled: true, ...(Platform.OS === 'android' && TransitionPresets.ModalPresentationIOS),

<ListStackNavigator.Group screenOptions={{ presentation: 'modal', gestureEnabled: true, ...(Platform.OS === 'android' && TransitionPresets.ModalPresentationIOS), }}> <ListStackNavigator.Screen name="NewList" component={NewList} options={{ headerShown: false, }} /> </ListStackNavigator.Group>
Will it work on iOS??

@atultiwaree Yes.