Skip to content

Commit

Permalink
Merge pull request #87 from CodewithAnn/feature/theme-toggle
Browse files Browse the repository at this point in the history
added toggle button to toggle b/w light and dark theme
  • Loading branch information
prajapatihet authored Oct 20, 2024
2 parents 671d326 + 29ac96d commit ca5017c
Show file tree
Hide file tree
Showing 8 changed files with 191 additions and 47 deletions.
19 changes: 19 additions & 0 deletions lib/cubit/theme_toggle/theme_cubit.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

class ThemeCubit extends Cubit<ThemeMode> {
ThemeCubit() : super(ThemeMode.system);

// void initialTheme() {
// emit(ThemeMode.system);
// }

void switchTheme(bool currentValue) {
if (currentValue) {
emit(ThemeMode.dark);
} else {
emit(ThemeMode.light);
}
// emit(ThemeMode.system);
}
}
9 changes: 9 additions & 0 deletions lib/cubit/theme_toggle/value_cubit.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import 'package:flutter_bloc/flutter_bloc.dart';

class ValueCubit extends Cubit<bool> {
ValueCubit() : super(false);

void changeValue(bool value) {
emit(value);
}
}
51 changes: 33 additions & 18 deletions lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@ import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:donorconnect/cubit/auth/auth_cubit.dart';
import 'package:donorconnect/cubit/locate_blood_banks/locate_blood_banks_cubit.dart';
import 'package:donorconnect/cubit/profile/profile_cubit.dart';
import 'package:donorconnect/cubit/theme_toggle/theme_cubit.dart';
import 'package:donorconnect/cubit/theme_toggle/value_cubit.dart';
import 'package:donorconnect/firebase_options.dart';
import 'package:donorconnect/language/cubit/language_cubit.dart';
import 'package:donorconnect/language/helper/language.dart';
Expand Down Expand Up @@ -59,25 +61,38 @@ class MyApp extends StatelessWidget {
BlocProvider(
create: (context) => LanguageCubit()..initilize(),
),
BlocProvider(
create: (context) => ThemeCubit(),
),
BlocProvider(
create: (context) => ValueCubit(),
),
],
child: BlocBuilder<LanguageCubit, Language>(
builder: (context, languageState) {
return MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
locale: Locale(languageState.languageCode),
debugShowCheckedModeBanner: false,
// Main route selection
home: (token != null && !JwtDecoder.isExpired(token!))
? HomePage(token: token!)
: const FrontPage(),
// You can add routes for the verification form
routes: {
'/verification': (context) =>
const VerificationForm(), // Add route for verification form
},
);
}),
child: BlocBuilder<ThemeCubit, ThemeMode>(
builder: (context, themeState) {
return BlocBuilder<LanguageCubit, Language>(
builder: (context, languageState) {
return MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
locale: Locale(languageState.languageCode),
//theme
themeMode: themeState,
darkTheme: ThemeData.dark(),
debugShowCheckedModeBanner: false,
// Main route selection
home: (token != null && !JwtDecoder.isExpired(token!))
? HomePage(token: token!)
: const FrontPage(),
// You can add routes for the verification form
routes: {
'/verification': (context) =>
const VerificationForm(), // Add route for verification form
},
);
});
},
),
);
}
}
77 changes: 77 additions & 0 deletions lib/views/common_widgets/toggle_button.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
import 'package:animated_toggle_switch/animated_toggle_switch.dart';
import 'package:donorconnect/cubit/theme_toggle/theme_cubit.dart';
import 'package:donorconnect/cubit/theme_toggle/value_cubit.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

class ThemeToggleButton extends StatelessWidget {
const ThemeToggleButton({super.key, required this.switchValue});
final bool switchValue;

@override
Widget build(BuildContext context) {
return BlocBuilder<ThemeCubit, ThemeMode>(
builder: (context, Themestate) {
// final x =0;
return Padding(
padding: const EdgeInsets.only(left: 8.0, right: 8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
"Change App Theme",
style: TextStyle(fontSize: 20),
),
SizedBox(
height: 42,
width: 140,
child: AnimatedToggleSwitch.dual(
current: switchValue,
// values: [false, true],
first: false,
second: true,
height: 40,
onChanged: (value) {
context.read<ValueCubit>().changeValue(value);
//
context.read<ThemeCubit>().switchTheme(value);
},
styleBuilder: (value) => ToggleStyle(
indicatorColor:
value ? Colors.purple.shade300 : Colors.yellow,
backgroundGradient: value
? const LinearGradient(
colors: [Colors.purpleAccent, Colors.deepPurple])
: LinearGradient(colors: [
Colors.yellow.shade300,
Colors.yellow.shade900
]),
),
iconBuilder: (value) => value
? const Icon(
Icons.nights_stay_rounded,
color: Colors.white,
)
: const Icon(
Icons.sunny,
color: Colors.black,
),
textBuilder: (value) => value
? const Center(
child: Text(
"Dark Mode",
style: TextStyle(color: Colors.white),
),
)
: const Center(
child: Text("Light Mode"),
),
),
)
],
),
);
},
);
}
}
67 changes: 40 additions & 27 deletions lib/views/pages/profile/profile_screen.dart
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
import 'package:donorconnect/cubit/auth/auth_cubit.dart';
import 'package:donorconnect/cubit/profile/profile_cubit.dart';
import 'package:donorconnect/cubit/profile/profile_state.dart';
import 'package:donorconnect/cubit/theme_toggle/value_cubit.dart';
import 'package:donorconnect/language/helper/language_extention.dart';
import 'package:donorconnect/views/common_widgets/toggle_button.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

