You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
62 lines
1.8 KiB
62 lines
1.8 KiB
import { Tabs } from 'expo-router';
|
|
import { Ionicons } from '@expo/vector-icons';
|
|
import type { ComponentProps } from 'react';
|
|
import { StyleSheet, Text } from 'react-native';
|
|
import type { ColorValue } from 'react-native';
|
|
import { colors } from '../../src/theme';
|
|
|
|
type IconName = ComponentProps<typeof Ionicons>['name'];
|
|
|
|
/**
|
|
* 根据选中状态返回实心/描边图标
|
|
*/
|
|
function tabIcon(filled: IconName, outline: IconName) {
|
|
return ({ color, size, focused }: { color: ColorValue; size: number; focused: boolean }) => (
|
|
<Ionicons name={focused ? filled : outline} size={size} color={color} />
|
|
);
|
|
}
|
|
|
|
/**
|
|
* 底部 Tab 导航：首页默认选中，蓝色高亮
|
|
*/
|
|
export default function TabLayout() {
|
|
return (
|
|
<Tabs
|
|
screenOptions={{
|
|
headerShown: false,
|
|
tabBarActiveTintColor: colors.primary,
|
|
tabBarInactiveTintColor: colors.textSecondary,
|
|
tabBarLabel: ({ color, children }) => (
|
|
<Text style={[styles.labelText, { color }]}>{children}</Text>
|
|
),
|
|
}}
|
|
>
|
|
<Tabs.Screen
|
|
name="index"
|
|
options={{ title: '首页', tabBarIcon: tabIcon('home', 'home-outline') }}
|
|
/>
|
|
<Tabs.Screen
|
|
name="jobs"
|
|
options={{ title: '岗位', tabBarIcon: tabIcon('briefcase', 'briefcase-outline') }}
|
|
/>
|
|
<Tabs.Screen
|
|
name="chat"
|
|
options={{ title: '沟通', tabBarIcon: tabIcon('chatbubbles', 'chatbubbles-outline') }}
|
|
/>
|
|
<Tabs.Screen
|
|
name="growth"
|
|
options={{ title: '成长', tabBarIcon: tabIcon('trending-up', 'trending-up-outline') }}
|
|
/>
|
|
<Tabs.Screen
|
|
name="profile"
|
|
options={{ title: '我的', tabBarIcon: tabIcon('person', 'person-outline') }}
|
|
/>
|
|
</Tabs>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
labelText: {
|
|
fontSize: 11,
|
|
},
|
|
});
|