Skip to content

Instantly share code, notes, and snippets.

@ranveerching

ranveerching/TabNavigator.js Secret

Created Oct 15, 2020
Embed
What would you like to do?
import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import HomeScreen from './HomeScreen';
import FeedScreen from './FeedScreen';
import { onTabPress } from '../services';
const Tab = createBottomTabNavigator();
const TabNavigator = () => {
return (
<Tab.Navigator>
<Tab.Screen
name='Home'
component={HomeScreen}
options={{
tabBarLabel: 'Home',
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="home" color={color} size={size} />
),
}}
listeners={({ navigation, route }) => ({
tabPress: () => onTabPress(navigation, route)
})}
/>
<Tab.Screen
name='Feed'
component={FeedScreen}
options={{
tabBarLabel: 'Feed',
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="rss" color={color} size={size} />
),
}}
listeners={({ navigation, route }) => ({
tabPress: () => onTabPress(navigation, route)
})}
/>
</Tab.Navigator>
)
};
const BottomTabNavigator = () => {
return (
<NavigationContainer>
<TabNavigator />
</NavigationContainer>
)
};
export default BottomTabNavigator;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.