brontomark/flux
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Enhance theme management and UI settings

Browse Source 
- Updated AppThemeMode enum to include icons and added fromValue method for easier theme retrieval.
- Modified ThemeBloc to manage currentTheme instead of themeMode.
- Enhanced ThemeState to reflect currentTheme and updated copyWith method.
- Added ThemeSettingsView for user-friendly theme selection in settings.
- Improved fluxLightTheme and fluxDarkTheme with new listTileTheme and color settings.
- Updated settings view to navigate to ThemeSettingsView.
- Added entitlements for network client permissions in Debug and Release profiles.
- Introduced Podfile.lock for dependency management.
- Added devtools_options.yaml for Dart & Flutter DevTools configuration.
This commit is contained in:
Mark M2 Macbook
2026-04-06 08:48:10 +02:00
parent 28b2abdff3
commit c6c61f1a31
13 changed files with 281 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
lib/data/enums.dart
View File

@@ -1,12 +1,20 @@
import 'package:flutter/material.dart';
enum AppThemeMode {
light('light', 'Chiaro', ThemeMode.light),
dark('dark', 'Scuro', ThemeMode.dark),
system('system', 'Sistema', ThemeMode.system);
light('light', 'Chiaro', ThemeMode.light, Icons.light_mode),
dark('dark', 'Scuro', ThemeMode.dark, Icons.dark_mode),
system('system', 'Sistema', ThemeMode.system, Icons.brightness_auto);
const AppThemeMode(this.value, this.label, this.themeMode);
const AppThemeMode(this.value, this.label, this.themeMode, this.icon);
final String value;
final String label;
final ThemeMode themeMode;
final IconData icon;
static AppThemeMode fromValue(String? value) {
return AppThemeMode.values.firstWhere(
(e) => e.value == value,
orElse: () => AppThemeMode.system,
);
}
}

2
lib/main.dart
View File

@@ -34,7 +34,7 @@ class FluxApp extends StatelessWidget {
debugShowCheckedModeBanner: false,
theme: fluxLightTheme,
darkTheme: fluxDarkTheme,
themeMode: state.themeMode, // Applica il tema FLUX
themeMode: state.currentTheme.themeMode, // Applica il tema FLUX
home: const HomeScreen(),
);
},

65
lib/theme/theme.dart
View File

