taskeep-app/app/(tabs)/_layout.tsx
2025-07-30 16:59:58 +02:00

46 lines
1.3 KiB
TypeScript

import { Tabs } from 'expo-router';
import React from 'react';
import { Platform } from 'react-native';
import Ionicons from '@expo/vector-icons/Ionicons';
import { useTranslation } from 'react-i18next';
import { HapticTab } from '../../components/HapticTab';
import TabBarBackground from '../../components/ui/TabBarBackground';
export default function TabLayout() {
const { t } = useTranslation();
return (
<Tabs
screenOptions={{
tabBarActiveTintColor: "#fff",
tabBarActiveBackgroundColor: "#6a254fff",
headerShown: false,
tabBarButton: HapticTab,
tabBarBackground: TabBarBackground,
tabBarStyle: Platform.select({
ios: {
// Use a transparent background on iOS to show the blur effect
position: 'absolute',
},
default: {},
}),
}}>
<Tabs.Screen
name="index"
options={{
title: t('Tasks'),
tabBarIcon: ({ color }) => <Ionicons size={28} name="document-text-outline" color={color} />,
}}
/>
<Tabs.Screen
name="categories"
options={{
title: t('Categories'),
tabBarIcon: ({ color }) => <Ionicons size={28} name="albums-outline" color={color} />,
}}
/>
</Tabs>
);
}