85 lines
2.6 KiB
TypeScript
85 lines
2.6 KiB
TypeScript
import React from 'react'
|
|
import { Platform } from 'react-native'
|
|
import { Tabs } from 'expo-router'
|
|
import { Ionicons } from '@expo/vector-icons'
|
|
|
|
import Colors from '@/constants/Colors'
|
|
import { useColorScheme } from '@/components/useColorScheme'
|
|
import { useClientOnlyValue } from '@/components/useClientOnlyValue'
|
|
|
|
export default function TabLayout() {
|
|
const colorScheme = useColorScheme()
|
|
const dark = colorScheme === 'dark'
|
|
|
|
return (
|
|
<Tabs
|
|
screenOptions={{
|
|
tabBarActiveTintColor: Colors[colorScheme].tint,
|
|
tabBarInactiveTintColor: dark ? 'rgba(255,255,255,0.38)' : 'rgba(0,0,0,0.35)',
|
|
tabBarLabelStyle: { fontSize: 11, fontWeight: '600', letterSpacing: 0.2 },
|
|
tabBarStyle: {
|
|
backgroundColor: dark ? '#161a22' : '#fff',
|
|
borderTopWidth: 1,
|
|
borderTopColor: dark ? 'rgba(255,255,255,0.07)' : 'rgba(0,0,0,0.06)',
|
|
height: Platform.OS === 'ios' ? 88 : 64,
|
|
paddingTop: 6,
|
|
},
|
|
headerStyle: {
|
|
backgroundColor: dark ? '#161a22' : '#fff',
|
|
shadowColor: '#000',
|
|
shadowOpacity: dark ? 0.25 : 0.08,
|
|
shadowRadius: 12,
|
|
shadowOffset: { width: 0, height: 4 },
|
|
elevation: 4,
|
|
},
|
|
headerTintColor: Colors[colorScheme].text,
|
|
headerShown: useClientOnlyValue(false, true),
|
|
}}
|
|
>
|
|
<Tabs.Screen
|
|
name="index"
|
|
options={{
|
|
title: '直播',
|
|
tabBarIcon: ({ color }) => <Ionicons name="radio-outline" size={22} color={color} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="desk"
|
|
options={{
|
|
title: '仪表盘',
|
|
tabBarIcon: ({ color }) => <Ionicons name="grid-outline" size={22} color={color} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="network"
|
|
options={{
|
|
title: '网络',
|
|
tabBarIcon: ({ color }) => <Ionicons name="wifi-outline" size={22} color={color} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="bind"
|
|
options={{
|
|
title: '远程',
|
|
tabBarIcon: ({ color }) => <Ionicons name="phone-portrait-outline" size={22} color={color} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="system"
|
|
options={{
|
|
title: '系统',
|
|
tabBarIcon: ({ color }) => <Ionicons name="speedometer-outline" size={22} color={color} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="wechat"
|
|
options={{
|
|
href: null,
|
|
title: '微信',
|
|
tabBarIcon: ({ color }) => <Ionicons name="chatbubbles-outline" size={22} color={color} />,
|
|
}}
|
|
/>
|
|
</Tabs>
|
|
)
|
|
}
|