ua1zbe/meshcore-sar_android
1
0
Fork 0
mirror of https://github.com/dz0ny/meshcore-sar.git synced 2026-08-12 00:40:28 +00:00
Code Issues Packages Projects Releases 1 Wiki Activity

feat: Add LocationDisplay widget for reusable location display with modal formats

Browse Source 
feat: Enhance CompassContactList and CompassSarList with relative bearing display
refactor: Update DetailedCompassDialog to integrate LocationDisplay and improve layout
This commit is contained in:
Janez T
2025-10-15 10:39:14 +02:00
parent 86711dbb27
commit dbaf09e701
4 changed files with 410 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
lib/widgets/map/compass/compass_contact_list.dart
View File

@@ -8,6 +8,7 @@ import '../../../models/contact.dart';
class CompassContactList extends StatelessWidget {
final List<Contact> contacts;
final Position? position;
final double? heading;
final Contact? selectedContact;
final ValueChanged<Contact?> onContactTap;
@@ -15,6 +16,7 @@ class CompassContactList extends StatelessWidget {
super.key,
required this.contacts,
required this.position,
this.heading,
required this.selectedContact,
required this.onContactTap,
});
@@ -106,11 +108,24 @@ class CompassContactList extends StatelessWidget {
'${_bearingToCardinal(bearing)} • ${_formatDistance(distance)}',
style: Theme.of(context).textTheme.bodySmall,
),
trailing: Text(
'${bearing.round()}°',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
fontWeight: FontWeight.bold,
trailing: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'${bearing.round()}°',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
fontWeight: FontWeight.bold,
),
),
if (heading != null)
Text(
_formatRelativeBearing(bearing, heading!),
style: Theme.of(context).textTheme.labelSmall?.copyWith(
color: Colors.grey,
),
),
],
),
onTap: () {
if (selectedContact == contact) {
@@ -173,4 +188,27 @@ class CompassContactList extends StatelessWidget {
return '${(meters / 1000).toStringAsFixed(1)}km';
}
}
String _formatRelativeBearing(double bearing, double heading) {
// Calculate relative bearing (how much to turn from current heading)
double relative = bearing - heading;
// Normalize to -180 to +180
while (relative > 180) {
relative -= 360;
}
while (relative < -180) {
relative += 360;
}
final absRelative = relative.abs().round();
if (absRelative < 10) {
return 'ahead';
} else if (relative > 0) {
return '$absRelative° right';
} else {
return '$absRelative° left';
}
}
}

46
lib/widgets/map/compass/compass_sar_list.dart
View File

@@ -8,6 +8,7 @@ import '../../../models/sar_marker.dart';
class CompassSarList extends StatelessWidget {
final List<SarMarker> sarMarkers;
final Position? position;
final double? heading;
final SarMarker? selectedSarMarker;
final ValueChanged<SarMarker?> onSarMarkerTap;
@@ -15,6 +16,7 @@ class CompassSarList extends StatelessWidget {
super.key,
required this.sarMarkers,
required this.position,
this.heading,
required this.selectedSarMarker,
required this.onSarMarkerTap,
});
@@ -125,11 +127,24 @@ class CompassSarList extends StatelessWidget {
'${_bearingToCardinal(bearing)} • ${_formatDistance(distance)} • ${marker.timeAgo}',
style: Theme.of(context).textTheme.bodySmall,
),
trailing: Text(
'${bearing.round()}°',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
fontWeight: FontWeight.bold,
trailing: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'${bearing.round()}°',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
fontWeight: FontWeight.bold,
),
),
if (heading != null)
Text(
_formatRelativeBearing(bearing, heading!),
style: Theme.of(context).textTheme.labelSmall?.copyWith(
color: Colors.grey,
),
),
],
),
onTap: () {
if (selectedSarMarker == marker) {
@@ -192,4 +207,27 @@ class CompassSarList extends StatelessWidget {
return '${(meters / 1000).toStringAsFixed(1)}km';
}
}
String _formatRelativeBearing(double bearing, double heading) {
// Calculate relative bearing (how much to turn from current heading)
double relative = bearing - heading;
// Normalize to -180 to +180
while (relative > 180) {
relative -= 360;
}
while (relative < -180) {
relative += 360;
}
final absRelative = relative.abs().round();
if (absRelative < 10) {
return 'ahead';
} else if (relative > 0) {
return '$absRelative° right';
} else {
return '$absRelative° left';
}
}
}

95
lib/widgets/map/detailed_compass_dialog.dart
View File

