Skip to content

Commit

Permalink
Improved dark mode theming
Browse files Browse the repository at this point in the history
  • Loading branch information
Gold872 committed Jul 16, 2024
1 parent f0d7369 commit 8a46a2a
Show file tree
Hide file tree
Showing 8 changed files with 41 additions and 18 deletions.
16 changes: 13 additions & 3 deletions lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,9 @@ import 'dart:convert';
import 'dart:io';
import 'dart:math';

import 'package:collection/collection.dart';
import 'package:elastic_dashboard/widgets/settings_dialog.dart';
import 'package:flutter/material.dart';

import 'package:collection/collection.dart';
import 'package:dot_cast/dot_cast.dart';
import 'package:flex_seed_scheme/flex_seed_scheme.dart';
import 'package:package_info_plus/package_info_plus.dart';
Expand All @@ -21,6 +20,7 @@ import 'package:elastic_dashboard/services/log.dart';
import 'package:elastic_dashboard/services/nt_connection.dart';
import 'package:elastic_dashboard/services/nt_widget_builder.dart';
import 'package:elastic_dashboard/services/settings.dart';
import 'package:elastic_dashboard/widgets/settings_dialog.dart';

void main() async {
WidgetsFlutterBinding.ensureInitialized();
Expand Down Expand Up @@ -77,6 +77,8 @@ void main() async {
Settings.defaultGraphPeriod =
preferences.getDouble(PrefKeys.defaultGraphPeriod) ??
Settings.defaultGraphPeriod;
Settings.isDarkMode =
preferences.getBool(PrefKeys.darkMode) ?? Settings.isDarkMode;

NTWidgetBuilder.ensureInitialized();

Expand Down Expand Up @@ -207,14 +209,16 @@ class _ElasticState extends State<Elastic> {
element.variantName ==
widget.preferences.getString(PrefKeys.themeVariant)) ??
FlexSchemeVariant.material3Legacy;
late bool darkMode =
widget.preferences.getBool(PrefKeys.darkMode) ?? Settings.isDarkMode;

@override
Widget build(BuildContext context) {
ThemeData theme = ThemeData(
useMaterial3: true,
colorScheme: SeedColorScheme.fromSeeds(
primaryKey: teamColor,
brightness: Settings.isDarkMode ? Brightness.dark : Brightness.light,
brightness: darkMode ? Brightness.dark : Brightness.light,
variant: Settings.themeVariant,
),
);
Expand All @@ -240,6 +244,12 @@ class _ElasticState extends State<Elastic> {
}
setState(() {});
},
onDarkModeChanged: (darkMode) async {
await widget.preferences.setBool(PrefKeys.darkMode, darkMode);
this.darkMode = darkMode;
Settings.isDarkMode = darkMode;
setState(() {});
},
),
);
}
Expand Down
12 changes: 9 additions & 3 deletions lib/pages/dashboard_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import 'dart:async';
import 'dart:convert';
import 'dart:io';

import 'package:flex_seed_scheme/flex_seed_scheme.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter/services.dart';
Expand All @@ -12,6 +11,7 @@ import 'package:dot_cast/dot_cast.dart';
import 'package:elegant_notification/elegant_notification.dart';
import 'package:elegant_notification/resources/stacked_options.dart';
import 'package:file_selector/file_selector.dart';
import 'package:flex_seed_scheme/flex_seed_scheme.dart';
import 'package:popover/popover.dart';
import 'package:screen_retriever/screen_retriever.dart';
import 'package:shared_preferences/shared_preferences.dart';
Expand Down Expand Up @@ -42,13 +42,15 @@ class DashboardPage extends StatefulWidget {
final String version;
final Function(Color color)? onColorChanged;
final Function(FlexSchemeVariant variant)? onThemeVariantChanged;
final Function(bool darkMode)? onDarkModeChanged;

const DashboardPage({
super.key,
required this.preferences,
required this.version,
this.onColorChanged,
this.onThemeVariantChanged,
this.onDarkModeChanged,
});

@override
Expand Down Expand Up @@ -1115,6 +1117,10 @@ class _DashboardPageState extends State<DashboardPage> with WindowListener {
},
onColorChanged: widget.onColorChanged,
onThemeVariantChanged: widget.onThemeVariantChanged,
onDarkModeChanged: (darkMode) {
widget.onDarkModeChanged?.call(darkMode);
setState(() {});
},
),
);
}
Expand Down Expand Up @@ -1292,15 +1298,15 @@ class _DashboardPageState extends State<DashboardPage> with WindowListener {
textStyle: WidgetStateProperty.all(menuTextStyle),
backgroundColor: WidgetStatePropertyAll(Settings.isDarkMode
? const Color.fromARGB(255, 25, 25, 25)
: const Color.fromARGB(255, 180, 165, 165)),
: const Color.fromARGB(255, 180, 180, 180)),
iconSize: const WidgetStatePropertyAll(20.0),
);

