feat(Theme): enhance theming and UI consistency across components

- Updated app.json to set userInterfaceStyle to automatic for improved theme adaptability.
- Refactored layout components to utilize useAppColors for dynamic theming, ensuring consistent color usage.
- Introduced SystemChrome component to manage system UI background color based on theme.
- Enhanced TabsLayout, ProfileStackLayout, and other components to leverage new theming structure.
- Improved QRCodeScanner, SearchBar, and CommentItem styles to align with the updated theme system.
- Consolidated styles in SystemMessageItem and TabBar for better maintainability and visual coherence.

src/screens/home/PostDetailScreen.tsx

@@ -26,7 +26,13 @@ import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useNavigation, useRouter, useLocalSearchParams } from 'expo-router';
 import { MaterialCommunityIcons } from '@expo/vector-icons';
 import * as ImagePicker from 'expo-image-picker';
-import { colors, spacing, fontSizes, borderRadius } from '../../theme';
+import {
+  spacing,
+  fontSizes,
+  borderRadius,
+  useAppColors,
+  type AppColors,
+} from '../../theme';
 import { Post, Comment, VoteResultDTO } from '../../types';
 import { useUserStore } from '../../stores';
 import { useCurrentUser } from '../../stores/authStore';
@@ -39,6 +45,8 @@ import { useResponsive, useResponsiveValue, useResponsiveSpacing } from '../../h
 import * as hrefs from '../../navigation/hrefs';
 
 export const PostDetailScreen: React.FC = () => {
+  const colors = useAppColors();
+  const styles = useMemo(() => createPostDetailStyles(colors), [colors]);
   const navigation = useNavigation();
   const router = useRouter();
   const insets = useSafeAreaInsets();
@@ -290,6 +298,9 @@ export const PostDetailScreen: React.FC = () => {
     };
     
     navigation.setOptions({
+      // 与页面容器 background.default 一致，并去掉原生 header 底部分隔阴影，避免「一条线」
+      headerStyle: { backgroundColor: colors.background.default },
+      headerShadowVisible: false,
       headerBackVisible: false,
       headerTitleAlign: 'left',
       headerLeft: () => (
@@ -324,7 +335,7 @@ export const PostDetailScreen: React.FC = () => {
         </View>
       ),
     });
-  }, [post?.author, isFollowing, isFollowingMe, isFollowLoading, navigation]);
+  }, [post?.author, isFollowing, isFollowingMe, isFollowLoading, navigation, colors.background.default, styles]);
 
   // 监听键盘事件
   useEffect(() => {
@@ -1702,7 +1713,8 @@ export const PostDetailScreen: React.FC = () => {
   );
 };
 
-const styles = StyleSheet.create({
+function createPostDetailStyles(colors: AppColors) {
+  return StyleSheet.create({
   flex: {
     flex: 1,
   },
@@ -2124,4 +2136,5 @@ const styles = StyleSheet.create({
     textAlign: 'center',
     paddingVertical: spacing.md,
   },
-});
+  });
+}