chore: 修复一下导航布局

This commit is contained in:
Junhui Chen 2025-08-07 19:14:46 +08:00
parent 162f3b91e4
commit fd5ea7f318
3 changed files with 19 additions and 30 deletions

View File

@ -1,5 +1,3 @@
import { HapticTab } from '@/components/HapticTab';
import AskNavbar from '@/components/layout/ask';
import { TabBarIcon } from '@/components/navigation/TabBarIcon'; import { TabBarIcon } from '@/components/navigation/TabBarIcon';
import { requestNotificationPermission } from '@/components/owner/utils'; import { requestNotificationPermission } from '@/components/owner/utils';
import TabBarBackground from '@/components/ui/TabBarBackground'; import TabBarBackground from '@/components/ui/TabBarBackground';
@ -191,25 +189,21 @@ export default function TabLayout() {
screenOptions={{ screenOptions={{
tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint, tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
headerShown: false, headerShown: false,
tabBarButton: HapticTab, tabBarShowLabel: false,
tabBarBackground: TabBarBackground, tabBarStyle: {
tabBarStyle: Platform.select({ position: 'absolute',
ios: { borderTopWidth: 0,
// Use a transparent background on iOS to show the blur effect elevation: 0,
position: 'absolute', height: Platform.OS === 'ios' ? 90 : 70,
}, },
default: {}, tabBarBackground: () => <TabBarBackground />,
}),
}} }}
> >
{/* 落地页 */} {/* 落地页 */}
<Tabs.Screen <Tabs.Screen
name="index" name="index"
options={{ options={{
title: 'Memo', href: null,
tabBarButton: () => null, // 隐藏底部标签栏
headerShown: false, // 隐藏导航栏
tabBarStyle: { display: 'none' } // 确保在标签栏中不显示
}} }}
/> />
{/* 登录 */} {/* 登录 */}
@ -260,10 +254,7 @@ export default function TabLayout() {
<Tabs.Screen <Tabs.Screen
name="ask" name="ask"
options={{ options={{
title: 'ask', href: null,
tabBarButton: () => null, // 隐藏底部标签栏
headerShown: false, // 隐藏导航栏
tabBarStyle: { display: 'none' }, // 确保在标签栏中不显示
...TransitionPresets.ShiftTransition, ...TransitionPresets.ShiftTransition,
}} }}
/> />
@ -271,10 +262,7 @@ export default function TabLayout() {
<Tabs.Screen <Tabs.Screen
name="memo-list" name="memo-list"
options={{ options={{
title: 'memo-list', href: null,
tabBarButton: () => null, // 隐藏底部标签栏
headerShown: false, // 隐藏导航栏
tabBarStyle: { display: 'none' }, // 确保在标签栏中不显示
...TransitionPresets.ShiftTransition, ...TransitionPresets.ShiftTransition,
}} }}
/> />
@ -282,10 +270,7 @@ export default function TabLayout() {
<Tabs.Screen <Tabs.Screen
name="owner" name="owner"
options={{ options={{
title: 'owner', href: null,
tabBarButton: () => null, // 隐藏底部标签栏
headerShown: false, // 隐藏导航栏
tabBarStyle: { display: 'none' }, // 确保在标签栏中不显示
...TransitionPresets.ShiftTransition, ...TransitionPresets.ShiftTransition,
}} }}
/> />
@ -377,7 +362,6 @@ export default function TabLayout() {
}} }}
/> />
</Tabs > </Tabs >
<AskNavbar wsStatus={wsStatus} />
</> </>
); );
} }

View File

@ -267,7 +267,7 @@ export default function AskScreen() {
console.log('失去焦点失败:', error); console.log('失去焦点失败:', error);
} }
Keyboard.dismiss(); Keyboard.dismiss();
router.navigate('/memo-list'); router.replace('/memo-list');
}} }}
> >
<ReturnArrow /> <ReturnArrow />

View File

@ -1,5 +1,10 @@
import React from 'react';
import { View } from 'react-native';
// This is a shim for web and Android where the tab bar is generally opaque. // This is a shim for web and Android where the tab bar is generally opaque.
export default undefined; export default function TabBarBackground() {
return <View style={{ flex: 1, backgroundColor: 'transparent' }} />;
}
export function useBottomTabOverflow() { export function useBottomTabOverflow() {
return 0; return 0;