@@ -6,6 +6,7 @@ import 'package:flutter_compass/flutter_compass.dart';
import 'package:latlong2/latlong.dart';
import '../../models/contact.dart';
import '../../models/sar_marker.dart';
import '../common/location_display.dart';
import 'compass/compass_header.dart';
import 'compass/compass_filters.dart';
import 'compass/compass_sar_list.dart';
@@ -147,6 +148,39 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
_previousScale = 1.0;
}
// Calculate appropriate zoom level for selected item
void _autoZoomForSelection() {
if (_currentPosition == null) return;
double? targetDistance;
if (_selectedContact != null && _selectedContact!.displayLocation != null) {
targetDistance = _calculateDistance(
_currentPosition!.latitude,
_currentPosition!.longitude,
_selectedContact!.displayLocation!.latitude,
_selectedContact!.displayLocation!.longitude,
);
} else if (_selectedSarMarker != null) {
targetDistance = _calculateDistance(
_currentPosition!.latitude,
_currentPosition!.longitude,
_selectedSarMarker!.location.latitude,
_selectedSarMarker!.location.longitude,
);
}
if (targetDistance != null) {
// Calculate zoom level to fit target within 70% of compass radius
// Base distance at 1x zoom is 1000m
// We want target at 70% of radius, so: targetDistance / zoomLevel = 700m
final targetZoom = (targetDistance / 700.0).clamp(_minZoom, _maxZoom);
setState(() {
_zoomLevel = targetZoom;
});
}
}
@override
Widget build(BuildContext context) {
final heading = currentHeading;
@@ -258,6 +292,7 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
CompassContactList(
contacts: widget.contacts,
position: position,
heading: heading,
selectedContact: _selectedContact,
onContactTap: (contact) {
setState(() {
@@ -266,6 +301,7 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
_selectedSarMarker = null;
}
});
_autoZoomForSelection();
},
),
// SAR Markers list
@@ -273,6 +309,7 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
CompassSarList(
sarMarkers: _getFilteredSarMarkers(),
position: position,
heading: heading,
selectedSarMarker: _selectedSarMarker,
onSarMarkerTap: (marker) {
setState(() {
@@ -281,6 +318,7 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
_selectedContact = null;
}
});
_autoZoomForSelection();
},
),
],
@@ -384,14 +422,14 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
margin: const EdgeInsets.symmetric(horizontal: 16),
elevation: 4,
child: Padding(
padding: const EdgeInsets.all(16),
padding: const EdgeInsets.all(12),
child: Column(
children: [
// Header with icon and title
Row(
children: [
Container(
padding: const EdgeInsets.all(12),
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: color.withValues(alpha: 0.2),
shape: BoxShape.circle,
@@ -399,25 +437,25 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
child: _selectedContact != null && _selectedContact!.roleEmoji != null
? Text(
_selectedContact!.roleEmoji!,
style: const TextStyle(fontSize: 32),
style: const TextStyle(fontSize: 24),
)
: Icon(icon, size: 32, color: color),
: Icon(icon, size: 24, color: color),
),
const SizedBox(width: 16),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: Theme.of(context).textTheme.titleLarge?.copyWith(
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
if (additionalInfo != null)
Text(
additionalInfo,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: Colors.grey,
),
),
@@ -425,7 +463,9 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
),
),
IconButton(
icon: const Icon(Icons.close),
icon: const Icon(Icons.close, size: 20),
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
onPressed: () {
setState(() {
_selectedContact = null;
@@ -436,9 +476,9 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
],
),
if (bearing != null && distance != null) ...[
const SizedBox(height: 16),
const Divider(),
const SizedBox(height: 16),
const SizedBox(height: 12),
const Divider(height: 1),
const SizedBox(height: 12),
// Distance and bearing info
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
@@ -466,29 +506,10 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
),
],
),
const SizedBox(height: 12),
// Coordinates
const SizedBox(height: 8),
// Coordinates with modal
if (targetLocation != null)
Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(8),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.location_on, size: 16),
const SizedBox(width: 8),
Text(
'${targetLocation.latitude.toStringAsFixed(5)}, ${targetLocation.longitude.toStringAsFixed(5)}',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
fontFamily: 'monospace',
),
),
],
),
),
LocationDisplay(location: targetLocation),
],
],
),
@@ -505,18 +526,18 @@ class _DetailedCompassDialogState extends State<DetailedCompassDialog> {
) {
return Column(
children: [
Icon(icon, size: 28, color: color),
const SizedBox(height: 8),
Icon(icon, size: 20, color: color),
const SizedBox(height: 4),
Text(
value,
style: Theme.of(context).textTheme.headlineSmall?.copyWith(
style: Theme.of(context).textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
color: color,
),
),
Text(
label,
style: Theme.of(context).textTheme.bodySmall,
style: Theme.of(context).textTheme.labelSmall,
),
],
);