Expand Down Expand Up @@ -77,11 +79,11 @@ class _ProfileScreenState extends State<ProfileScreen> {
// Medical History
TextFormField(
initialValue: state.medicalHistory,
decoration:
InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(9))),
labelText: _text.medical_history,
),
decoration: InputDecoration(
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(9))),
labelText: _text.medical_history,
),
onChanged: (value) => context
.read<ProfileCubit>()
.updateMedicalHistory(value),
Expand All @@ -91,25 +93,26 @@ class _ProfileScreenState extends State<ProfileScreen> {
// Current Medications
TextFormField(
initialValue: state.currentMedications,
decoration:
InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(9))),
labelText: _text.current_medications,
),
decoration: InputDecoration(
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(9))),
labelText: _text.current_medications,
),
onChanged: (value) => context
.read<ProfileCubit>()
.updateCurrentMedications(value),
),

const SizedBox(height: 16),

// Allergies
TextFormField(
initialValue: state.allergies,
decoration: InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(9))),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(9))),
labelText: _text.allergies,
),
),
onChanged: (value) =>
context.read<ProfileCubit>().updateAllergies(value),
),
Expand All @@ -132,9 +135,10 @@ class _ProfileScreenState extends State<ProfileScreen> {
context.read<ProfileCubit>().updateBloodType(value ?? '');
},
decoration: InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(9))),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(9))),
labelText: _text.blood_type,
),
),
),
const SizedBox(height: 16),

Expand Down Expand Up @@ -169,17 +173,27 @@ class _ProfileScreenState extends State<ProfileScreen> {
context.read<ProfileCubit>().toggleNotifications(value);
},
),
const SizedBox(height: 16),
// theme-toggle button
BlocBuilder<ValueCubit, bool>(
builder: (context, currentValuestate) {
final switchValue = currentValuestate;
// print("Current Value of switch:::$switchValue");
return ThemeToggleButton(
switchValue: switchValue,
);
},
),
const SizedBox(height: 24),

// Save Button
ElevatedButton(
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30),
),
backgroundColor: Theme.of(context).colorScheme.primary,
padding: const EdgeInsets.fromLTRB(112, 10, 140, 15),
),
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30),
),
backgroundColor: Theme.of(context).colorScheme.primary,
padding: const EdgeInsets.fromLTRB(112, 10, 140, 15),
),
onPressed: () async {
if (_formKey.currentState!.validate()) {
// Save the profile using userId
Expand All @@ -194,11 +208,10 @@ class _ProfileScreenState extends State<ProfileScreen> {
child: Text(
_text.save_profile,
style: TextStyle(
color: Theme.of(context).colorScheme.onPrimary,
fontWeight: FontWeight.bold,
),
color: Theme.of(context).colorScheme.onPrimary,
fontWeight: FontWeight.bold,
),
),

),
],
),
Expand Down
2 changes: 2 additions & 0 deletions macos/Flutter/GeneratedPluginRegistrant.swift
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import firebase_auth
import firebase_core
import firebase_storage
import geolocator_apple
import google_sign_in_ios
import path_provider_foundation
import shared_preferences_foundation
import url_launcher_macos
Expand All @@ -22,6 +23,7 @@ func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) {
FLTFirebaseCorePlugin.register(with: registry.registrar(forPlugin: "FLTFirebaseCorePlugin"))
FLTFirebaseStoragePlugin.register(with: registry.registrar(forPlugin: "FLTFirebaseStoragePlugin"))
GeolocatorPlugin.register(with: registry.registrar(forPlugin: "GeolocatorPlugin"))
FLTGoogleSignInPlugin.register(with: registry.registrar(forPlugin: "FLTGoogleSignInPlugin"))
PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin"))
SharedPreferencesPlugin.register(with: registry.registrar(forPlugin: "SharedPreferencesPlugin"))
UrlLauncherPlugin.register(with: registry.registrar(forPlugin: "UrlLauncherPlugin"))
Expand Down
12 changes: 10 additions & 2 deletions pubspec.lock
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "6.7.0"
animated_toggle_switch:
dependency: "direct main"
description:
name: animated_toggle_switch
sha256: "786e82be3b004100299c1c6d023f8f1928decc8353a6fdff191bf78c866262fa"
url: "https://pub.dev"
source: hosted
version: "0.8.3"
ansicolor:
dependency: transitive
description:
Expand Down Expand Up @@ -1323,10 +1331,10 @@ packages:
dependency: transitive
description:
name: vm_service
sha256: "5c5f338a667b4c644744b661f309fb8080bb94b18a7e91ef1dbd343bed00ed6d"
sha256: f652077d0bdf60abe4c1f6377448e8655008eef28f128bc023f7b5e8dfeb48fc
url: "https://pub.dev"
source: hosted
version: "14.2.5"
version: "14.2.4"
vy_string_utils:
dependency: transitive
description:
Expand Down
1 change: 1 addition & 0 deletions pubspec.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ dependencies:
url_launcher: ^6.3.1
table_calendar: ^3.1.2
google_sign_in: ^6.2.1
animated_toggle_switch: ^0.8.3


dev_dependencies:
Expand Down

0 comments on commit ca5017c

Please sign in to comment.