added support for dark / light mode switch

This commit is contained in:
Myzel394 2022-08-17 09:59:46 +02:00
parent 40d2ffe25b
commit 46b35f2b54
7 changed files with 104 additions and 59 deletions

35
lib/constants/themes.dart Normal file
View File

@ -0,0 +1,35 @@
import 'package:flutter/material.dart';
final LIGHT_THEME = ThemeData(
textTheme: ThemeData().textTheme.copyWith(
headline1: const TextStyle(
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
inputDecorationTheme: InputDecorationTheme(
filled: true,
helperMaxLines: 10,
errorMaxLines: 10,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
),
),
);
final DARK_THEME = ThemeData.dark().copyWith(
textTheme: ThemeData.dark().textTheme.copyWith(
headline1: const TextStyle(
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
inputDecorationTheme: InputDecorationTheme(
filled: true,
helperMaxLines: 10,
errorMaxLines: 10,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
),
),
);

View File

@ -2,6 +2,7 @@ import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; import 'package:flutter/services.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:quid_faciam_hodie/constants/themes.dart';
import 'package:quid_faciam_hodie/screens/calendar_screen.dart'; import 'package:quid_faciam_hodie/screens/calendar_screen.dart';
import 'package:quid_faciam_hodie/screens/grant_permission_screen.dart'; import 'package:quid_faciam_hodie/screens/grant_permission_screen.dart';
import 'package:quid_faciam_hodie/screens/login_screen.dart'; import 'package:quid_faciam_hodie/screens/login_screen.dart';
@ -20,7 +21,7 @@ void main() async {
DeviceOrientation.portraitDown, DeviceOrientation.portraitDown,
]); ]);
runApp(MyApp()); runApp(const MyApp());
} }
class MyApp extends StatefulWidget { class MyApp extends StatefulWidget {
@ -41,22 +42,9 @@ class _MyAppState extends State<MyApp> {
value: memories, value: memories,
child: MaterialApp( child: MaterialApp(
title: 'Quid faciam hodie?', title: 'Quid faciam hodie?',
theme: ThemeData.dark().copyWith( theme: LIGHT_THEME,
textTheme: ThemeData.dark().textTheme.copyWith( darkTheme: DARK_THEME,
headline1: const TextStyle( themeMode: ThemeMode.system,
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
inputDecorationTheme: InputDecorationTheme(
filled: true,
helperMaxLines: 10,
errorMaxLines: 10,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
),
),
),
routes: { routes: {
WelcomeScreen.ID: (context) => const WelcomeScreen(), WelcomeScreen.ID: (context) => const WelcomeScreen(),
MainScreen.ID: (context) => const MainScreen(), MainScreen.ID: (context) => const MainScreen(),

View File

@ -25,6 +25,8 @@ class _ServerLoadingScreenState extends State<ServerLoadingScreen> {
@override @override
void initState() { void initState() {
super.initState(); super.initState();
load();
} }
Future<void> load() async { Future<void> load() async {

View File

@ -40,8 +40,8 @@ class MonthCalendarBuilder extends CalendarBuilder {
}(); }();
final delay = Duration( final delay = Duration(
microseconds: microseconds: Random().nextInt(CALENDAR_DATE_IN_MAX_DELAY.inMicroseconds),
Random().nextInt(CALENDAR_DATE_IN_MAX_DELAY.inMicroseconds)); );
return DelayRender( return DelayRender(
delay: delay, delay: delay,
@ -163,7 +163,7 @@ class CalendarMonth extends StatelessWidget {
// Background color // Background color
selectedDayTextColor: theme.textTheme.bodyText1!.color!, selectedDayTextColor: theme.textTheme.bodyText1!.color!,
// Foreground color // Foreground color
focusedDayTextColor: theme.bottomAppBarColor, focusedDayTextColor: theme.dialogBackgroundColor,
), ),
); );
} }

View File

@ -79,9 +79,16 @@ class _MemoryViewState extends State<MemoryView> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
if (status == MemoryFetchStatus.error) { if (status == MemoryFetchStatus.error) {
return const Center( return Center(
child: Text('Memory could not be loaded.'), child: Text(
'Memory could not be loaded.',
style: theme.textTheme.bodyText2!.copyWith(
color: Colors.white,
),
),
); );
} }
@ -122,7 +129,12 @@ class _MemoryViewState extends State<MemoryView> {
() { () {
switch (status) { switch (status) {
case MemoryFetchStatus.downloading: case MemoryFetchStatus.downloading:
return const Text('Downloading memory'); return Text(
'Downloading memory',
style: theme.textTheme.bodyText2!.copyWith(
color: Colors.white,
),
);
default: default:
return const SizedBox(); return const SizedBox();
} }

View File

@ -74,7 +74,9 @@ class _StatusState extends State<Status> with TickerProviderStateMixin {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Stack( return Container(
color: Colors.black,
child: Stack(
fit: StackFit.expand, fit: StackFit.expand,
children: <Widget>[ children: <Widget>[
widget.child, widget.child,
@ -115,6 +117,7 @@ class _StatusState extends State<Status> with TickerProviderStateMixin {
), ),
), ),
], ],
),
); );
} }
} }

View File

@ -36,7 +36,9 @@ class TimelineOverlay extends StatelessWidget {
child: Text( child: Text(
DateFormat('dd. MMMM yyyy').format(date), DateFormat('dd. MMMM yyyy').format(date),
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: Theme.of(context).textTheme.headline1, style: Theme.of(context).textTheme.headline1!.copyWith(
color: Colors.white,
),
), ),
), ),
), ),
@ -58,12 +60,15 @@ class TimelineOverlay extends StatelessWidget {
child: Icon( child: Icon(
Icons.public, Icons.public,
size: theme.textTheme.titleSmall!.fontSize, size: theme.textTheme.titleSmall!.fontSize,
color: Colors.white,
), ),
), ),
const SizedBox(width: SMALL_SPACE), const SizedBox(width: SMALL_SPACE),
Text( Text(
'$memoryIndex/$memoriesAmount', '$memoryIndex/$memoriesAmount',
style: Theme.of(context).textTheme.titleSmall, style: Theme.of(context).textTheme.titleSmall!.copyWith(
color: Colors.white,
),
) )
], ],
), ),