locaft_mobile/components/BottomTab.js

99 lines
2.3 KiB
JavaScript

import React from 'react';
import {StatusBar, StyleSheet, Text, useColorScheme, View} from 'react-native';
import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
import HomeScreen from './HomeScreen';
import RegisterUserScreen from './RegisterUserScreen';
import LoginUserScreen from './LoginUserScreen';
import UserProfile from './UserProfile';
import HouseLocation from './HouseLocation'
import {Icon} from 'react-native-elements';
const Tab = createBottomTabNavigator();
function BottomTab() {
return (
<Tab.Navigator
screenOptions={{
title: '',
gestureEnabled: true,
animationEnabled: false,
tabBarShowLabel: false,
tabBarStyle: [
{
position: 'absolute',
bottom: 10,
left: 20,
right: 20,
elevation: 0,
backgroundColor: '#cdcdcd',
borderRadius: 25,
height: 50,
width: '90%',
},
],
}}>
<Tab.Screen
name="Home"
component={HomeScreen}
options={{
tabBarIcon: ({focused}) => (
<Icon
name="home-outline"
type="ionicon"
size={36}
color="#206ba5"
/>
),
headerShown:false,
}}
/>
<Tab.Screen
name="s"
component={LoginUserScreen}
options={{
tabBarIcon: ({focused}) => (
<Icon
name="search-outline"
type="ionicon"
size={36}
color="#206ba5"
/>
),
headerShown:false,
}}
/>
<Tab.Screen
name="r"
component={UserProfile}
options={{
tabBarIcon: ({focused}) => (
<Icon name="sliders" type="feather" size={36} color="#206ba5" />
),
headerShown:false,
}}
/>
<Tab.Screen
name="t"
component={RegisterUserScreen}
options={{
tabBarIcon: ({focused}) => (
<Icon
name="person-circle-outline"
type="ionicon"
size={36}
color="#206ba5"
/>
),
headerShown:false,
}}
/>
</Tab.Navigator>
);
}
export default BottomTab;