I have a functional Drawer navigator that holds a Stack navigator as shown below:
function DrawerNavigator() {
return (
<Drawer.Navigator>
<Drawer.Screen
name="Categories"
component={CategoriesScreen}
... />
),
}}
/>
<Drawer.Screen
...
</Drawer.Navigator>
);
}
...
return (
<>
...
<NavigationContainer onReady={onLayoutRootView}>
...
<Stack.Screen
name="MealCategories"
component={DrawerNavigator}
options={{ headerShown: false }}
/>
While in the 'Favorites' screen, which is registered under the Drawer Navigator, when attempting to navigate to 'Categories' page which is registered under Stack navigator (but pointed to using Drawer navigator) using navigation.navigate()
, there's no navigation animation.
const buttonPressHandler = () => {
navigation.navigate("Categories");
};
Yup it seems the drawer navigator has no support for screen animation. So it all looks great when using the drawer to navigate. But if navigating through links in the page or actions, theres no navigation animation between screens. Been hunting for hours now and I think its simply not implemented.