feat(theme): 다크 테마를 레트로 RPG 스타일로 변경

- RetroColors 색상 팔레트 적용
- PressStart2P 폰트를 헤더/라벨에 적용
- 앱바, 버튼, 다이얼로그, 칩 등 전체 테마 통일
- 프로그레스 인디케이터 골드 색상 적용
This commit is contained in:
JiWoong Sul
2025-12-30 18:31:00 +09:00
parent 708148c767
commit 2677334346

View File

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
import 'package:askiineverdie/data/game_text_l10n.dart' as game_l10n;
import 'package:askiineverdie/l10n/app_localizations.dart';
import 'package:askiineverdie/src/core/audio/audio_service.dart';
import 'package:askiineverdie/src/shared/retro_colors.dart';
import 'package:askiineverdie/src/core/engine/game_mutations.dart';
import 'package:askiineverdie/src/core/engine/progress_service.dart';
import 'package:askiineverdie/src/core/engine/reward_service.dart';
@@ -102,22 +103,131 @@ class _AskiiNeverDieAppState extends State<AskiiNeverDieApp> {
useMaterial3: true,
);
/// 다크 테마 (OLED 저전력 모드 - 순수 검정)
/// 다크 테마 (레트로 RPG 스타일)
ThemeData get _darkTheme => ThemeData(
colorScheme: ColorScheme.dark(
surface: Colors.black,
primary: const Color(0xFF4FC3F7), // 시안
secondary: const Color(0xFFFF4081), // 마젠타
onSurface: Colors.white70,
primaryContainer: const Color(0xFF1A3A4A),
onPrimaryContainer: Colors.white,
),
scaffoldBackgroundColor: Colors.black,
colorScheme: RetroColors.colorScheme,
scaffoldBackgroundColor: RetroColors.deepBrown,
useMaterial3: true,
// 카드/다이얼로그도 검정 배경 사용
cardColor: const Color(0xFF121212),
dialogTheme: const DialogThemeData(
backgroundColor: Color(0xFF121212),
// 카드/다이얼로그 레트로 배경
cardColor: RetroColors.panelBg,
dialogTheme: DialogThemeData(
backgroundColor: RetroColors.panelBg,
titleTextStyle: const TextStyle(
fontFamily: 'PressStart2P',
fontSize: 12,
color: RetroColors.gold,
),
),
// 앱바 레트로 스타일
appBarTheme: AppBarTheme(
backgroundColor: RetroColors.darkBrown,
foregroundColor: RetroColors.textLight,
titleTextStyle: const TextStyle(
fontFamily: 'PressStart2P',
fontSize: 12,
color: RetroColors.gold,
),
),
// 버튼 테마
filledButtonTheme: FilledButtonThemeData(
style: FilledButton.styleFrom(
backgroundColor: RetroColors.buttonPrimary,
foregroundColor: RetroColors.textLight,
textStyle: const TextStyle(
fontFamily: 'PressStart2P',
fontSize: 10,
),
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
foregroundColor: RetroColors.gold,
side: const BorderSide(color: RetroColors.gold, width: 2),
textStyle: const TextStyle(
fontFamily: 'PressStart2P',
fontSize: 10,
),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: RetroColors.cream,
textStyle: const TextStyle(
fontFamily: 'PressStart2P',
fontSize: 10,
),
),
),
// 텍스트 테마
textTheme: const TextTheme(
headlineLarge: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 18,
color: RetroColors.gold,
),
headlineMedium: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 14,
color: RetroColors.gold,
),
headlineSmall: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 12,
color: RetroColors.gold,
),
titleLarge: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 12,
color: RetroColors.textLight,
),
titleMedium: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 10,
color: RetroColors.textLight,
),
titleSmall: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 8,
color: RetroColors.textLight,
),
bodyLarge: TextStyle(fontSize: 14, color: RetroColors.textLight),
bodyMedium: TextStyle(fontSize: 12, color: RetroColors.textLight),
bodySmall: TextStyle(fontSize: 10, color: RetroColors.textLight),
labelLarge: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 10,
color: RetroColors.textLight,
),
labelMedium: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 8,
color: RetroColors.textLight,
),
labelSmall: TextStyle(
fontFamily: 'PressStart2P',
fontSize: 6,
color: RetroColors.textLight,
),
),
// 칩 테마
chipTheme: ChipThemeData(
backgroundColor: RetroColors.panelBgLight,
labelStyle: const TextStyle(
fontFamily: 'PressStart2P',
fontSize: 8,
color: RetroColors.textLight,
),
side: const BorderSide(color: RetroColors.panelBorderInner),
),
// 리스트 타일 테마
listTileTheme: const ListTileThemeData(
textColor: RetroColors.textLight,
iconColor: RetroColors.gold,
),
// 프로그레스 인디케이터
progressIndicatorTheme: const ProgressIndicatorThemeData(
color: RetroColors.gold,
linearTrackColor: RetroColors.panelBorderOuter,
),
);