kopia lustrzana https://gitlab.com/mysocialportal/relatica
Add dark mode selection/theming
rodzic
3401d51c3c
commit
8a54707bef
|
@ -0,0 +1,11 @@
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class AppTheme {
|
||||||
|
static ThemeData light = ThemeData(primarySwatch: Colors.indigo);
|
||||||
|
|
||||||
|
static ThemeData dark = ThemeData.from(
|
||||||
|
colorScheme: ColorScheme.fromSwatch(
|
||||||
|
primarySwatch: Colors.cyan,
|
||||||
|
brightness: Brightness.dark,
|
||||||
|
));
|
||||||
|
}
|
|
@ -48,10 +48,8 @@ class AppBottomNavBar extends StatelessWidget {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
type: BottomNavigationBarType.fixed,
|
type: BottomNavigationBarType.fixed,
|
||||||
selectedItemColor: Colors.black,
|
|
||||||
unselectedItemColor: Colors.black54,
|
|
||||||
currentIndex: _buttonToIndex(currentButton),
|
currentIndex: _buttonToIndex(currentButton),
|
||||||
items: _menuItems(hasNotifications),
|
items: _menuItems(context, hasNotifications),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -88,7 +86,8 @@ class AppBottomNavBar extends StatelessWidget {
|
||||||
throw ArgumentError('$index has no button type');
|
throw ArgumentError('$index has no button type');
|
||||||
}
|
}
|
||||||
|
|
||||||
List<BottomNavigationBarItem> _menuItems(bool hasNotifications) {
|
List<BottomNavigationBarItem> _menuItems(
|
||||||
|
BuildContext context, bool hasNotifications) {
|
||||||
return [
|
return [
|
||||||
const BottomNavigationBarItem(
|
const BottomNavigationBarItem(
|
||||||
label: 'Timelines',
|
label: 'Timelines',
|
||||||
|
|
|
@ -4,6 +4,7 @@ import 'package:logging/logging.dart';
|
||||||
import 'package:multi_trigger_autocomplete/multi_trigger_autocomplete.dart';
|
import 'package:multi_trigger_autocomplete/multi_trigger_autocomplete.dart';
|
||||||
import 'package:provider/provider.dart';
|
import 'package:provider/provider.dart';
|
||||||
|
|
||||||
|
import 'app_theme.dart';
|
||||||
import 'di_initialization.dart';
|
import 'di_initialization.dart';
|
||||||
import 'globals.dart';
|
import 'globals.dart';
|
||||||
import 'routes.dart';
|
import 'routes.dart';
|
||||||
|
@ -40,51 +41,56 @@ class App extends StatelessWidget {
|
||||||
// This widget is the root of your application.
|
// This widget is the root of your application.
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Portal(
|
return AnimatedBuilder(
|
||||||
child: MultiProvider(
|
builder: (context, child) {
|
||||||
providers: [
|
return Portal(
|
||||||
ChangeNotifierProvider<SettingsService>(
|
child: MultiProvider(
|
||||||
create: (_) => getIt<SettingsService>(),
|
providers: [
|
||||||
lazy: true,
|
ChangeNotifierProvider<SettingsService>(
|
||||||
|
create: (_) => getIt<SettingsService>(),
|
||||||
|
lazy: true,
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<AuthService>(
|
||||||
|
create: (_) => getIt<AuthService>(),
|
||||||
|
lazy: true,
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<ConnectionsManager>(
|
||||||
|
create: (_) => getIt<ConnectionsManager>(),
|
||||||
|
lazy: true,
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<EntryManagerService>(
|
||||||
|
create: (_) => getIt<EntryManagerService>(),
|
||||||
|
lazy: true,
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<GalleryService>(
|
||||||
|
create: (_) => getIt<GalleryService>(),
|
||||||
|
lazy: true,
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<HashtagService>(
|
||||||
|
create: (_) => getIt<HashtagService>(),
|
||||||
|
lazy: true,
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<TimelineManager>(
|
||||||
|
create: (_) => getIt<TimelineManager>(),
|
||||||
|
),
|
||||||
|
ChangeNotifierProvider<NotificationsManager>(
|
||||||
|
create: (_) => getIt<NotificationsManager>(),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
child: MaterialApp.router(
|
||||||
|
theme: AppTheme.light,
|
||||||
|
darkTheme: AppTheme.dark,
|
||||||
|
themeMode: getIt<SettingsService>().themeMode,
|
||||||
|
debugShowCheckedModeBanner: false,
|
||||||
|
scrollBehavior: AppScrollingBehavior(),
|
||||||
|
routerDelegate: appRouter.routerDelegate,
|
||||||
|
routeInformationProvider: appRouter.routeInformationProvider,
|
||||||
|
routeInformationParser: appRouter.routeInformationParser,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
ChangeNotifierProvider<AuthService>(
|
);
|
||||||
create: (_) => getIt<AuthService>(),
|
},
|
||||||
lazy: true,
|
animation: getIt<SettingsService>(),
|
||||||
),
|
|
||||||
ChangeNotifierProvider<ConnectionsManager>(
|
|
||||||
create: (_) => getIt<ConnectionsManager>(),
|
|
||||||
lazy: true,
|
|
||||||
),
|
|
||||||
ChangeNotifierProvider<EntryManagerService>(
|
|
||||||
create: (_) => getIt<EntryManagerService>(),
|
|
||||||
lazy: true,
|
|
||||||
),
|
|
||||||
ChangeNotifierProvider<GalleryService>(
|
|
||||||
create: (_) => getIt<GalleryService>(),
|
|
||||||
lazy: true,
|
|
||||||
),
|
|
||||||
ChangeNotifierProvider<HashtagService>(
|
|
||||||
create: (_) => getIt<HashtagService>(),
|
|
||||||
lazy: true,
|
|
||||||
),
|
|
||||||
ChangeNotifierProvider<TimelineManager>(
|
|
||||||
create: (_) => getIt<TimelineManager>(),
|
|
||||||
),
|
|
||||||
ChangeNotifierProvider<NotificationsManager>(
|
|
||||||
create: (_) => getIt<NotificationsManager>(),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
child: MaterialApp.router(
|
|
||||||
theme: ThemeData(
|
|
||||||
primarySwatch: Colors.indigo,
|
|
||||||
),
|
|
||||||
debugShowCheckedModeBanner: false,
|
|
||||||
scrollBehavior: AppScrollingBehavior(),
|
|
||||||
routerDelegate: appRouter.routerDelegate,
|
|
||||||
routeInformationProvider: appRouter.routeInformationProvider,
|
|
||||||
routeInformationParser: appRouter.routeInformationParser,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -81,8 +81,8 @@ class _HomeScreenState extends State<HomeScreen> {
|
||||||
context.push('/post/new');
|
context.push('/post/new');
|
||||||
},
|
},
|
||||||
icon: Icon(
|
icon: Icon(
|
||||||
Icons.add,
|
Icons.edit,
|
||||||
color: Theme.of(context).primaryColor,
|
color: Theme.of(context).textTheme.bodyText1!.color,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
|
|
@ -1,8 +1,9 @@
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:friendica_portal/services/setting_service.dart';
|
|
||||||
import 'package:provider/provider.dart';
|
import 'package:provider/provider.dart';
|
||||||
|
|
||||||
import '../controls/standard_appbar.dart';
|
import '../controls/standard_appbar.dart';
|
||||||
|
import '../services/setting_service.dart';
|
||||||
|
import '../utils/theme_mode_extensions.dart';
|
||||||
|
|
||||||
class SettingsScreen extends StatelessWidget {
|
class SettingsScreen extends StatelessWidget {
|
||||||
@override
|
@override
|
||||||
|
@ -16,6 +17,7 @@ class SettingsScreen extends StatelessWidget {
|
||||||
child: ListView(
|
child: ListView(
|
||||||
children: [
|
children: [
|
||||||
buildLowBandwidthWidget(settings),
|
buildLowBandwidthWidget(settings),
|
||||||
|
buildThemeWidget(settings),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
@ -33,4 +35,21 @@ class SettingsScreen extends StatelessWidget {
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Widget buildThemeWidget(SettingsService settings) {
|
||||||
|
return ListTile(
|
||||||
|
title: const Text('Dark Mode Theme:'),
|
||||||
|
trailing: DropdownButton<ThemeMode>(
|
||||||
|
value: settings.themeMode,
|
||||||
|
items: ThemeMode.values
|
||||||
|
.map((m) => DropdownMenuItem(value: m, child: Text(m.toLabel())))
|
||||||
|
.toList(),
|
||||||
|
onChanged: (value) {
|
||||||
|
if (value != null) {
|
||||||
|
settings.themeMode = value;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
import 'package:flutter/foundation.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:shared_preferences/shared_preferences.dart';
|
import 'package:shared_preferences/shared_preferences.dart';
|
||||||
|
|
||||||
|
import '../utils/theme_mode_extensions.dart';
|
||||||
|
|
||||||
class SettingsService extends ChangeNotifier {
|
class SettingsService extends ChangeNotifier {
|
||||||
late final SharedPreferences _prefs;
|
late final SharedPreferences _prefs;
|
||||||
var _initialized = false;
|
var _initialized = false;
|
||||||
|
@ -17,14 +19,26 @@ class SettingsService extends ChangeNotifier {
|
||||||
notifyListeners();
|
notifyListeners();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var _themeMode = ThemeMode.system;
|
||||||
|
|
||||||
|
ThemeMode get themeMode => _themeMode;
|
||||||
|
|
||||||
|
set themeMode(ThemeMode mode) {
|
||||||
|
_themeMode = mode;
|
||||||
|
_prefs.setString(_themeModeKey, _themeMode.name);
|
||||||
|
notifyListeners();
|
||||||
|
}
|
||||||
|
|
||||||
Future<void> initialize() async {
|
Future<void> initialize() async {
|
||||||
if (_initialized) {
|
if (_initialized) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
_prefs = await SharedPreferences.getInstance();
|
_prefs = await SharedPreferences.getInstance();
|
||||||
_lowBandwidthMode = _prefs.getBool(_lowBandwidthModeKey) ?? false;
|
_lowBandwidthMode = _prefs.getBool(_lowBandwidthModeKey) ?? false;
|
||||||
|
_themeMode = ThemeModeExtensions.parse(_prefs.getString(_themeModeKey));
|
||||||
_initialized = true;
|
_initialized = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const _lowBandwidthModeKey = 'LowBandwidthMode';
|
const _lowBandwidthModeKey = 'LowBandwidthMode';
|
||||||
|
const _themeModeKey = 'ThemeMode';
|
||||||
|
|
|
@ -0,0 +1,20 @@
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
extension ThemeModeExtensions on ThemeMode {
|
||||||
|
static ThemeMode parse(String? themeModeString) =>
|
||||||
|
ThemeMode.values.firstWhere(
|
||||||
|
(m) => m.name == themeModeString,
|
||||||
|
orElse: () => ThemeMode.system,
|
||||||
|
);
|
||||||
|
|
||||||
|
String toLabel() {
|
||||||
|
switch (this) {
|
||||||
|
case ThemeMode.system:
|
||||||
|
return 'System';
|
||||||
|
case ThemeMode.light:
|
||||||
|
return 'Light';
|
||||||
|
case ThemeMode.dark:
|
||||||
|
return 'Dark';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Ładowanie…
Reference in New Issue