Theme Mode #3

This commit is contained in:
2025-09-03 17:39:57 +05:30
parent 52534f9210
commit 57439f2acb
8 changed files with 132 additions and 114 deletions

View File

@@ -82,31 +82,6 @@ class _KMobileState extends State<KMobile> {
BlocProvider<ThemeCubit>(create: (_) => ThemeCubit()),
BlocProvider<ThemeModeCubit>(create: (_) => ThemeModeCubit()),
],
// child: BlocBuilder<ThemeCubit, ThemeState>(
// builder: (context, themeState) {
// return MaterialApp(
// debugShowCheckedModeBanner: false,
// locale: _locale ?? const Locale('en'),
// supportedLocales: const [
// Locale('en'),
// Locale('hi'),
// ],
// localizationsDelegates: const [
// AppLocalizations.delegate,
// GlobalMaterialLocalizations.delegate,
// GlobalWidgetsLocalizations.delegate,
// GlobalCupertinoLocalizations.delegate,
// ],
// title: 'kMobile',
// theme: themeState.getThemeData(),
// //darkTheme: themeState.getThemeData(),
// themeMode: ThemeMode.light,
// onGenerateRoute: AppRoutes.generateRoute,
// initialRoute: AppRoutes.splash,
// home: showSplash ? const SplashScreen() : const AuthGate(),
// );
// },
// ),
child: BlocBuilder<ThemeCubit, ThemeState>(
builder: (context, themeState) {
return BlocBuilder<ThemeModeCubit, ThemeModeState>(
@@ -370,7 +345,7 @@ class _NavigationScaffoldState extends State<NavigationScaffold> {
type: BottomNavigationBarType.fixed,
backgroundColor: Theme.of(context).scaffoldBackgroundColor,
selectedItemColor: Theme.of(context).primaryColor,
unselectedItemColor: Colors.black54,
unselectedItemColor: Theme.of(context).colorScheme.onSurface.withOpacity(0.6),
onTap: (index) {
setState(() {
_selectedIndex = index;

View File

@@ -39,40 +39,83 @@ class AppThemes {
}*/
import 'dart:developer';
import 'package:flutter/material.dart';import 'theme_type.dart';
import 'package:google_fonts/google_fonts.dart';
class AppThemes {
static ThemeData getLightTheme(ThemeType type) {
static ThemeData getLightTheme(ThemeType type) {
print('inside get light theme');
final Color seedColor = _getSeedColor(type);
final colorScheme = ColorScheme.fromSeed(
seedColor: seedColor,
brightness: Brightness.light,
);
print(seedColor.toString());
return ThemeData.from(
colorScheme: colorScheme,
useMaterial3: true,
textTheme: GoogleFonts.rubikTextTheme(),
).copyWith(
scaffoldBackgroundColor: Colors.white,
bottomNavigationBarTheme: BottomNavigationBarThemeData(
backgroundColor: colorScheme.surface,
),
);
// .copyWith(
// scaffoldBackgroundColor: Colors.white,
// bottomNavigationBarTheme: BottomNavigationBarThemeData(
// backgroundColor: colorScheme.surface,
// ),
// );
}
static ThemeData getDarkTheme(ThemeType type) {
final Color seedColor = _getSeedColor(type);
final colorScheme = ColorScheme.fromSeed(
seedColor: seedColor,
brightness: Brightness.dark, // Use dark brightness
);
return ThemeData.from(
colorScheme: colorScheme,
useMaterial3: true,
textTheme: GoogleFonts.rubikTextTheme(
ThemeData(brightness: Brightness.dark).textTheme,
),
);
}
print('inside get dark theme');
final Color seedColor = _getSeedColor(type);
log(seedColor.toString());
final colorScheme = ColorScheme.fromSeed(
seedColor: seedColor,
brightness: Brightness.dark,
// Define custom background and surface colors for better contrast
// background: const Color(0xFF121212), // A common dark theme background c
// surface: const Color(0xFF1E1E1E), // A slightly lighter surface color
);
return ThemeData.from(
colorScheme: colorScheme,
useMaterial3: true,
textTheme: GoogleFonts.rubikTextTheme(
ThemeData(brightness: Brightness.dark).textTheme,
),
);
// .copyWith(
// Explicitly set scaffold background color
// scaffoldBackgroundColor: colorScheme.background,
// // Customize card theme for dark mode
// cardTheme: CardTheme(
// elevation: 2,
// color: colorScheme.surface,
// surfaceTintColor: colorScheme.surface,
// ),
// // Customize text input fields
// inputDecorationTheme: InputDecorationTheme(
// filled: true,
// fillColor: colorScheme.surface,
// border: OutlineInputBorder(
// borderRadius: BorderRadius.circular(8),
// borderSide: BorderSide.none,
// ),
// focusedBorder: OutlineInputBorder(
// borderRadius: BorderRadius.circular(8),
// borderSide: BorderSide(color: colorScheme.primary),
// ),
// ),
// Ensure icons have a contrasting color
// iconTheme: IconThemeData(color: colorScheme.onSurface),
// Adjust bottom navigation bar
// bottomNavigationBarTheme: BottomNavigationBarThemeData(
// backgroundColor: colorScheme.surface,
// selectedItemColor: colorScheme.primary,
// unselectedItemColor: colorScheme.onSurface.withOpacity(0.6),
// ),
// );
}
static Color _getSeedColor(ThemeType type) {
switch (type) {
case ThemeType.green:

View File

@@ -120,11 +120,11 @@ class LoginScreenState extends State<LoginScreen>
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
keyboardType: TextInputType.number,
@@ -149,11 +149,11 @@ class LoginScreenState extends State<LoginScreen>
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
suffixIcon: IconButton(
icon: Icon(
@@ -187,7 +187,7 @@ class LoginScreenState extends State<LoginScreen>
backgroundColor:
Theme.of(context).scaffoldBackgroundColor,
foregroundColor: Theme.of(context).primaryColorDark,
side: const BorderSide(color: Colors.black, width: 1),
side: BorderSide(color: Theme.of(context).colorScheme.outline, width: 1),
elevation: 0,
),
child: state is AuthLoading
@@ -226,7 +226,7 @@ class LoginScreenState extends State<LoginScreen>
shape: const StadiumBorder(),
padding: const EdgeInsets.symmetric(vertical: 16),
backgroundColor: Theme.of(context).primaryColorLight,
foregroundColor: Colors.black,
foregroundColor: Theme.of(context).colorScheme.onSurface,
),
child: Text(AppLocalizations.of(context).register),
),

View File

@@ -46,13 +46,13 @@ class _SplashScreenState extends State<SplashScreen> {
],
),
),
Positioned(
const Positioned(
bottom: 40,
left: 0,
right: 0,
child: Center(
child: CircularProgressIndicator(
color: Theme.of(context).scaffoldBackgroundColor),
color: Color(0xFFFFFFFF)),
),
),
],

View File

@@ -13,7 +13,7 @@ class AccountCard extends StatelessWidget {
width: 300,
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(
color: Theme.of(context).primaryColor,
color: Theme.of(context).colorScheme.onPrimary,
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(

View File

@@ -67,13 +67,13 @@ class _TransactionSuccessScreen extends State<TransactionSuccessScreen> {
const SizedBox(height: 6),
Text(
"On $transactionDate",
style: const TextStyle(fontSize: 14, color: Colors.black54),
style: TextStyle(fontSize: 14, color: Theme.of(context).colorScheme.onSurface.withOpacity(0.6)),
textAlign: TextAlign.center,
),
const SizedBox(height: 16),
Text(
"${AppLocalizations.of(context).toAccountNumber}: $creditAccount",
style: const TextStyle(fontSize: 12, color: Colors.black87),
style: TextStyle(fontSize: 12, color: Theme.of(context).colorScheme.onSurface.withOpacity(0.8)),
textAlign: TextAlign.center,
),
],
@@ -98,7 +98,7 @@ class _TransactionSuccessScreen extends State<TransactionSuccessScreen> {
backgroundColor:
Theme.of(context).scaffoldBackgroundColor,
foregroundColor: Theme.of(context).primaryColorLight,
side: const BorderSide(color: Colors.black, width: 1),
side: BorderSide(color: Theme.of(context).colorScheme.outline, width: 1),
elevation: 0,
),
),

View File

@@ -412,11 +412,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
controller: accountNumberController,
@@ -448,11 +448,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
keyboardType: TextInputType.number,
@@ -483,11 +483,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
controller: ifscController,
@@ -530,11 +530,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
items: [
@@ -562,8 +562,8 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).dialogBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(
@@ -583,8 +583,8 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).dialogBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(
@@ -643,11 +643,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).dialogBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
validator: (value) {
@@ -671,11 +671,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
textInputAction: TextInputAction.next,
@@ -693,11 +693,11 @@ class _QuickPayOutsideBankScreen extends State<QuickPayOutsideBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
controller: amountController,

View File

@@ -91,7 +91,7 @@ class _QuickPayWithinBankScreen extends State<QuickPayWithinBankScreen> {
title: Text(
AppLocalizations.of(context).quickPayOwnBank,
style:
const TextStyle(color: Colors.black, fontWeight: FontWeight.w500),
TextStyle(color: Theme.of(context).colorScheme.onSurface, fontWeight: FontWeight.w500),
),
centerTitle: false,
),
@@ -124,11 +124,11 @@ class _QuickPayWithinBankScreen extends State<QuickPayWithinBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
controller: accountNumberController,
@@ -154,11 +154,11 @@ class _QuickPayWithinBankScreen extends State<QuickPayWithinBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
keyboardType: TextInputType.number,
@@ -238,11 +238,11 @@ class _QuickPayWithinBankScreen extends State<QuickPayWithinBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
value: _selectedAccountType,
@@ -276,11 +276,11 @@ class _QuickPayWithinBankScreen extends State<QuickPayWithinBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).scaffoldBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
controller: amountController,
@@ -377,11 +377,11 @@ class _QuickPayWithinBankScreen extends State<QuickPayWithinBankScreen> {
isDense: true,
filled: true,
fillColor: Theme.of(context).dialogBackgroundColor,
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.outline),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 2),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Theme.of(context).colorScheme.primary, width: 2),
),
),
);