MenuBar menuBar = MenuBar(
style: MenuStyle(
backgroundColor: WidgetStatePropertyAll(Settings.isDarkMode
? const Color.fromARGB(255, 25, 25, 25)
: const Color.fromARGB(255, 180, 165, 165)),
: const Color.fromARGB(255, 180, 180, 180)),
elevation: const WidgetStatePropertyAll(0),
),
children: [
Expand Down
3 changes: 2 additions & 1 deletion lib/services/settings.dart
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import 'package:elastic_dashboard/services/ip_address_util.dart';
import 'package:flex_seed_scheme/flex_seed_scheme.dart';

import 'package:elastic_dashboard/services/ip_address_util.dart';

class Settings {
static const String repositoryLink =
'https://github.com/Gold872/elastic-dashboard';
Expand Down
2 changes: 1 addition & 1 deletion lib/widgets/custom_appbar.dart
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ class CustomAppBar extends AppBar {
backgroundColor: appBarColor ??
(Settings.isDarkMode
? const Color.fromARGB(255, 25, 25, 25)
: const Color.fromARGB(255, 180, 165, 165)),
: const Color.fromARGB(255, 180, 180, 180)),
elevation: 0.0,
scrolledUnderElevation: 0.0,
leading: menuBar,
Expand Down
3 changes: 2 additions & 1 deletion lib/widgets/dialog_widgets/dialog_dropdown_chooser.dart
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import 'package:elastic_dashboard/services/settings.dart';
import 'package:flutter/material.dart';

import 'package:elastic_dashboard/services/settings.dart';

class DialogDropdownChooser<T> extends StatefulWidget {
final List<T>? choices;
final T? initialValue;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,9 @@ class WidgetContainer extends StatelessWidget {
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(Settings.cornerRadius),
color: const Color.fromARGB(255, 40, 40, 40),
color: (Settings.isDarkMode)
? const Color.fromARGB(255, 40, 40, 40)
: const Color.fromARGB(255, 225, 225, 225),
boxShadow: const [
BoxShadow(
offset: Offset(2, 2),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -520,7 +520,9 @@ class ListLayoutModel extends LayoutContainerModel {
const EdgeInsets.symmetric(horizontal: 4.0, vertical: 2.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(7.5),
color: const Color.fromARGB(255, 45, 45, 45),
color: (Settings.isDarkMode)
? const Color.fromARGB(255, 45, 45, 45)
: const Color.fromARGB(255, 225, 225, 225),
boxShadow: const [
BoxShadow(
offset: Offset(1.0, 1.0),
Expand Down
15 changes: 8 additions & 7 deletions lib/widgets/settings_dialog.dart
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import 'package:collection/collection.dart';
import 'package:flex_seed_scheme/flex_seed_scheme.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

import 'package:collection/collection.dart';
import 'package:dot_cast/dot_cast.dart';
import 'package:flex_seed_scheme/flex_seed_scheme.dart';
import 'package:shared_preferences/shared_preferences.dart';

import 'package:elastic_dashboard/services/ip_address_util.dart';
Expand Down Expand Up @@ -41,6 +41,7 @@ class SettingsDialog extends StatefulWidget {
final Function(String? value)? onDefaultPeriodChanged;
final Function(String? value)? onDefaultGraphPeriodChanged;
final Function(FlexSchemeVariant variant)? onThemeVariantChanged;
final Function(bool darkMode)? onDarkModeChanged;

const SettingsDialog({
super.key,
Expand All @@ -58,6 +59,7 @@ class SettingsDialog extends StatefulWidget {
this.onDefaultPeriodChanged,
this.onDefaultGraphPeriodChanged,
this.onThemeVariantChanged,
this.onDarkModeChanged,
});

@override
Expand Down Expand Up @@ -175,13 +177,12 @@ class _SettingsDialogState extends State<SettingsDialog> {
widget.preferences.getString(PrefKeys.themeVariant) ??
SettingsDialog.defaultVariantName),
DialogToggleSwitch(
initialValue: Settings.isDarkMode,
initialValue: widget.preferences.getBool(PrefKeys.darkMode) ??
Settings.isDarkMode,
label: 'Dark Mode',
onToggle: (value) {
widget.onColorChanged?.call(currentColor);
setState(() {
Settings.isDarkMode = value;
});
widget.onDarkModeChanged?.call(value);
setState(() {});
},
),
],
Expand Down

0 comments on commit 8a46a2a

Please sign in to comment.