const LightboxNavigator = (
routeConfigs,
tabsConfig = {}
) => {
const router = TabRouter(routeConfigs, tabsConfig);
const navigator = createNavigator(
router,
routeConfigs,
tabsConfig,
'react-navigation/STACK'
)(({ navigation }) => {
const { state, dispatch } = navigation;
const { routes, index } = state;
// Figure out what to render based on the navigation state and the router:
const Component = routeConfigs[tabsConfig.initialRouteName].screen;
let initialIndex = 0;
for (let i = 0; i < routes.length; i++) {
const route = routes[i];
if (route.routeName === tabsConfig.initialRouteName) {
initialIndex = i;
}
}
const Popup = index !== initialIndex ? routeConfigs[routes[index].routeName].screen : null;
return (<View style={{ flex: 1 }}>
<Component navigation={addNavigationHelpers({ dispatch, state: routes[initialIndex] })} />
{Popup && <Popup navigation={addNavigationHelpers({ dispatch, state: routes[index] })} />}
</View>);
});
return createNavigationContainer(navigator, tabsConfig.containerOptions);
};
function createCustomNavigator(routeConfigMap, config = {}) {
let router = SwitchRouter(routeConfigMap, config);
let NavigatorComponent = createNavigator(
NavigationView,
router,
config,
);
return createNavigationContainer(NavigatorComponent);
}
screen: MyNotificationsScreen,
path: 'notifications',
},
Settings: {
screen: MySettingsScreen,
path: 'settings',
},
},
{
// Change this to start on a different tab
initialRouteName: 'Home',
}
);
const CustomTabs = createNavigationContainer(
createNavigator(CustomTabRouter)(CustomTabView)
);
const styles = StyleSheet.create({
tabContainer: {
flexDirection: 'row',
height: 48,
},
tab: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
margin: 4,
borderWidth: 1,
borderColor: '#ddd',
borderRadius: 4,
return (routes, config = {}) => {
const router = TabRouter(routes, config);
const navigator = createNavigator(NavigationView, router, config);
return createNavigationContainer(navigator);
};