388 lines
12 KiB
Dart
388 lines
12 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
|
|
class AppTheme {
|
|
// Brand Colors
|
|
static const Color primaryGreen = Color(0xFF2E7D32);
|
|
static const Color primaryGold = Color(0xFFFFD700);
|
|
static const Color accentBlue = Color(0xFF1976D2);
|
|
static const Color accentOrange = Color(0xFFF57C00);
|
|
static const Color accentRed = Color(0xFFD32F2F);
|
|
|
|
// Light Theme Colors
|
|
static const Color lightBackground = Color(0xFFFAFAFA);
|
|
static const Color lightSurface = Color(0xFFFFFFFF);
|
|
static const Color lightPrimary = primaryGreen;
|
|
static const Color lightOnPrimary = Color(0xFFFFFFFF);
|
|
|
|
// Dark Theme Colors
|
|
static const Color darkBackground = Color(0xFF121212);
|
|
static const Color darkSurface = Color(0xFF1E1E1E);
|
|
static const Color darkPrimary = Color(0xFF4CAF50);
|
|
static const Color darkOnPrimary = Color(0xFF000000);
|
|
|
|
/// Light Theme
|
|
static ThemeData get lightTheme {
|
|
return ThemeData(
|
|
useMaterial3: true,
|
|
brightness: Brightness.light,
|
|
primaryColor: lightPrimary,
|
|
scaffoldBackgroundColor: lightBackground,
|
|
|
|
// Color Scheme
|
|
colorScheme: const ColorScheme.light(
|
|
primary: lightPrimary,
|
|
secondary: accentBlue,
|
|
tertiary: accentOrange,
|
|
error: accentRed,
|
|
surface: lightSurface,
|
|
onPrimary: lightOnPrimary,
|
|
onSecondary: Colors.white,
|
|
onSurface: Color(0xFF212121),
|
|
onError: Colors.white,
|
|
),
|
|
|
|
// AppBar Theme
|
|
appBarTheme: AppBarTheme(
|
|
elevation: 2,
|
|
centerTitle: false,
|
|
backgroundColor: lightPrimary,
|
|
foregroundColor: Colors.white,
|
|
titleTextStyle: TextStyle(
|
|
fontSize: 18.sp,
|
|
fontWeight: FontWeight.w600,
|
|
color: Colors.white,
|
|
),
|
|
iconTheme: IconThemeData(
|
|
color: Colors.white,
|
|
size: 24.w,
|
|
),
|
|
),
|
|
|
|
// Card Theme
|
|
cardTheme: CardThemeData(
|
|
elevation: 2,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
color: lightSurface,
|
|
margin: EdgeInsets.symmetric(horizontal: 8.w, vertical: 4.h),
|
|
),
|
|
|
|
// Elevated Button Theme
|
|
elevatedButtonTheme: ElevatedButtonThemeData(
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: lightPrimary,
|
|
foregroundColor: lightOnPrimary,
|
|
elevation: 2,
|
|
padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 12.h),
|
|
textStyle: TextStyle(
|
|
fontSize: 16.sp,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
),
|
|
),
|
|
),
|
|
|
|
// Outlined Button Theme
|
|
outlinedButtonTheme: OutlinedButtonThemeData(
|
|
style: OutlinedButton.styleFrom(
|
|
foregroundColor: lightPrimary,
|
|
side: BorderSide(color: lightPrimary, width: 2),
|
|
padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 12.h),
|
|
textStyle: TextStyle(
|
|
fontSize: 16.sp,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
),
|
|
),
|
|
),
|
|
|
|
// Text Button Theme
|
|
textButtonTheme: TextButtonThemeData(
|
|
style: TextButton.styleFrom(
|
|
foregroundColor: lightPrimary,
|
|
padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 8.h),
|
|
textStyle: TextStyle(
|
|
fontSize: 16.sp,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
),
|
|
|
|
// Input Decoration Theme
|
|
inputDecorationTheme: InputDecorationTheme(
|
|
filled: true,
|
|
fillColor: Colors.grey.shade50,
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: BorderSide(color: Colors.grey.shade300),
|
|
),
|
|
enabledBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: BorderSide(color: Colors.grey.shade300),
|
|
),
|
|
focusedBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: const BorderSide(color: lightPrimary, width: 2),
|
|
),
|
|
errorBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: const BorderSide(color: accentRed, width: 2),
|
|
),
|
|
contentPadding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h),
|
|
),
|
|
|
|
// Icon Theme
|
|
iconTheme: IconThemeData(
|
|
color: Colors.grey.shade700,
|
|
size: 24.w,
|
|
),
|
|
|
|
// Floating Action Button Theme
|
|
floatingActionButtonTheme: FloatingActionButtonThemeData(
|
|
backgroundColor: lightPrimary,
|
|
foregroundColor: lightOnPrimary,
|
|
elevation: 4,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
),
|
|
|
|
// Bottom Navigation Bar Theme
|
|
bottomNavigationBarTheme: BottomNavigationBarThemeData(
|
|
backgroundColor: lightSurface,
|
|
selectedItemColor: lightPrimary,
|
|
unselectedItemColor: Colors.grey.shade600,
|
|
selectedLabelStyle: TextStyle(fontSize: 12.sp, fontWeight: FontWeight.w600),
|
|
unselectedLabelStyle: TextStyle(fontSize: 12.sp),
|
|
type: BottomNavigationBarType.fixed,
|
|
elevation: 8,
|
|
),
|
|
|
|
// Divider Theme
|
|
dividerTheme: DividerThemeData(
|
|
color: Colors.grey.shade300,
|
|
thickness: 1,
|
|
space: 1,
|
|
),
|
|
|
|
// Chip Theme
|
|
chipTheme: ChipThemeData(
|
|
backgroundColor: Colors.grey.shade200,
|
|
selectedColor: lightPrimary.withOpacity(0.2),
|
|
labelStyle: TextStyle(fontSize: 14.sp),
|
|
padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 8.h),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
),
|
|
|
|
// Dialog Theme
|
|
dialogTheme: DialogThemeData(
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
elevation: 4,
|
|
),
|
|
|
|
// Snackbar Theme
|
|
snackBarTheme: SnackBarThemeData(
|
|
backgroundColor: Colors.grey.shade800,
|
|
contentTextStyle: TextStyle(fontSize: 14.sp, color: Colors.white),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
),
|
|
behavior: SnackBarBehavior.floating,
|
|
),
|
|
);
|
|
}
|
|
|
|
/// Dark Theme
|
|
static ThemeData get darkTheme {
|
|
return ThemeData(
|
|
useMaterial3: true,
|
|
brightness: Brightness.dark,
|
|
primaryColor: darkPrimary,
|
|
scaffoldBackgroundColor: darkBackground,
|
|
|
|
// Color Scheme
|
|
colorScheme: const ColorScheme.dark(
|
|
primary: darkPrimary,
|
|
secondary: accentBlue,
|
|
tertiary: accentOrange,
|
|
error: accentRed,
|
|
surface: darkSurface,
|
|
onPrimary: darkOnPrimary,
|
|
onSecondary: Colors.white,
|
|
onSurface: Color(0xFFE0E0E0),
|
|
onError: Colors.white,
|
|
),
|
|
|
|
// AppBar Theme
|
|
appBarTheme: AppBarTheme(
|
|
elevation: 0,
|
|
centerTitle: false,
|
|
backgroundColor: darkSurface,
|
|
foregroundColor: Colors.white,
|
|
titleTextStyle: TextStyle(
|
|
fontSize: 18.sp,
|
|
fontWeight: FontWeight.w600,
|
|
color: Colors.white,
|
|
),
|
|
iconTheme: IconThemeData(
|
|
color: Colors.white,
|
|
size: 24.w,
|
|
),
|
|
),
|
|
|
|
// Card Theme
|
|
cardTheme: CardThemeData(
|
|
elevation: 4,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
color: darkSurface,
|
|
margin: EdgeInsets.symmetric(horizontal: 8.w, vertical: 4.h),
|
|
),
|
|
|
|
// Elevated Button Theme
|
|
elevatedButtonTheme: ElevatedButtonThemeData(
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: darkPrimary,
|
|
foregroundColor: darkOnPrimary,
|
|
elevation: 2,
|
|
padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 12.h),
|
|
textStyle: TextStyle(
|
|
fontSize: 16.sp,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
),
|
|
),
|
|
),
|
|
|
|
// Outlined Button Theme
|
|
outlinedButtonTheme: OutlinedButtonThemeData(
|
|
style: OutlinedButton.styleFrom(
|
|
foregroundColor: darkPrimary,
|
|
side: BorderSide(color: darkPrimary, width: 2),
|
|
padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 12.h),
|
|
textStyle: TextStyle(
|
|
fontSize: 16.sp,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
),
|
|
),
|
|
),
|
|
|
|
// Text Button Theme
|
|
textButtonTheme: TextButtonThemeData(
|
|
style: TextButton.styleFrom(
|
|
foregroundColor: darkPrimary,
|
|
padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 8.h),
|
|
textStyle: TextStyle(
|
|
fontSize: 16.sp,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
),
|
|
|
|
// Input Decoration Theme
|
|
inputDecorationTheme: InputDecorationTheme(
|
|
filled: true,
|
|
fillColor: const Color(0xFF2C2C2C),
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: const BorderSide(color: Color(0xFF424242)),
|
|
),
|
|
enabledBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: const BorderSide(color: Color(0xFF424242)),
|
|
),
|
|
focusedBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: const BorderSide(color: darkPrimary, width: 2),
|
|
),
|
|
errorBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
borderSide: const BorderSide(color: accentRed, width: 2),
|
|
),
|
|
contentPadding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h),
|
|
),
|
|
|
|
// Icon Theme
|
|
iconTheme: IconThemeData(
|
|
color: Colors.grey.shade400,
|
|
size: 24.w,
|
|
),
|
|
|
|
// Floating Action Button Theme
|
|
floatingActionButtonTheme: FloatingActionButtonThemeData(
|
|
backgroundColor: darkPrimary,
|
|
foregroundColor: darkOnPrimary,
|
|
elevation: 4,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
),
|
|
|
|
// Bottom Navigation Bar Theme
|
|
bottomNavigationBarTheme: BottomNavigationBarThemeData(
|
|
backgroundColor: darkSurface,
|
|
selectedItemColor: darkPrimary,
|
|
unselectedItemColor: Colors.grey.shade500,
|
|
selectedLabelStyle: TextStyle(fontSize: 12.sp, fontWeight: FontWeight.w600),
|
|
unselectedLabelStyle: TextStyle(fontSize: 12.sp),
|
|
type: BottomNavigationBarType.fixed,
|
|
elevation: 8,
|
|
),
|
|
|
|
// Divider Theme
|
|
dividerTheme: const DividerThemeData(
|
|
color: Color(0xFF424242),
|
|
thickness: 1,
|
|
space: 1,
|
|
),
|
|
|
|
// Chip Theme
|
|
chipTheme: ChipThemeData(
|
|
backgroundColor: const Color(0xFF2C2C2C),
|
|
selectedColor: darkPrimary.withOpacity(0.2),
|
|
labelStyle: TextStyle(fontSize: 14.sp, color: Colors.white),
|
|
padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 8.h),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
),
|
|
|
|
// Dialog Theme
|
|
dialogTheme: DialogThemeData(
|
|
backgroundColor: darkSurface,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16.r),
|
|
),
|
|
elevation: 4,
|
|
),
|
|
|
|
// Snackbar Theme
|
|
snackBarTheme: SnackBarThemeData(
|
|
backgroundColor: const Color(0xFF323232),
|
|
contentTextStyle: TextStyle(fontSize: 14.sp, color: Colors.white),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12.r),
|
|
),
|
|
behavior: SnackBarBehavior.floating,
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|