'React native navigation: Use a modal screen inside a drawer navigator
I have been using a StackNavigator from React Navigation and I have been able to use presentation: 'modal' to show a screen as a modal within the stack.
I've now found it would be best to use a drawer navigator for a set of nested screens within my app.
However, now the screen doesn't act like a modal at all. Is it possible to have a modal screen within a drawer navigator?
My Drawer navigator looks liks:
const AccountDrawer = createDrawerNavigator()
function AccountScreen() {
return (
<AccountDrawer.Navigator initialRouteName="Overview">
<AccountDrawer.Screen
name="Overview"
component={Account}
/>
<AccountDrawer.Screen
name="Login"
component={LoginView}
options={() => ({
title: 'Login or sign up',
presentation: 'modal',
})}
/>
<AccountDrawer.Screen
name="About"
component={About}
/>
</AccountDrawer.Navigator>
)
}
export default AccountScreen
Screenshot of what it looks like:

Screenshot of what I need it to look like:

Is this even possible with a drawer?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
