fix: bug

app/(tabs)/video.tsx

@@ -15,6 +15,7 @@ import { SafeAreaView } from 'react-native-safe-area-context'
 import { Image, ImageLoadEventData } from 'expo-image'
 import { useTranslation } from 'react-i18next'
 import { Ionicons } from '@expo/vector-icons'
+import { PanGestureHandler } from 'react-native-gesture-handler'
 
 import { SameStyleIcon, WhiteStarIcon } from '@/components/icon'
 import { useRouter } from 'expo-router'
@@ -22,6 +23,7 @@ import { useTemplates, type TemplateDetail } from '@/hooks'
 import { VideoSocialButton } from '@/components/blocks/ui/VideoSocialButton'
 import { useTemplateLike } from '@/hooks/use-template-like'
 import { useTemplateFavorite } from '@/hooks/use-template-favorite'
+import { useSwipeNavigation } from '@/hooks/use-swipe-navigation'
 import {
   useTemplateSocialStore,
   useTemplateLiked,
@@ -219,6 +221,7 @@ export const VideoItem = memo(({ item, videoHeight }: { item: TemplateDetail; vi
 })
 
 export default function VideoScreen() {
+    const router = useRouter()
     const flatListRef = useRef<FlatList>(null)
     const videoHeight = screenHeight - TAB_BAR_HEIGHT
     const PAGE_SIZE = 10 // 每页10个数据
@@ -247,6 +250,21 @@ export default function VideoScreen() {
         loadMore()
     }, [hasMore, loading, loadMore, templates.length])
 
+    // 左右滑动切换底部 Tab 导航
+    // 视频页是第二个 Tab (index=1)，左滑去消息页，右滑去首页
+    const handleSwipeLeft = useCallback(() => {
+        router.push('/(tabs)/message')
+    }, [router])
+
+    const handleSwipeRight = useCallback(() => {
+        router.push('/(tabs)/')
+    }, [router])
+
+    const { handleGestureEvent, handleGestureStateChange } = useSwipeNavigation({
+        onSwipeLeft: handleSwipeLeft,
+        onSwipeRight: handleSwipeRight,
+    })
+
     const renderItem = useCallback(({ item }: { item: TemplateDetail }) => (
         <VideoItem item={item} videoHeight={videoHeight} />
     ), [videoHeight])
@@ -310,24 +328,32 @@ export default function VideoScreen() {
 
     return (
         <Layout>
-            <FlatList
-                ref={flatListRef}
-                data={filteredTemplates}
-                renderItem={renderItem}
-                keyExtractor={keyExtractor}
-                getItemLayout={getItemLayout}
-                pagingEnabled
-                showsVerticalScrollIndicator={false}
-                snapToInterval={videoHeight}
-                snapToAlignment="start"
-                decelerationRate="fast"
-                onEndReached={handleLoadMore}
-                onEndReachedThreshold={0.1}
-                ListFooterComponent={loading ? <PaginationLoader color="#FFE500" /> : null}
-                maxToRenderPerBatch={5}
-                windowSize={7}
-                initialNumToRender={3}
-            />
+            <PanGestureHandler
+                onGestureEvent={handleGestureEvent}
+                onHandlerStateChange={handleGestureStateChange}
+                activeOffsetX={[-20, 20]}
+            >
+                <View style={styles.gestureContainer}>
+                    <FlatList
+                        ref={flatListRef}
+                        data={filteredTemplates}
+                        renderItem={renderItem}
+                        keyExtractor={keyExtractor}
+                        getItemLayout={getItemLayout}
+                        pagingEnabled
+                        showsVerticalScrollIndicator={false}
+                        snapToInterval={videoHeight}
+                        snapToAlignment="start"
+                        decelerationRate="fast"
+                        onEndReached={handleLoadMore}
+                        onEndReachedThreshold={0.1}
+                        ListFooterComponent={loading ? <PaginationLoader color="#FFE500" /> : null}
+                        maxToRenderPerBatch={5}
+                        windowSize={7}
+                        initialNumToRender={3}
+                    />
+                </View>
+            </PanGestureHandler>
         </Layout>
     )
 }
@@ -337,6 +363,9 @@ const styles = StyleSheet.create({
         flex: 1,
         backgroundColor: '#090A0B',
     },
+    gestureContainer: {
+        flex: 1,
+    },
     centerContainer: {
         flex: 1,
         alignItems: 'center',