refactor(apps): 主题系统迁移至 ColorScheme + 扩展架构并支持 Dark Mode

2026-03-27 19:07:39 +08:00
parent ecc1ec6ce4
commit ae29a8209b
146 changed files with 4301 additions and 3200 deletions
@@ -4,50 +4,130 @@ import 'design_tokens.dart';
 class AppTheme {
  AppTheme._();

-  static ThemeData get light => ThemeData(
-    useMaterial3: true,
-    brightness: Brightness.light,
-    scaffoldBackgroundColor: AppColors.background,
-    colorScheme: ColorScheme.fromSeed(
-      seedColor: AppColors.primary,
-      brightness: Brightness.light,
-    ),
-    fontFamily: 'Inter',
-    appBarTheme: const AppBarTheme(
-      backgroundColor: AppColors.background,
-      foregroundColor: AppColors.slate900,
-      elevation: 0,
-    ),
-    elevatedButtonTheme: ElevatedButtonThemeData(
-      style: ElevatedButton.styleFrom(
-        backgroundColor: AppColors.primary,
-        foregroundColor: AppColors.primaryForeground,
+  static ThemeData get light => _buildTheme(Brightness.light);
+  static ThemeData get dark => _buildTheme(Brightness.dark);
+
+  static ThemeData _buildTheme(Brightness brightness) {
+    final ColorScheme colorScheme;
+    if (brightness == Brightness.dark) {
+      colorScheme = ColorScheme(
+        brightness: Brightness.dark,
+        primary: const Color(0xFF60A5FA),
+        onPrimary: const Color(0xFFFFFFFF),
+        primaryContainer: const Color(0xFF1E3A5F),
+        onPrimaryContainer: const Color(0xFFBFDBFE),
+        secondary: const Color(0xFF93C5FD),
+        onSecondary: const Color(0xFF0F172A),
+        secondaryContainer: const Color(0xFF1E293B),
+        onSecondaryContainer: const Color(0xFFBFDBFE),
+        tertiary: const Color(0xFFC4B5FD),
+        onTertiary: const Color(0xFF0F172A),
+        tertiaryContainer: const Color(0xFF4C1D95),
+        onTertiaryContainer: const Color(0xFFE9D5FF),
+        error: const Color(0xFFD14343),
+        onError: const Color(0xFFFFFFFF),
+        errorContainer: const Color(0xFF7F1D1D),
+        onErrorContainer: const Color(0xFFFEE2E2),
+        surface: const Color(0xFF0F172A),
+        onSurface: const Color(0xFFE2E8F0),
+        surfaceContainerLowest: const Color(0xFF0F172A),
+        surfaceContainerLow: const Color(0xFF1E293B),
+        surfaceContainer: const Color(0xFF334155),
+        surfaceContainerHigh: const Color(0xFF475569),
+        surfaceContainerHighest: const Color(0xFF64748B),
+        onSurfaceVariant: const Color(0xFF94A3B8),
+        outline: const Color(0xFF64748B),
+        outlineVariant: const Color(0xFF475569),
+        shadow: Colors.black,
+        scrim: Colors.black,
+        inverseSurface: const Color(0xFFE2E8F0),
+        onInverseSurface: const Color(0xFF1E293B),
+        inversePrimary: const Color(0xFF2563EB),
+      );
+    } else {
+      colorScheme = ColorScheme(
+        brightness: Brightness.light,
+        primary: const Color(0xFF3B82F6),
+        onPrimary: const Color(0xFFFAFAFA),
+        primaryContainer: const Color(0xFFDBEAFE),
+        onPrimaryContainer: const Color(0xFF0F172A),
+        secondary: const Color(0xFF2563EB),
+        onSecondary: const Color(0xFFFFFFFF),
+        secondaryContainer: const Color(0xFFDBEAFE),
+        onSecondaryContainer: const Color(0xFF1E293B),
+        tertiary: const Color(0xFF8B5CF6),
+        onTertiary: const Color(0xFFFFFFFF),
+        tertiaryContainer: const Color(0xFFF5F3FF),
+        onTertiaryContainer: const Color(0xFF0F172A),
+        error: const Color(0xFFEF4444),
+        onError: const Color(0xFFFFFFFF),
+        errorContainer: const Color(0xFFFEE2E2),
+        onErrorContainer: const Color(0xFF7F1D1D),
+        surface: const Color(0xFFFFFFFF),
+        onSurface: const Color(0xFF0F172A),
+        surfaceContainerLowest: const Color(0xFFFFFFFF),
+        surfaceContainerLow: const Color(0xFFF8FAFC),
+        surfaceContainer: const Color(0xFFF1F5F9),
+        surfaceContainerHigh: const Color(0xFFE2E8F0),
+        surfaceContainerHighest: const Color(0xFFCBD5E1),
+        onSurfaceVariant: const Color(0xFF475569),
+        outline: const Color(0xFF94A3B8),
+        outlineVariant: const Color(0xFFCBD5E1),
+        shadow: const Color(0xFF0F172A),
+        scrim: const Color(0xFF0F172A),
+        inverseSurface: const Color(0xFF1E293B),
+        onInverseSurface: const Color(0xFFF1F5F9),
+        inversePrimary: const Color(0xFF60A5FA),
+      );
+    }
+
+    final themeExtension = brightness == Brightness.dark
+        ? AppColorPalette.dark
+        : AppColorPalette.light;
+
+    return ThemeData(
+      useMaterial3: true,
+      brightness: brightness,
+      colorScheme: colorScheme,
+      scaffoldBackgroundColor: colorScheme.surface,
+      fontFamily: 'Inter',
+      extensions: [themeExtension],
+      appBarTheme: AppBarTheme(
+        backgroundColor: colorScheme.surface,
+        foregroundColor: colorScheme.onSurface,
        elevation: 0,
-        shape: RoundedRectangleBorder(
-          borderRadius: BorderRadius.circular(AppRadius.sm),
+      ),
+      elevatedButtonTheme: ElevatedButtonThemeData(
+        style: ElevatedButton.styleFrom(
+          backgroundColor: colorScheme.primary,
+          foregroundColor: colorScheme.onPrimary,
+          elevation: 0,
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppRadius.sm),
+          ),
        ),
      ),
-    ),
-    inputDecorationTheme: InputDecorationTheme(
-      filled: true,
-      fillColor: AppColors.background,
-      contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
-      border: OutlineInputBorder(
-        borderRadius: BorderRadius.circular(AppRadius.sm),
-        borderSide: const BorderSide(color: AppColors.input),
+      inputDecorationTheme: InputDecorationTheme(
+        filled: true,
+        fillColor: colorScheme.surface,
+        contentPadding: const EdgeInsets.symmetric(
+          horizontal: 12,
+          vertical: 10,
+        ),
+        border: OutlineInputBorder(
+          borderRadius: BorderRadius.circular(AppRadius.sm),
+          borderSide: BorderSide(color: colorScheme.outlineVariant),
+        ),
+        enabledBorder: OutlineInputBorder(
+          borderRadius: BorderRadius.circular(AppRadius.sm),
+          borderSide: BorderSide(color: colorScheme.outlineVariant),
+        ),
+        focusedBorder: OutlineInputBorder(
+          borderRadius: BorderRadius.circular(AppRadius.sm),
+          borderSide: BorderSide(color: colorScheme.primary),
+        ),
+        hintStyle: TextStyle(color: colorScheme.onSurfaceVariant, fontSize: 14),
      ),
-      enabledBorder: OutlineInputBorder(
-        borderRadius: BorderRadius.circular(AppRadius.sm),
-        borderSide: const BorderSide(color: AppColors.input),
-      ),
-      focusedBorder: OutlineInputBorder(
-        borderRadius: BorderRadius.circular(AppRadius.sm),
-        borderSide: const BorderSide(color: AppColors.input),
-      ),
-      hintStyle: const TextStyle(
-        color: AppColors.mutedForeground,
-        fontSize: 14,
-      ),
-    ),
-  );
+    );
+  }
 }