sort/components/nav.tsx
2024-10-16 10:37:18 +07:00

50 lines
2.2 KiB
TypeScript

import { Ionicons } from "@expo/vector-icons";
import { View, Text, Image} from "react-native";
import { TouchableOpacity } from "react-native-gesture-handler";
import { useNavigation, NavigationProp, useFocusEffect } from '@react-navigation/native';
import config from "../components/data/config.json";``
export default function Nav() {
const navigation = useNavigation<NavigationProp<any>>();
return (<>
<View style={{
height: 60,
backgroundColor: "#fff",
flexDirection: "row",
shadowColor: "#000",
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
}}>
<TouchableOpacity onPress={() => navigation.navigate('home')} style={{ width: 140, flex: 1 }}>
<View style={{ justifyContent: "center", height: 60, flexDirection: "column", alignItems: "center" }}>
<Ionicons name="home" size={24} color={config.color.textbiru} />
<Text style={{ color: config.color.textbiru }}>Home</Text>
</View>
</TouchableOpacity>
<View style={{ flex: 1 }}>
<TouchableOpacity onPress={() => navigation.navigate('order')} activeOpacity={1} style={{ justifyContent: "center", height: 60, flexDirection: "column", alignItems: "center" }}>
<Image style={{
width: 60,
height: 60,
marginBottom: 30,
resizeMode: 'contain'
}} source={require('../assets/images/g42.png')} />
</TouchableOpacity>
</View>
<TouchableOpacity onPress={() => navigation.navigate('profile')} style={{ width: 140, flex: 1 }}>
<View style={{ justifyContent: "center", height: 60, flexDirection: "column", alignItems: "center" }}>
<Ionicons name="person" size={24} color={config.color.textbiru} />
<Text style={{ color: config.color.textbiru }}>Profile</Text>
</View>
</TouchableOpacity>
</View>
</>
);
}