Skip to content

E
EmidWife-New
Commit cc87e799 authored by Malsha Jayakody's avatar Malsha Jayakody
Browse files
Options

set game images

parent db3c20a8
Hide whitespace changes
Inline Side-by-side
Showing with 91 additions and 50 deletions
src/navigations/BottomTabNavigator.js
View file @ cc87e799
import React from 'react';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
import Home from '../screens/home/Home';
import Wallet from '../screens/home/Wallet';
import Settings from '../screens/home/Settings';
import WelcomeExercise from '../screens/home/exercise/WelcomeExercise';
import Settings from '../screens/home/Settings';
import WelcomeExercise from '../screens/home/exercise/WelcomeExercise';
// import { Home, Wallet, Settings, WelcomeExercise} from '../screens';
import ExerciseNavigator from './ExerciseNavigator'
import ExerciseNavigator from './ExerciseNavigator';
import {COLORS, ROUTES} from '../constants';
import Icon from 'react-native-vector-icons/Ionicons';
import { StyleSheet } from 'react-native';
import {StyleSheet} from 'react-native';
import CustomTabBarButton from '../components/CustomTabBarButton';
import CustomTabBar from '../components/CustomTabBar';
import Logo from '../assets/icons/fitness1.svg';
import Logo1 from '../assets/icons/fitness2.svg';
import { Button, TextInput, View,SafeAreaView,KeyboardAvoidingView} from 'react-native';
import GameNavigator from './GameNavigator';
import AuthNavigator from './AuthNavigator';
const Tab = createBottomTabNavigator();
function BottomTabNavigator() {
return (
// <KeyboardAvoidingView>
<Tab.Navigator
tabBar={props => <CustomTabBar {...props} />}
screenOptions={({route}) =>({
tabBarHideOnKeyboard: true,
headerShown: false,
tabBarStyle: styles.tabBarStyle,
tabBarInactiveTintColor: COLORS.dark,
tabBarActiveTintColor: COLORS.primary,
tabBarShowLabel:false,
tabBarIcon: ({color, size, focused}) =>
{
if (route.name === ROUTES.HOME_TAB) {
return focused ? <Icon name='home' size={22} color={color} /> :<Icon name='home-outline' size={22} color={color} />;
} else if (route.name === ROUTES.EXERCISE_HOME) {
return focused ? <Logo1 width={22} height={22} /> : <Logo width={22} height={22} /> ;
} else if (route.name === ROUTES.WALLET) {
return focused ? <Icon name='wallet' size={22} color={color} /> :<Icon name='wallet-outline' size={22} color={color} />;
} else if (route.name === ROUTES.SETTINGS) {
return focused ? <Icon name='notifications-sharp' size={22} color={color} /> :<Icon name='notifications-outline' size={22} color={color} />;
}
}
})}>
<Tab.Screen name={ROUTES.HOME_TAB} component={Home}
options={{
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
/>
<Tab.Screen name={ROUTES.SETTINGS} component={Settings}
options={{
tabBarButton: props => <CustomTabBarButton {...props} />,
}}/>
<Tab.Screen name={ROUTES.WALLET} component={Wallet}
options={{
tabBarButton: props => <CustomTabBarButton {...props} />,
}}/>
<Tab.Screen options={{
tabBar={props => <CustomTabBar {...props} />}
screenOptions={({route}) => ({
tabBarHideOnKeyboard: true,
headerShown: false,
headerBackTitleVisible: false,
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
name={ROUTES.EXERCISE_HOME} component={ExerciseNavigator} />
tabBarStyle: styles.tabBarStyle,
tabBarInactiveTintColor: COLORS.dark,
tabBarActiveTintColor: COLORS.primary,
tabBarShowLabel: false,
tabBarIcon: ({color, size, focused}) => {
if (route.name === ROUTES.HOME_TAB) {
return focused ? (
<Icon name="home-sharp" size={22} color={color} />
) : (
<Icon name="home-outline" size={22} color={color} />
);
} else if (route.name === ROUTES.EXERCISE_HOME) {
return focused ? (
<Logo1 width={22} height={22} />
) : (
<Logo width={22} height={22} />
);
} else if (route.name === ROUTES.GAME_HOME) {
return focused ? (
<Icon name="game-controller-sharp" size={22} color={color}/>
) : (
<Icon name="game-controller-outline" size={22} color={color}/>
);
} else if (route.name === ROUTES.SETTINGS) {
return focused ? (
<Icon name="notifications-sharp" size={22} color={color} />
) : (
<Icon name="notifications-outline" size={22} color={color} />
);
} else if (route.name === ROUTES.LOGIN) {
return focused ? (
<Icon name="person-circle-sharp" size={22} color={color} />
) : (
<Icon name="person-circle-outline" size={22} color={color} />
);
}
},
})}>
<Tab.Screen
name={ROUTES.HOME_TAB}
component={Home}
options={{
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
/>
<Tab.Screen
name={ROUTES.SETTINGS}
component={Settings}
options={{
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
/>
<Tab.Screen
name={ROUTES.GAME_HOME}
component={GameNavigator}
options={{
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
/>
<Tab.Screen
options={{
headerShown: false,
headerBackTitleVisible: false,
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
name={ROUTES.EXERCISE_HOME}
component={ExerciseNavigator}
/>
<Tab.Screen
options={{
headerShown: false,
headerBackTitleVisible: false,
tabBarButton: props => <CustomTabBarButton {...props} />,
}}
name={ROUTES.LOGIN}
component={AuthNavigator}
/>
</Tab.Navigator>
// </KeyboardAvoidingView>
);
......@@ -76,11 +117,11 @@ const styles = StyleSheet.create({
bottom: 5,
right: 10,
left: 10,
height: 58
height: 58,
},
mr7: {
color: COLORS.primary,
stroke: COLORS.primary,
fill: COLORS.primary
}
})
\ No newline at end of file
fill: COLORS.primary,
},
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment