feat: Refactor theme management and enhance UI with AppTheme integration

This commit is contained in:
Janez T
2025-10-14 10:16:53 +02:00
parent 4fae6e4c55
commit 2eb2ee4433
9 changed files with 483 additions and 290 deletions

View File

@@ -8,6 +8,7 @@ import 'providers/map_provider.dart';
import 'providers/app_provider.dart'; import 'providers/app_provider.dart';
import 'services/tile_cache_service.dart'; import 'services/tile_cache_service.dart';
import 'screens/home_screen.dart'; import 'screens/home_screen.dart';
import 'theme/app_theme.dart';
void main() { void main() {
runApp(const MeshCoreSarApp()); runApp(const MeshCoreSarApp());
@@ -21,7 +22,7 @@ class MeshCoreSarApp extends StatefulWidget {
} }
class _MeshCoreSarAppState extends State<MeshCoreSarApp> { class _MeshCoreSarAppState extends State<MeshCoreSarApp> {
ThemeMode _themeMode = ThemeMode.system; AppThemeMode _themeMode = AppThemeMode.system;
@override @override
void initState() { void initState() {
@@ -33,14 +34,11 @@ class _MeshCoreSarAppState extends State<MeshCoreSarApp> {
final prefs = await SharedPreferences.getInstance(); final prefs = await SharedPreferences.getInstance();
final themeName = prefs.getString('theme_mode') ?? 'system'; final themeName = prefs.getString('theme_mode') ?? 'system';
setState(() { setState(() {
_themeMode = ThemeMode.values.firstWhere( _themeMode = AppTheme.themeFromString(themeName);
(mode) => mode.name == themeName,
orElse: () => ThemeMode.system,
);
}); });
} }
void _handleThemeChanged(ThemeMode mode) { void _handleThemeChanged(AppThemeMode mode) {
setState(() { setState(() {
_themeMode = mode; _themeMode = mode;
}); });
@@ -78,57 +76,19 @@ class _MeshCoreSarAppState extends State<MeshCoreSarApp> {
), ),
), ),
], ],
child: MaterialApp( child: Builder(
title: 'MeshCore SAR', builder: (context) {
debugShowCheckedModeBanner: false, final systemBrightness = MediaQuery.platformBrightnessOf(context);
theme: ThemeData( return MaterialApp(
useMaterial3: true, title: 'MeshCore SAR',
colorScheme: ColorScheme.fromSeed( debugShowCheckedModeBanner: false,
seedColor: Colors.orange, theme: AppTheme.getTheme(_themeMode, systemBrightness),
brightness: Brightness.light, home: HomeScreen(
), onThemeChanged: _handleThemeChanged,
appBarTheme: const AppBarTheme( currentTheme: _themeMode,
centerTitle: true,
elevation: 0,
),
cardTheme: CardThemeData(
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
), ),
), );
inputDecorationTheme: InputDecorationTheme( },
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
filled: true,
),
),
darkTheme: ThemeData(
useMaterial3: true,
colorScheme: ColorScheme.fromSeed(
seedColor: Colors.orange,
brightness: Brightness.dark,
),
appBarTheme: const AppBarTheme(
centerTitle: true,
elevation: 0,
),
cardTheme: CardThemeData(
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
inputDecorationTheme: InputDecorationTheme(
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
filled: true,
),
),
themeMode: _themeMode,
home: HomeScreen(onThemeChanged: _handleThemeChanged, currentTheme: _themeMode),
), ),
); );
} }

View File

@@ -140,7 +140,7 @@ class _ContactTile extends StatelessWidget {
margin: const EdgeInsets.only(bottom: 8), margin: const EdgeInsets.only(bottom: 8),
child: ListTile( child: ListTile(
leading: CircleAvatar( leading: CircleAvatar(
backgroundColor: _getTypeColor(contact.type), backgroundColor: _getTypeColor(contact.type, context),
child: contact.roleEmoji != null child: contact.roleEmoji != null
? Text( ? Text(
contact.roleEmoji!, contact.roleEmoji!,
@@ -187,7 +187,7 @@ class _ContactTile extends StatelessWidget {
vertical: 2, vertical: 2,
), ),
decoration: BoxDecoration( decoration: BoxDecoration(
color: _getTypeColor(contact.type).withOpacity(0.2), color: _getTypeColor(contact.type, context).withOpacity(0.2),
borderRadius: BorderRadius.circular(4), borderRadius: BorderRadius.circular(4),
), ),
child: Text( child: Text(
@@ -283,7 +283,7 @@ class _ContactTile extends StatelessWidget {
child: Row( child: Row(
children: [ children: [
CircleAvatar( CircleAvatar(
backgroundColor: _getTypeColor(contact.type), backgroundColor: _getTypeColor(contact.type, context),
child: contact.roleEmoji != null child: contact.roleEmoji != null
? Text( ? Text(
contact.roleEmoji!, contact.roleEmoji!,
@@ -393,10 +393,10 @@ class _ContactTile extends StatelessWidget {
} }
} }
Color _getTypeColor(ContactType type) { Color _getTypeColor(ContactType type, BuildContext context) {
switch (type) { switch (type) {
case ContactType.chat: case ContactType.chat:
return Colors.blue; return Theme.of(context).colorScheme.primary;
case ContactType.repeater: case ContactType.repeater:
return Colors.green; return Colors.green;
case ContactType.room: case ContactType.room:

View File

@@ -4,6 +4,7 @@ import '../providers/connection_provider.dart';
import '../providers/app_provider.dart'; import '../providers/app_provider.dart';
import '../models/device_info.dart' as models; import '../models/device_info.dart' as models;
import '../services/tile_cache_service.dart'; import '../services/tile_cache_service.dart';
import '../theme/app_theme.dart';
import 'messages_tab.dart'; import 'messages_tab.dart';
import 'contacts_tab.dart'; import 'contacts_tab.dart';
import 'map_tab.dart'; import 'map_tab.dart';
@@ -11,8 +12,8 @@ import 'map_management_screen.dart';
import 'settings_screen.dart'; import 'settings_screen.dart';
class HomeScreen extends StatefulWidget { class HomeScreen extends StatefulWidget {
final Function(ThemeMode) onThemeChanged; final Function(AppThemeMode) onThemeChanged;
final ThemeMode currentTheme; final AppThemeMode currentTheme;
const HomeScreen({ const HomeScreen({
super.key, super.key,
@@ -109,17 +110,17 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
margin: const EdgeInsets.symmetric(horizontal: 16), margin: const EdgeInsets.symmetric(horizontal: 16),
padding: const EdgeInsets.all(16), padding: const EdgeInsets.all(16),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.blue, color: Theme.of(context).colorScheme.primaryContainer,
borderRadius: BorderRadius.circular(8), borderRadius: BorderRadius.circular(8),
), ),
child: const Row( child: Row(
children: [ children: [
Icon(Icons.info_outline, color: Colors.white), Icon(Icons.info_outline, color: Theme.of(context).colorScheme.onPrimaryContainer),
SizedBox(width: 12), const SizedBox(width: 12),
Expanded( Expanded(
child: Text( child: Text(
'The default pin for devices without a screen is 123456. Trouble pairing? Forget the bluetooth device in system settings.', 'The default pin for devices without a screen is 123456. Trouble pairing? Forget the bluetooth device in system settings.',
style: TextStyle(color: Colors.white, fontSize: 13), style: TextStyle(color: Theme.of(context).colorScheme.onPrimaryContainer, fontSize: 13),
), ),
), ),
], ],

View File

@@ -760,13 +760,13 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
rotate: false, // Don't rotate with map rotate: false, // Don't rotate with map
child: Container( child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.blue.withValues(alpha: 0.3), color: Theme.of(context).colorScheme.primary.withValues(alpha: 0.3),
shape: BoxShape.circle, shape: BoxShape.circle,
), ),
child: Container( child: Container(
margin: const EdgeInsets.all(8), margin: const EdgeInsets.all(8),
decoration: const BoxDecoration( decoration: BoxDecoration(
color: Colors.blue, color: Theme.of(context).colorScheme.primary,
shape: BoxShape.circle, shape: BoxShape.circle,
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
@@ -935,7 +935,7 @@ class _MapLegend extends StatelessWidget {
const SizedBox(height: 8), const SizedBox(height: 8),
_LegendItem( _LegendItem(
icon: Icons.person, icon: Icons.person,
color: Colors.blue, color: Theme.of(context).colorScheme.primary,
label: 'Team', label: 'Team',
count: teamMemberCount, count: teamMemberCount,
), ),
@@ -1252,7 +1252,7 @@ class _DetailedCompassDialogState extends State<_DetailedCompassDialog> {
// Contacts filter // Contacts filter
_CompactFilterItem( _CompactFilterItem(
icon: Icons.person, icon: Icons.person,
color: Colors.blue, color: Theme.of(context).colorScheme.primary,
label: 'Contacts', label: 'Contacts',
value: _showContacts, value: _showContacts,
onChanged: (value) { onChanged: (value) {
@@ -1526,7 +1526,7 @@ class _DetailedCompassDialogState extends State<_DetailedCompassDialog> {
if (_selectedContact != null) { if (_selectedContact != null) {
title = _selectedContact!.displayName; title = _selectedContact!.displayName;
icon = Icons.person; icon = Icons.person;
color = Colors.blue; color = Theme.of(context).colorScheme.primary;
targetLocation = _selectedContact!.displayLocation; targetLocation = _selectedContact!.displayLocation;
if (targetLocation != null) { if (targetLocation != null) {
@@ -1821,9 +1821,9 @@ class _DetailedCompassDialogState extends State<_DetailedCompassDialog> {
contact.roleEmoji!, contact.roleEmoji!,
style: const TextStyle(fontSize: 24), style: const TextStyle(fontSize: 24),
) )
: const Icon( : Icon(
Icons.person, Icons.person,
color: Colors.blue, color: Theme.of(context).colorScheme.primary,
size: 24, size: 24,
), ),
title: Text(contact.displayName), title: Text(contact.displayName),
@@ -2195,7 +2195,7 @@ class _LargeCompassPainter extends CustomPainter {
// Draw line from center to contact // Draw line from center to contact
final linePaint = Paint() final linePaint = Paint()
..color = Colors.blue.withValues(alpha: 0.3) ..color = Colors.lightBlue.withValues(alpha: 0.3)
..style = PaintingStyle.stroke ..style = PaintingStyle.stroke
..strokeWidth = 1.5; ..strokeWidth = 1.5;
canvas.drawLine( canvas.drawLine(
@@ -2207,7 +2207,7 @@ class _LargeCompassPainter extends CustomPainter {
// Draw contact dot (size varies with zoom) // Draw contact dot (size varies with zoom)
final dotSize = (6.0 * (1.0 + zoomLevel * 0.3)).clamp(4.0, 12.0); final dotSize = (6.0 * (1.0 + zoomLevel * 0.3)).clamp(4.0, 12.0);
final dotPaint = Paint() final dotPaint = Paint()
..color = Colors.blue ..color = Colors.lightBlue
..style = PaintingStyle.fill; ..style = PaintingStyle.fill;
canvas.drawCircle(Offset(dotX, dotY), dotSize, dotPaint); canvas.drawCircle(Offset(dotX, dotY), dotSize, dotPaint);
@@ -2228,7 +2228,7 @@ class _LargeCompassPainter extends CustomPainter {
textPainter.text = TextSpan( textPainter.text = TextSpan(
text: distanceText, text: distanceText,
style: const TextStyle( style: const TextStyle(
color: Colors.blue, color: Colors.lightBlue,
fontSize: 9, fontSize: 9,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),

View File

@@ -568,71 +568,65 @@ class _SarUpdateSheetState extends State<_SarUpdateSheet> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Container(
decoration: BoxDecoration( height: MediaQuery.of(context).size.height * 0.9,
color: Theme.of(context).colorScheme.surface, decoration: const BoxDecoration(
borderRadius: const BorderRadius.vertical(top: Radius.circular(20)), color: Color(0xFF1E1E1E),
), borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
padding: EdgeInsets.only(
bottom: MediaQuery.of(context).viewInsets.bottom,
), ),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min,
children: [ children: [
// Header with drag handle // Header
Container( Container(
padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 20), padding: const EdgeInsets.all(16),
child: Column( child: Row(
children: [ children: [
// Drag handle IconButton(
Container( icon: const Icon(Icons.arrow_back, color: Colors.white),
width: 40, onPressed: () => Navigator.pop(context),
height: 4, ),
decoration: BoxDecoration( const Expanded(
color: Theme.of(context).colorScheme.onSurfaceVariant.withValues(alpha: 0.4), child: Column(
borderRadius: BorderRadius.circular(2), children: [
Text(
'Send SAR Marker',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
Text(
'Quick location marker',
style: TextStyle(
color: Colors.grey,
fontSize: 14,
),
),
],
), ),
), ),
const SizedBox(height: 16), IconButton(
// Title icon: const Icon(Icons.more_vert, color: Colors.white),
Row( onPressed: () {},
children: [
Icon(
Icons.add_location_alt,
size: 24,
color: Theme.of(context).colorScheme.primary,
),
const SizedBox(width: 12),
Expanded(
child: Text(
'Send SAR Marker',
style: Theme.of(context).textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
),
),
),
IconButton(
icon: const Icon(Icons.close),
onPressed: () => Navigator.pop(context),
),
],
), ),
], ],
), ),
), ),
const Divider(height: 1),
// Content // Content
Flexible( Expanded(
child: SingleChildScrollView( child: SingleChildScrollView(
padding: const EdgeInsets.all(20), padding: const EdgeInsets.all(16),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
// Marker type selection // Marker type selection
Text( const Text(
'Marker Type', 'Marker Type',
style: Theme.of(context).textTheme.titleSmall?.copyWith( style: TextStyle(
fontWeight: FontWeight.bold, color: Colors.white,
), fontSize: 16,
fontWeight: FontWeight.bold,
),
), ),
const SizedBox(height: 12), const SizedBox(height: 12),
_MarkerTypeChip( _MarkerTypeChip(
@@ -661,29 +655,37 @@ class _SarUpdateSheetState extends State<_SarUpdateSheet> {
const SizedBox(height: 24), const SizedBox(height: 24),
// Location display // Location display
Text( const Text(
'Current Location', 'Current Location',
style: Theme.of(context).textTheme.titleSmall?.copyWith( style: TextStyle(
fontWeight: FontWeight.bold, color: Colors.white,
), fontSize: 16,
fontWeight: FontWeight.bold,
),
), ),
const SizedBox(height: 12), const SizedBox(height: 12),
if (_loadingLocation) if (_loadingLocation)
Container( Container(
padding: const EdgeInsets.all(16), padding: const EdgeInsets.all(16),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surfaceContainerHighest, color: const Color(0xFF2D2D2D),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(8),
), ),
child: const Row( child: const Row(
children: [ children: [
SizedBox( SizedBox(
width: 20, width: 20,
height: 20, height: 20,
child: CircularProgressIndicator(strokeWidth: 2), child: CircularProgressIndicator(
strokeWidth: 2,
valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
),
), ),
SizedBox(width: 16), SizedBox(width: 16),
Text('Getting location...'), Text(
'Getting location...',
style: TextStyle(color: Colors.white),
),
], ],
), ),
) )
@@ -737,22 +739,18 @@ class _SarUpdateSheetState extends State<_SarUpdateSheet> {
Container( Container(
padding: const EdgeInsets.all(16), padding: const EdgeInsets.all(16),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context).colorScheme.primaryContainer.withValues(alpha: 0.3), color: const Color(0xFF2D2D2D),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(8),
border: Border.all(
color: Theme.of(context).colorScheme.primary.withValues(alpha: 0.3),
width: 1,
),
), ),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row( Row(
children: [ children: [
Icon( const Icon(
Icons.location_on, Icons.location_on,
size: 20, size: 20,
color: Theme.of(context).colorScheme.primary, color: Colors.green,
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
Expanded( Expanded(
@@ -762,11 +760,12 @@ class _SarUpdateSheetState extends State<_SarUpdateSheet> {
fontFamily: 'monospace', fontFamily: 'monospace',
fontSize: 13, fontSize: 13,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Colors.white,
), ),
), ),
), ),
IconButton( IconButton(
icon: const Icon(Icons.refresh, size: 20), icon: const Icon(Icons.refresh, size: 20, color: Colors.white),
onPressed: _getCurrentLocation, onPressed: _getCurrentLocation,
padding: EdgeInsets.zero, padding: EdgeInsets.zero,
constraints: const BoxConstraints(), constraints: const BoxConstraints(),
@@ -778,15 +777,18 @@ class _SarUpdateSheetState extends State<_SarUpdateSheet> {
const SizedBox(height: 8), const SizedBox(height: 8),
Row( Row(
children: [ children: [
Icon( const Icon(
Icons.my_location, Icons.my_location,
size: 14, size: 14,
color: Theme.of(context).colorScheme.onSurfaceVariant, color: Colors.grey,
), ),
const SizedBox(width: 6), const SizedBox(width: 6),
Text( Text(
'Accuracy: ±${_currentPosition!.accuracy!.round()}m', 'Accuracy: ±${_currentPosition!.accuracy!.round()}m',
style: Theme.of(context).textTheme.bodySmall, style: const TextStyle(
fontSize: 12,
color: Colors.grey,
),
), ),
], ],
), ),
@@ -797,89 +799,73 @@ class _SarUpdateSheetState extends State<_SarUpdateSheet> {
const SizedBox(height: 24), const SizedBox(height: 24),
// Optional notes // Optional notes
Text( const Text(
'Notes (optional)', 'Notes (optional)',
style: Theme.of(context).textTheme.titleSmall?.copyWith( style: TextStyle(
fontWeight: FontWeight.bold, color: Colors.white,
), fontSize: 16,
fontWeight: FontWeight.bold,
),
), ),
const SizedBox(height: 12), const SizedBox(height: 12),
TextField( TextField(
controller: _notesController, controller: _notesController,
maxLines: 3, maxLines: 3,
maxLength: 100, maxLength: 100,
style: const TextStyle(fontSize: 14, color: Colors.white),
decoration: InputDecoration( decoration: InputDecoration(
hintText: 'Add additional information...', hintText: 'Add additional information...',
hintStyle: const TextStyle(fontSize: 14), hintStyle: const TextStyle(fontSize: 14, color: Colors.grey),
filled: true,
fillColor: const Color(0xFF2D2D2D),
border: OutlineInputBorder( border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(8),
borderSide: BorderSide.none,
), ),
contentPadding: const EdgeInsets.all(16), contentPadding: const EdgeInsets.all(16),
), ),
style: const TextStyle(fontSize: 14),
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
], ],
), ),
), ),
), ),
// Bottom action buttons // Bottom action button
Container( Container(
padding: const EdgeInsets.all(20), padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surface,
border: Border(
top: BorderSide(
color: Theme.of(context).dividerColor,
width: 1,
),
),
),
child: SafeArea( child: SafeArea(
top: false, top: false,
child: Row( child: SizedBox(
children: [ width: double.infinity,
Expanded( child: ElevatedButton.icon(
child: OutlinedButton( onPressed: _currentPosition == null
onPressed: () => Navigator.pop(context), ? null
style: OutlinedButton.styleFrom( : () async {
padding: const EdgeInsets.symmetric(vertical: 14), await widget.onSend(
shape: RoundedRectangleBorder( _selectedType,
borderRadius: BorderRadius.circular(12), _currentPosition!,
), _notesController.text.trim().isEmpty
), ? null
child: const Text('Cancel'), : _notesController.text.trim(),
);
if (context.mounted) {
Navigator.pop(context);
}
},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.symmetric(vertical: 16),
disabledBackgroundColor: Colors.grey,
disabledForegroundColor: Colors.white70,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
), ),
), ),
const SizedBox(width: 12), icon: const Icon(Icons.send, size: 20),
Expanded( label: const Text(
flex: 2, 'Send SAR Marker',
child: FilledButton.icon( style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
onPressed: _currentPosition == null
? null
: () async {
await widget.onSend(
_selectedType,
_currentPosition!,
_notesController.text.trim().isEmpty
? null
: _notesController.text.trim(),
);
if (context.mounted) {
Navigator.pop(context);
}
},
style: FilledButton.styleFrom(
padding: const EdgeInsets.symmetric(vertical: 14),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
icon: const Icon(Icons.send, size: 20),
label: const Text('Send SAR Marker'),
),
), ),
], ),
), ),
), ),
), ),
@@ -922,36 +908,22 @@ class _MarkerTypeChip extends StatelessWidget {
return InkWell( return InkWell(
onTap: onTap, onTap: onTap,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(8),
child: Container( child: Container(
width: double.infinity, width: double.infinity,
padding: const EdgeInsets.all(16), padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: isSelected color: const Color(0xFF2D2D2D),
? color.withValues(alpha: 0.15) border: isSelected
: Colors.transparent, ? Border.all(color: color, width: 2)
border: Border.all( : null,
color: isSelected ? color : Colors.grey.withValues(alpha: 0.3), borderRadius: BorderRadius.circular(8),
width: isSelected ? 2 : 1,
),
borderRadius: BorderRadius.circular(12),
), ),
child: Row( child: Row(
children: [ children: [
Container( Text(
width: 48, type.emoji,
height: 48, style: const TextStyle(fontSize: 32),
decoration: BoxDecoration(
color: isSelected
? color.withValues(alpha: 0.2)
: Colors.grey.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(8),
),
alignment: Alignment.center,
child: Text(
type.emoji,
style: const TextStyle(fontSize: 28),
),
), ),
const SizedBox(width: 16), const SizedBox(width: 16),
Expanded( Expanded(
@@ -959,8 +931,8 @@ class _MarkerTypeChip extends StatelessWidget {
type.displayName, type.displayName,
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: isSelected ? FontWeight.bold : FontWeight.w500, fontWeight: FontWeight.w500,
color: isSelected ? color : null, color: isSelected ? color : Colors.white,
), ),
), ),
), ),
@@ -969,12 +941,6 @@ class _MarkerTypeChip extends StatelessWidget {
Icons.check_circle, Icons.check_circle,
color: color, color: color,
size: 24, size: 24,
)
else
Icon(
Icons.radio_button_unchecked,
color: Colors.grey.withValues(alpha: 0.4),
size: 24,
), ),
], ],
), ),

View File

@@ -9,10 +9,11 @@ import '../providers/messages_provider.dart';
import '../providers/app_provider.dart'; import '../providers/app_provider.dart';
import '../services/background_location_service.dart'; import '../services/background_location_service.dart';
import '../utils/sample_data_generator.dart'; import '../utils/sample_data_generator.dart';
import '../theme/app_theme.dart';
class SettingsScreen extends StatefulWidget { class SettingsScreen extends StatefulWidget {
final Function(ThemeMode) onThemeChanged; final Function(AppThemeMode) onThemeChanged;
final ThemeMode currentTheme; final AppThemeMode currentTheme;
const SettingsScreen({ const SettingsScreen({
super.key, super.key,
@@ -25,7 +26,7 @@ class SettingsScreen extends StatefulWidget {
} }
class _SettingsScreenState extends State<SettingsScreen> { class _SettingsScreenState extends State<SettingsScreen> {
late ThemeMode _selectedTheme; late AppThemeMode _selectedTheme;
PackageInfo? _packageInfo; PackageInfo? _packageInfo;
bool _isLoadingSampleData = false; bool _isLoadingSampleData = false;
double _gpsUpdateDistance = 10.0; double _gpsUpdateDistance = 10.0;
@@ -78,12 +79,12 @@ class _SettingsScreenState extends State<SettingsScreen> {
await prefs.setBool('background_tracking_enabled', _backgroundTrackingEnabled); await prefs.setBool('background_tracking_enabled', _backgroundTrackingEnabled);
} }
Future<void> _saveThemePreference(ThemeMode theme) async { Future<void> _saveThemePreference(AppThemeMode theme) async {
final prefs = await SharedPreferences.getInstance(); final prefs = await SharedPreferences.getInstance();
await prefs.setString('theme_mode', theme.name); await prefs.setString('theme_mode', theme.name);
} }
void _handleThemeChange(ThemeMode? theme) { void _handleThemeChange(AppThemeMode? theme) {
if (theme != null) { if (theme != null) {
setState(() { setState(() {
_selectedTheme = theme; _selectedTheme = theme;
@@ -250,7 +251,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
ListTile( ListTile(
leading: const Icon(Icons.palette), leading: const Icon(Icons.palette),
title: const Text('Theme'), title: const Text('Theme'),
subtitle: Text(_getThemeLabel(_selectedTheme)), subtitle: Text(AppTheme.getThemeDisplayName(_selectedTheme)),
trailing: const Icon(Icons.chevron_right), trailing: const Icon(Icons.chevron_right),
onTap: () => _showThemeDialog(), onTap: () => _showThemeDialog(),
), ),
@@ -383,17 +384,6 @@ class _SettingsScreenState extends State<SettingsScreen> {
); );
} }
String _getThemeLabel(ThemeMode mode) {
switch (mode) {
case ThemeMode.light:
return 'Light';
case ThemeMode.dark:
return 'Dark';
case ThemeMode.system:
return 'Auto (System)';
}
}
void _showGpsDistanceDialog() { void _showGpsDistanceDialog() {
double tempDistance = _gpsUpdateDistance; double tempDistance = _gpsUpdateDistance;
showDialog( showDialog(
@@ -471,40 +461,92 @@ class _SettingsScreenState extends State<SettingsScreen> {
context: context, context: context,
builder: (context) => AlertDialog( builder: (context) => AlertDialog(
title: const Text('Choose Theme'), title: const Text('Choose Theme'),
content: Column( content: SingleChildScrollView(
mainAxisSize: MainAxisSize.min, child: Column(
children: [ mainAxisSize: MainAxisSize.min,
RadioListTile<ThemeMode>( children: [
title: const Text('Light'), RadioListTile<AppThemeMode>(
subtitle: const Text('Always use light theme'), title: const Text('Light'),
value: ThemeMode.light, subtitle: const Text('Orange light theme'),
groupValue: _selectedTheme, value: AppThemeMode.light,
onChanged: (value) { groupValue: _selectedTheme,
_handleThemeChange(value); onChanged: (value) {
Navigator.pop(context); _handleThemeChange(value);
}, Navigator.pop(context);
), },
RadioListTile<ThemeMode>( ),
title: const Text('Dark'), RadioListTile<AppThemeMode>(
subtitle: const Text('Always use dark theme'), title: const Text('Dark'),
value: ThemeMode.dark, subtitle: const Text('Orange dark theme'),
groupValue: _selectedTheme, value: AppThemeMode.dark,
onChanged: (value) { groupValue: _selectedTheme,
_handleThemeChange(value); onChanged: (value) {
Navigator.pop(context); _handleThemeChange(value);
}, Navigator.pop(context);
), },
RadioListTile<ThemeMode>( ),
title: const Text('Auto (System)'), const Divider(),
subtitle: const Text('Follow system theme'), RadioListTile<AppThemeMode>(
value: ThemeMode.system, title: Row(
groupValue: _selectedTheme, children: [
onChanged: (value) { const Text('SAR Red'),
_handleThemeChange(value); const SizedBox(width: 8),
Navigator.pop(context); Container(
}, width: 16,
), height: 16,
], decoration: BoxDecoration(
color: const Color(0xFFFF5252),
shape: BoxShape.circle,
border: Border.all(color: Colors.black26),
),
),
],
),
subtitle: const Text('Alert/Emergency mode'),
value: AppThemeMode.sarRed,
groupValue: _selectedTheme,
onChanged: (value) {
_handleThemeChange(value);
Navigator.pop(context);
},
),
RadioListTile<AppThemeMode>(
title: Row(
children: [
const Text('SAR Green'),
const SizedBox(width: 8),
Container(
width: 16,
height: 16,
decoration: BoxDecoration(
color: const Color(0xFF69F0AE),
shape: BoxShape.circle,
border: Border.all(color: Colors.black26),
),
),
],
),
subtitle: const Text('Safe/All Clear mode'),
value: AppThemeMode.sarGreen,
groupValue: _selectedTheme,
onChanged: (value) {
_handleThemeChange(value);
Navigator.pop(context);
},
),
const Divider(),
RadioListTile<AppThemeMode>(
title: const Text('Auto (System)'),
subtitle: const Text('Follow system theme'),
value: AppThemeMode.system,
groupValue: _selectedTheme,
onChanged: (value) {
_handleThemeChange(value);
Navigator.pop(context);
},
),
],
),
), ),
actions: [ actions: [
TextButton( TextButton(

View File

@@ -8,6 +8,7 @@ import 'meshcore_ble_service.dart';
/// Background location tracking service for SAR operations /// Background location tracking service for SAR operations
/// Tracks user location and sends periodic updates via MeshCore BLE /// Tracks user location and sends periodic updates via MeshCore BLE
@pragma('vm:entry-point')
class BackgroundLocationService { class BackgroundLocationService {
static const String _prefKeyEnabled = 'background_tracking_enabled'; static const String _prefKeyEnabled = 'background_tracking_enabled';
static const String _prefKeyDistance = 'background_tracking_distance'; static const String _prefKeyDistance = 'background_tracking_distance';

223
lib/theme/app_theme.dart Normal file
View File

@@ -0,0 +1,223 @@
import 'package:flutter/material.dart';
enum AppThemeMode {
light,
dark,
sarRed,
sarGreen,
system,
}
class AppTheme {
// Light theme (Blue)
static ThemeData get lightTheme {
return ThemeData(
useMaterial3: true,
colorScheme: ColorScheme.fromSeed(
seedColor: Colors.blue,
brightness: Brightness.light,
),
appBarTheme: const AppBarTheme(
centerTitle: true,
elevation: 0,
),
cardTheme: CardThemeData(
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
inputDecorationTheme: InputDecorationTheme(
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
filled: true,
),
);
}
// Dark theme (Blue)
static ThemeData get darkTheme {
return ThemeData(
useMaterial3: true,
colorScheme: ColorScheme.fromSeed(
seedColor: Colors.blue,
brightness: Brightness.dark,
),
appBarTheme: const AppBarTheme(
centerTitle: true,
elevation: 0,
),
cardTheme: CardThemeData(
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
inputDecorationTheme: InputDecorationTheme(
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
filled: true,
),
);
}
// SAR Red theme (Emergency/Alert tones)
static ThemeData get sarRedTheme {
return ThemeData(
useMaterial3: true,
colorScheme: const ColorScheme.dark(
brightness: Brightness.dark,
primary: Color(0xFFFF5252), // Bright red
onPrimary: Color(0xFF000000),
primaryContainer: Color(0xFF8B0000), // Dark red
onPrimaryContainer: Color(0xFFFFCDD2),
secondary: Color(0xFFFF8A80),
onSecondary: Color(0xFF000000),
secondaryContainer: Color(0xFFB71C1C),
onSecondaryContainer: Color(0xFFFFCDD2),
tertiary: Color(0xFFFF6E40),
onTertiary: Color(0xFF000000),
error: Color(0xFFCF6679),
onError: Color(0xFF000000),
surface: Color(0xFF1A0000), // Very dark red-tinted
onSurface: Color(0xFFFFEBEE),
surfaceContainerHighest: Color(0xFF2D0000),
onSurfaceVariant: Color(0xFFFFCDD2),
outline: Color(0xFFFF5252),
),
scaffoldBackgroundColor: const Color(0xFF1A0000),
appBarTheme: const AppBarTheme(
centerTitle: true,
elevation: 0,
backgroundColor: Color(0xFF2D0000),
foregroundColor: Color(0xFFFFEBEE),
),
cardTheme: CardThemeData(
elevation: 2,
color: const Color(0xFF2D0000),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
side: const BorderSide(
color: Color(0xFFFF5252),
width: 1,
),
),
),
inputDecorationTheme: InputDecorationTheme(
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: const BorderSide(color: Color(0xFFFF5252)),
),
filled: true,
fillColor: const Color(0xFF2D0000),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFFFF5252),
foregroundColor: const Color(0xFF000000),
),
),
);
}
// SAR Green theme (All Clear/Safe tones)
static ThemeData get sarGreenTheme {
return ThemeData(
useMaterial3: true,
colorScheme: const ColorScheme.dark(
brightness: Brightness.dark,
primary: Color(0xFF69F0AE), // Bright green
onPrimary: Color(0xFF000000),
primaryContainer: Color(0xFF00695C), // Dark teal-green
onPrimaryContainer: Color(0xFFB9F6CA),
secondary: Color(0xFF64FFDA),
onSecondary: Color(0xFF000000),
secondaryContainer: Color(0xFF004D40),
onSecondaryContainer: Color(0xFFB9F6CA),
tertiary: Color(0xFF1DE9B6),
onTertiary: Color(0xFF000000),
error: Color(0xFFCF6679),
onError: Color(0xFF000000),
surface: Color(0xFF001A12), // Very dark green-tinted
onSurface: Color(0xFFE8F5E9),
surfaceContainerHighest: Color(0xFF002D1F),
onSurfaceVariant: Color(0xFFB9F6CA),
outline: Color(0xFF69F0AE),
),
scaffoldBackgroundColor: const Color(0xFF001A12),
appBarTheme: const AppBarTheme(
centerTitle: true,
elevation: 0,
backgroundColor: Color(0xFF002D1F),
foregroundColor: Color(0xFFE8F5E9),
),
cardTheme: CardThemeData(
elevation: 2,
color: const Color(0xFF002D1F),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
side: const BorderSide(
color: Color(0xFF69F0AE),
width: 1,
),
),
),
inputDecorationTheme: InputDecorationTheme(
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: const BorderSide(color: Color(0xFF69F0AE)),
),
filled: true,
fillColor: const Color(0xFF002D1F),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF69F0AE),
foregroundColor: const Color(0xFF000000),
),
),
);
}
// Get theme by mode
static ThemeData getTheme(AppThemeMode mode, Brightness systemBrightness) {
switch (mode) {
case AppThemeMode.light:
return lightTheme;
case AppThemeMode.dark:
return darkTheme;
case AppThemeMode.sarRed:
return sarRedTheme;
case AppThemeMode.sarGreen:
return sarGreenTheme;
case AppThemeMode.system:
return systemBrightness == Brightness.dark ? darkTheme : lightTheme;
}
}
// Get display name for theme mode
static String getThemeDisplayName(AppThemeMode mode) {
switch (mode) {
case AppThemeMode.light:
return 'Light';
case AppThemeMode.dark:
return 'Dark';
case AppThemeMode.sarRed:
return 'SAR Red (Alert)';
case AppThemeMode.sarGreen:
return 'SAR Green (Safe)';
case AppThemeMode.system:
return 'Auto (System)';
}
}
// Get theme mode from string
static AppThemeMode themeFromString(String themeName) {
return AppThemeMode.values.firstWhere(
(mode) => mode.name == themeName,
orElse: () => AppThemeMode.system,
);
}
}

View File

@@ -52,7 +52,7 @@ class MapMarkers {
// Marker icon // Marker icon
Container( Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.blue, color: Theme.of(context).colorScheme.primary,
shape: BoxShape.circle, shape: BoxShape.circle,
border: Border.all(color: Colors.white, width: 2), border: Border.all(color: Colors.white, width: 2),
boxShadow: [ boxShadow: [
@@ -201,7 +201,7 @@ class MapMarkers {
builder: (context) => AlertDialog( builder: (context) => AlertDialog(
title: Row( title: Row(
children: [ children: [
const Icon(Icons.person, color: Colors.blue), Icon(Icons.person, color: Theme.of(context).colorScheme.primary),
const SizedBox(width: 8), const SizedBox(width: 8),
Expanded(child: Text(contact.displayName)), Expanded(child: Text(contact.displayName)),
], ],
@@ -275,7 +275,7 @@ class MapMarkers {
final diff = DateTime.now().difference(updateTime); final diff = DateTime.now().difference(updateTime);
if (diff.inMinutes < 5) return Colors.green; // Very recent if (diff.inMinutes < 5) return Colors.green; // Very recent
if (diff.inMinutes < 30) return Colors.blue; // Recent if (diff.inMinutes < 30) return Colors.lightBlue; // Recent
if (diff.inHours < 2) return Colors.orange; // Getting old if (diff.inHours < 2) return Colors.orange; // Getting old
return Colors.red; // Stale return Colors.red; // Stale
} }