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/create/CreatePostScreen.tsx

@@ -7,7 +7,7 @@
  * 投票编辑器在宽屏下优化布局
  */
 
-import React, { useState, useCallback } from 'react';
+import React, { useState, useCallback, useMemo } from 'react';
 import {
   View,
   ScrollView,
@@ -25,7 +25,14 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 import { useRouter, useLocalSearchParams, useNavigation } from 'expo-router';
 import { MaterialCommunityIcons } from '@expo/vector-icons';
 import * as ImagePicker from 'expo-image-picker';
-import { colors, spacing, fontSizes, borderRadius, shadows } from '../../theme';
+import {
+  spacing,
+  fontSizes,
+  borderRadius,
+  shadows,
+  useAppColors,
+  type AppColors,
+} from '../../theme';
 import { Text, ResponsiveContainer } from '../../components/common';
 import { channelService, postService, showPrompt, voteService } from '../../services';
 import { ApiError } from '../../services/api';
@@ -84,6 +91,8 @@ const getPublishErrorMessage = (error: unknown): string => {
 };
 
 export const CreatePostScreen: React.FC<CreatePostScreenProps> = (props) => {
+  const colors = useAppColors();
+  const styles = useMemo(() => createCreatePostStyles(colors), [colors]);
   const { onClose } = props;
   const router = useRouter();
   const navigation = useNavigation();
@@ -805,7 +814,8 @@ export const CreatePostScreen: React.FC<CreatePostScreenProps> = (props) => {
   );
 };
 
-const styles = StyleSheet.create({
+function createCreatePostStyles(colors: AppColors) {
+  return StyleSheet.create({
   flex: {
     flex: 1,
   },
@@ -1050,6 +1060,7 @@ const styles = StyleSheet.create({
   loadingText: {
     fontSize: fontSizes.md,
   },
-});
+  });
+}
 
 export default CreatePostScreen;