fbf8094281
Expo Router file-based navigation with glass tab bar, 3 tabs (Créations, Explorer, Profil), Phosphor icons, modal picker, and fade transitions.
45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import { Tabs } from "expo-router";
|
|
import { GlassTabBar } from "@/components/glass";
|
|
import { House, Compass, UserCircle } from "phosphor-react-native";
|
|
import type { ColorValue } from "react-native";
|
|
|
|
export default function TabLayout() {
|
|
return (
|
|
<Tabs
|
|
tabBar={(props) => <GlassTabBar {...props} />}
|
|
screenOptions={{
|
|
headerShown: false,
|
|
tabBarStyle: { display: "none" },
|
|
}}
|
|
>
|
|
<Tabs.Screen
|
|
name="index"
|
|
options={{
|
|
title: "Créations",
|
|
tabBarIcon: ({ color, size }: { color: ColorValue; size: number }) => (
|
|
<House size={size} color={color as string} weight="light" />
|
|
),
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="explore"
|
|
options={{
|
|
title: "Explorer",
|
|
tabBarIcon: ({ color, size }: { color: ColorValue; size: number }) => (
|
|
<Compass size={size} color={color as string} weight="light" />
|
|
),
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="profile"
|
|
options={{
|
|
title: "Profil",
|
|
tabBarIcon: ({ color, size }: { color: ColorValue; size: number }) => (
|
|
<UserCircle size={size} color={color as string} weight="light" />
|
|
),
|
|
}}
|
|
/>
|
|
</Tabs>
|
|
);
|
|
}
|