@@ -69,6 +69,13 @@ ThemeData fluxDarkTheme = ThemeData(
onPrimary: Colors.white,
onSurface: FluxColors.darkTextPrimary,
),
hoverColor: FluxColors.accentTurquoise.withValues(
alpha: 0.08,
), // <--- AGGIUNGI QUESTO
splashColor: FluxColors.accentTurquoise.withValues(
alpha: 0.12,
), // <--- AGGIUNGI QUESTO
highlightColor: Colors.transparent,
textTheme: _buildFluxTextTheme(
ThemeData.dark().textTheme,
@@ -97,6 +104,28 @@ ThemeData fluxDarkTheme = ThemeData(
),
),
listTileTheme: ListTileThemeData(
// Definiamo la forma arrotondata (fondamentale per l'effetto moderno)
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
// Colore dell'icona (Turchese Flux)
iconColor: FluxColors.accentTurquoise,
// Colore del testo
titleTextStyle: GoogleFonts.poppins(
color: FluxColors.darkTextPrimary,
fontSize: 16,
fontWeight: FontWeight.w500,
),
subtitleTextStyle: GoogleFonts.poppins(
color: FluxColors.darkTextSecondary,
fontSize: 13,
),
// Per far apparire la "manina" su Web/Desktop
mouseCursor: WidgetStateProperty.all(SystemMouseCursors.click),
// NOTA: Se overlayColor non esiste, Flutter userà i colori
// di default del tema (splashColor e hoverColor) definiti nel ThemeData generale.
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: FluxColors.primaryBlue,
@@ -120,6 +149,9 @@ ThemeData fluxLightTheme = ThemeData(
primaryColor: FluxColors.primaryBlue,
// Sfondo chiarissimo per staccare dalle card bianche
scaffoldBackgroundColor: FluxColors.lightBackground,
hoverColor: FluxColors.primaryBlue.withValues(alpha: 0.05),
splashColor: FluxColors.primaryBlue.withValues(alpha: 0.1),
highlightColor: Colors.transparent,
colorScheme: const ColorScheme.light(
primary: FluxColors.primaryBlue,
@@ -157,6 +189,28 @@ ThemeData fluxLightTheme = ThemeData(
),
),
listTileTheme: ListTileThemeData(
// Definiamo la forma arrotondata (fondamentale per l'effetto moderno)
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
// Colore dell'icona (Turchese Flux)
iconColor: FluxColors.accentTurquoise,
// Colore del testo
titleTextStyle: GoogleFonts.poppins(
color: FluxColors.darkTextPrimary,
fontSize: 16,
fontWeight: FontWeight.w500,
),
subtitleTextStyle: GoogleFonts.poppins(
color: FluxColors.darkTextSecondary,
fontSize: 13,
),
// Per far apparire la "manina" su Web/Desktop
mouseCursor: WidgetStateProperty.all(SystemMouseCursors.click),
// NOTA: Se overlayColor non esiste, Flutter userà i colori
// di default del tema (splashColor e hoverColor) definiti nel ThemeData generale.
),
// Il pulsante principale rimane Blu Elettrico, molto visibile
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
@@ -187,3 +241,14 @@ ThemeData fluxLightTheme = ThemeData(
// Colore delle icone generiche
iconTheme: const IconThemeData(color: FluxColors.lightTextSecondary),
);
extension FluxThemeContext on BuildContext {
// Recupera il colore 'secondary' definito nel tuo ColorScheme (il Turchese Flux)
Color get accent => Theme.of(this).colorScheme.secondary;
// Puoi aggiungere anche questi per comodità futura:
Color get primary => Theme.of(this).colorScheme.primary;
Color get surface => Theme.of(this).colorScheme.surface;
Color get primaryText =>
Theme.of(this).textTheme.titleLarge?.color ?? Colors.black;
}

12
lib/theme/theme_bloc.dart
View File

@@ -1,4 +1,3 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:equatable/equatable.dart';
import 'package:flux/data/enums.dart';
@@ -11,20 +10,19 @@ part 'theme_state.dart';
class ThemeBloc extends Bloc<ThemeEvent, ThemeState> {
static const String _savedThemeKey = "themeModeSetting";
final SharedPreferences _prefs = GetIt.I.get<SharedPreferences>();
ThemeBloc() : super(ThemeState(themeMode: ThemeMode.system)) {
ThemeBloc() : super(ThemeState(currentTheme: AppThemeMode.system)) {
on<LoadThemeEvent>((event, emit) {
String savedTheme = _prefs.getString(_savedThemeKey) ?? 'system';
emit(
state.copyWith(
themeMode: AppThemeMode.values
.firstWhere((test) => test.value == savedTheme)
.themeMode,
currentTheme: AppThemeMode.fromValue(
_prefs.getString(_savedThemeKey),
),
),
);
});
on<ChangeThemeEvent>((event, emit) async {
await _prefs.setString(_savedThemeKey, event.appThemeMode.value);
emit(state.copyWith(themeMode: event.appThemeMode.themeMode));
emit(state.copyWith(currentTheme: event.appThemeMode));
});
}
}

10
lib/theme/theme_state.dart
View File

@@ -1,14 +1,14 @@
part of 'theme_bloc.dart';
class ThemeState extends Equatable {
const ThemeState({required this.themeMode});
const ThemeState({required this.currentTheme});
final ThemeMode themeMode;
final AppThemeMode currentTheme;
@override
List<Object?> get props => [themeMode];
List<Object?> get props => [currentTheme];
ThemeState copyWith({ThemeMode? themeMode}) {
return ThemeState(themeMode: themeMode ?? this.themeMode);
ThemeState copyWith({AppThemeMode? currentTheme}) {
return ThemeState(currentTheme: currentTheme ?? this.currentTheme);
}
}

17
lib/ui/settings/settings_view.dart
View File

@@ -1,6 +1,7 @@
// lib/ui/impostazioni/impostazioni_view.dart
import 'package:flutter/material.dart';
import 'package:flux/theme/theme.dart';
import 'package:flux/ui/settings/theme_settings_view.dart';
class SettingsView extends StatelessWidget {
const SettingsView({super.key});
@@ -18,12 +19,18 @@ class SettingsView extends StatelessWidget {
'Profilo Utente',
'Configura i tuoi dati',
context,
MaterialPageRoute(
builder: (context) => const ThemeSettingsView(),
),
),
_settingsTile(
Icons.store,
'Mio Negozio',
'Piacenza Centro',
context,
MaterialPageRoute(
builder: (context) => const ThemeSettingsView(),
),
),
]),
const SizedBox(height: 16),
@@ -33,12 +40,18 @@ class SettingsView extends StatelessWidget {
'Sincronizzazione',
'Ultima: 5 min fa',
context,
MaterialPageRoute(
builder: (context) => const ThemeSettingsView(),
),
),
_settingsTile(
Icons.dark_mode,
'Tema (FLUX Dark Active)',
'Tema (FLUX Dark)',
'Configurazione visiva',
context,
MaterialPageRoute(
builder: (context) => const ThemeSettingsView(),
),
),
]),
const SizedBox(height: 24),
@@ -75,6 +88,7 @@ class SettingsView extends StatelessWidget {
String title,
String subtitle,
BuildContext context,
MaterialPageRoute route,
) {
return ListTile(
leading: Icon(icon, color: FluxColors.primaryBlue),
@@ -84,6 +98,7 @@ class SettingsView extends StatelessWidget {
Icons.chevron_right,
color: Theme.of(context).textTheme.bodyMedium?.color,
),
onTap: () => Navigator.of(context).push(route),
);
}
}

35
lib/ui/settings/theme_settings_view.dart Normal file
View File

@@ -0,0 +1,35 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flux/data/enums.dart';
import 'package:flux/theme/theme.dart';
import 'package:flux/theme/theme_bloc.dart';
class ThemeSettingsView extends StatelessWidget {
const ThemeSettingsView({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Impostazioni Tema')),
body: BlocBuilder<ThemeBloc, ThemeState>(
builder: (context, state) => RadioGroup<AppThemeMode>(
groupValue: state.currentTheme,
onChanged: (newTheme) {
if (newTheme != null) {
context.read<ThemeBloc>().add(ChangeThemeEvent(newTheme));
}
},
child: Column(
children: AppThemeMode.values.map((theme) {
return RadioListTile<AppThemeMode>(
title: Text(theme.label),
secondary: Icon(theme.icon, color: context.accent),
value: theme,
);
}).toList(),
),
),
),
);
}
}