North-up compass and rotation lock

This commit is contained in:
stopflock
2025-10-22 15:27:28 -05:00
parent ee3906df80
commit cd2ab00042
19 changed files with 340 additions and 40 deletions
+5
View File
@@ -130,6 +130,7 @@ class AppState extends ChangeNotifier {
int get maxCameras => _settingsState.maxCameras;
UploadMode get uploadMode => _settingsState.uploadMode;
FollowMeMode get followMeMode => _settingsState.followMeMode;
bool get northLockEnabled => _settingsState.northLockEnabled;
bool get proximityAlertsEnabled => _settingsState.proximityAlertsEnabled;
int get proximityAlertDistance => _settingsState.proximityAlertDistance;
bool get networkStatusIndicatorEnabled => _settingsState.networkStatusIndicatorEnabled;
@@ -409,6 +410,10 @@ class AppState extends ChangeNotifier {
Future<void> setFollowMeMode(FollowMeMode mode) async {
await _settingsState.setFollowMeMode(mode);
}
Future<void> setNorthLockEnabled(bool enabled) async {
await _settingsState.setNorthLockEnabled(enabled);
}
/// Set proximity alerts enabled/disabled
Future<void> setProximityAlertsEnabled(bool enabled) async {
+3
View File
@@ -68,6 +68,9 @@ const Duration kDebounceCameraRefresh = Duration(milliseconds: 500);
const double kPreFetchAreaExpansionMultiplier = 3.0; // Expand visible bounds by this factor for pre-fetching
const int kPreFetchZoomLevel = 10; // Always pre-fetch at this zoom level for consistent area sizes
const int kMaxPreFetchSplitDepth = 3; // Maximum recursive splits when hitting Overpass node limit
// North lock configuration
const double kNorthLockDisableThresholdDegrees = 10.0; // Rotation threshold to disable north lock (degrees)
const int kDataRefreshIntervalSeconds = 60; // Refresh cached data after this many seconds
// Follow-me mode smooth transitions
+2 -2
View File
@@ -19,8 +19,8 @@
"clear": "Löschen"
},
"followMe": {
"off": "Verfolgung aktivieren (Norden oben)",
"northUp": "Verfolgung aktivieren (Rotation)",
"off": "Verfolgung aktivieren",
"follow": "Verfolgung aktivieren (Rotation)",
"rotating": "Verfolgung deaktivieren"
},
"settings": {
+2 -2
View File
@@ -36,8 +36,8 @@
"clear": "Clear"
},
"followMe": {
"off": "Enable follow-me (north up)",
"northUp": "Enable follow-me (rotating)",
"off": "Enable follow-me",
"follow": "Enable follow-me (rotating)",
"rotating": "Disable follow-me"
},
"settings": {
+2 -2
View File
@@ -36,8 +36,8 @@
"clear": "Limpiar"
},
"followMe": {
"off": "Activar seguimiento (norte arriba)",
"northUp": "Activar seguimiento (rotación)",
"off": "Activar seguimiento",
"follow": "Activar seguimiento (rotación)",
"rotating": "Desactivar seguimiento"
},
"settings": {
+2 -2
View File
@@ -36,8 +36,8 @@
"clear": "Effacer"
},
"followMe": {
"off": "Activer le suivi (nord en haut)",
"northUp": "Activer le suivi (rotation)",
"off": "Activer le suivi",
"follow": "Activer le suivi (rotation)",
"rotating": "Désactiver le suivi"
},
"settings": {
+2 -2
View File
@@ -36,8 +36,8 @@
"clear": "Pulisci"
},
"followMe": {
"off": "Attiva seguimi (nord in alto)",
"northUp": "Attiva seguimi (rotazione)",
"off": "Attiva seguimi",
"follow": "Attiva seguimi (rotazione)",
"rotating": "Disattiva seguimi"
},
"settings": {
+2 -2
View File
@@ -36,8 +36,8 @@
"clear": "Limpar"
},
"followMe": {
"off": "Ativar seguir-me (norte para cima)",
"northUp": "Ativar seguir-me (rotação)",
"off": "Ativar seguir-me",
"follow": "Ativar seguir-me (rotação)",
"rotating": "Desativar seguir-me"
},
"settings": {
+2 -2
View File
@@ -36,8 +36,8 @@
"clear": "清空"
},
"followMe": {
"off": "启用跟随模式(北向上)",
"northUp": "启用跟随模式(旋转)",
"off": "启用跟随模式",
"follow": "启用跟随模式(旋转)",
"rotating": "禁用跟随模式"
},
"settings": {
+6 -6
View File
@@ -72,8 +72,8 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
switch (mode) {
case FollowMeMode.off:
return locService.t('followMe.off');
case FollowMeMode.northUp:
return locService.t('followMe.northUp');
case FollowMeMode.follow:
return locService.t('followMe.follow');
case FollowMeMode.rotating:
return locService.t('followMe.rotating');
}
@@ -83,7 +83,7 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
switch (mode) {
case FollowMeMode.off:
return Icons.gps_off;
case FollowMeMode.northUp:
case FollowMeMode.follow:
return Icons.gps_fixed;
case FollowMeMode.rotating:
return Icons.navigation;
@@ -93,8 +93,8 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
FollowMeMode _getNextFollowMeMode(FollowMeMode mode) {
switch (mode) {
case FollowMeMode.off:
return FollowMeMode.northUp;
case FollowMeMode.northUp:
return FollowMeMode.follow;
case FollowMeMode.follow:
return FollowMeMode.rotating;
case FollowMeMode.rotating:
return FollowMeMode.off;
@@ -296,7 +296,7 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
userLocation = _mapViewKey.currentState?.getUserLocation();
if (userLocation != null && appState.shouldAutoEnableFollowMe(userLocation)) {
debugPrint('[HomeScreen] Auto-enabling follow-me mode - user within 1km of start');
appState.setFollowMeMode(FollowMeMode.northUp);
appState.setFollowMeMode(FollowMeMode.follow);
enableFollowMe = true;
}
} catch (e) {
+27 -3
View File
@@ -12,8 +12,8 @@ enum UploadMode { production, sandbox, simulate }
// Enum for follow-me mode (moved from HomeScreen to centralized state)
enum FollowMeMode {
off, // No following
northUp, // Follow position, keep north up
rotating, // Follow position and rotation
follow, // Follow position, preserve current rotation
rotating, // Follow position and rotation based on heading
}
class SettingsState extends ChangeNotifier {
@@ -24,6 +24,7 @@ class SettingsState extends ChangeNotifier {
static const String _selectedTileTypePrefsKey = 'selected_tile_type';
static const String _legacyTestModePrefsKey = 'test_mode';
static const String _followMeModePrefsKey = 'follow_me_mode';
static const String _northLockEnabledPrefsKey = 'north_lock_enabled';
static const String _proximityAlertsEnabledPrefsKey = 'proximity_alerts_enabled';
static const String _proximityAlertDistancePrefsKey = 'proximity_alert_distance';
static const String _networkStatusIndicatorEnabledPrefsKey = 'network_status_indicator_enabled';
@@ -32,7 +33,8 @@ class SettingsState extends ChangeNotifier {
bool _offlineMode = false;
int _maxCameras = 250;
UploadMode _uploadMode = kEnableDevelopmentModes ? UploadMode.simulate : UploadMode.production;
FollowMeMode _followMeMode = FollowMeMode.northUp;
FollowMeMode _followMeMode = FollowMeMode.follow;
bool _northLockEnabled = false;
bool _proximityAlertsEnabled = false;
int _proximityAlertDistance = kProximityAlertDefaultDistance;
bool _networkStatusIndicatorEnabled = false;
@@ -45,6 +47,7 @@ class SettingsState extends ChangeNotifier {
int get maxCameras => _maxCameras;
UploadMode get uploadMode => _uploadMode;
FollowMeMode get followMeMode => _followMeMode;
bool get northLockEnabled => _northLockEnabled;
bool get proximityAlertsEnabled => _proximityAlertsEnabled;
int get proximityAlertDistance => _proximityAlertDistance;
bool get networkStatusIndicatorEnabled => _networkStatusIndicatorEnabled;
@@ -97,6 +100,9 @@ class SettingsState extends ChangeNotifier {
_maxCameras = prefs.getInt(_maxCamerasPrefsKey) ?? 250;
}
// Load north lock enabled setting
_northLockEnabled = prefs.getBool(_northLockEnabledPrefsKey) ?? false;
// Load proximity alerts settings
_proximityAlertsEnabled = prefs.getBool(_proximityAlertsEnabledPrefsKey) ?? false;
_proximityAlertDistance = prefs.getInt(_proximityAlertDistancePrefsKey) ?? kProximityAlertDefaultDistance;
@@ -291,11 +297,29 @@ class SettingsState extends ChangeNotifier {
Future<void> setFollowMeMode(FollowMeMode mode) async {
if (_followMeMode != mode) {
_followMeMode = mode;
// Disable north lock when switching to rotating mode (incompatible)
if (mode == FollowMeMode.rotating && _northLockEnabled) {
_northLockEnabled = false;
final prefs = await SharedPreferences.getInstance();
await prefs.setBool(_northLockEnabledPrefsKey, false);
}
final prefs = await SharedPreferences.getInstance();
await prefs.setInt(_followMeModePrefsKey, mode.index);
notifyListeners();
}
}
/// Set north lock enabled/disabled
Future<void> setNorthLockEnabled(bool enabled) async {
if (_northLockEnabled != enabled) {
_northLockEnabled = enabled;
final prefs = await SharedPreferences.getInstance();
await prefs.setBool(_northLockEnabledPrefsKey, enabled);
notifyListeners();
}
}
/// Set proximity alerts enabled/disabled
Future<void> setProximityAlertsEnabled(bool enabled) async {
+161
View File
@@ -0,0 +1,161 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map_animations/flutter_map_animations.dart';
import 'package:provider/provider.dart';
import '../app_state.dart';
/// A compass indicator widget that shows the current map rotation and allows tapping to enable/disable north lock.
/// The compass appears in the top-right corner of the map and is disabled (non-interactive) when in follow+rotate mode.
class CompassIndicator extends StatefulWidget {
final AnimatedMapController mapController;
const CompassIndicator({
super.key,
required this.mapController,
});
@override
State<CompassIndicator> createState() => _CompassIndicatorState();
}
class _CompassIndicatorState extends State<CompassIndicator> {
double _lastRotation = 0.0;
@override
Widget build(BuildContext context) {
return Consumer<AppState>(
builder: (context, appState, child) {
// Get current map rotation in degrees
double rotationDegrees = 0.0;
try {
rotationDegrees = widget.mapController.mapController.camera.rotation;
} catch (_) {
// Map controller not ready yet
}
// Convert degrees to radians for Transform.rotate (flutter_map uses degrees)
final rotationRadians = rotationDegrees * (pi / 180);
// Check if we're in follow+rotate mode (compass should be disabled)
final isDisabled = appState.followMeMode == FollowMeMode.rotating;
final northLockEnabled = appState.northLockEnabled;
// Force rebuild when north lock changes by comparing rotation
if (northLockEnabled && rotationDegrees != _lastRotation) {
WidgetsBinding.instance.addPostFrameCallback((_) {
if (mounted) setState(() {});
});
}
_lastRotation = rotationDegrees;
return Positioned(
top: (appState.uploadMode == UploadMode.sandbox || appState.uploadMode == UploadMode.simulate) ? 60 : 18,
right: 16,
child: GestureDetector(
onTap: isDisabled ? null : () {
// Toggle north lock (but not when in follow+rotate mode)
final newNorthLockEnabled = !northLockEnabled;
appState.setNorthLockEnabled(newNorthLockEnabled);
// If enabling north lock, animate to north-up orientation
if (newNorthLockEnabled) {
try {
widget.mapController.animateTo(
dest: widget.mapController.mapController.camera.center,
zoom: widget.mapController.mapController.camera.zoom,
rotation: 0.0,
duration: const Duration(milliseconds: 500),
curve: Curves.easeOut,
);
} catch (_) {
// Controller not ready, ignore
}
}
},
child: Container(
width: 52,
height: 52,
decoration: BoxDecoration(
color: isDisabled
? Colors.grey.withOpacity(0.8)
: Colors.white.withOpacity(0.95),
shape: BoxShape.circle,
border: Border.all(
color: isDisabled
? Colors.grey.shade400
: (northLockEnabled
? Theme.of(context).colorScheme.primary
: Colors.grey.shade300),
width: northLockEnabled ? 3.0 : 2.0,
),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.25),
blurRadius: 6,
offset: const Offset(0, 3),
),
],
),
child: Stack(
children: [
// Compass face with cardinal directions
Center(
child: Container(
width: 40,
height: 40,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: isDisabled
? Colors.grey.shade200
: Colors.grey.shade50,
),
),
),
// North indicator that rotates with map rotation
Transform.rotate(
angle: rotationRadians, // Rotate same direction as map rotation to counter-act it
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// North arrow (red triangle pointing up)
Container(
margin: const EdgeInsets.only(top: 6),
child: Icon(
Icons.keyboard_arrow_up,
size: 20,
color: isDisabled
? Colors.grey.shade600
: (northLockEnabled
? Colors.red.shade700
: Colors.red.shade600),
),
),
// Small 'N' label
Text(
'N',
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.bold,
color: isDisabled
? Colors.grey.shade600
: (northLockEnabled
? Colors.red.shade700
: Colors.red.shade600),
),
),
],
),
),
),
],
),
),
),
);
},
);
}
}
+10 -3
View File
@@ -55,7 +55,7 @@ class GpsController {
_currentLatLng != null) {
try {
if (newMode == FollowMeMode.northUp) {
if (newMode == FollowMeMode.follow) {
controller.animateTo(
dest: _currentLatLng!,
zoom: controller.mapController.camera.zoom,
@@ -89,6 +89,8 @@ class GpsController {
int proximityAlertDistance = 200,
List<OsmNode> nearbyNodes = const [],
List<NodeProfile> enabledProfiles = const [],
// Optional parameter for north lock functionality
bool northLockEnabled = false,
}) {
final latLng = LatLng(position.latitude, position.longitude);
_currentLatLng = latLng;
@@ -111,11 +113,13 @@ class GpsController {
debugPrint('[GpsController] GPS position update: ${latLng.latitude}, ${latLng.longitude}, follow-me: $followMeMode');
WidgetsBinding.instance.addPostFrameCallback((_) {
try {
if (followMeMode == FollowMeMode.northUp) {
// Follow position only, keep current rotation
if (followMeMode == FollowMeMode.follow) {
// Follow position only, keep current rotation (unless north lock is enabled)
final rotation = northLockEnabled ? 0.0 : controller.mapController.camera.rotation;
controller.animateTo(
dest: latLng,
zoom: controller.mapController.camera.zoom,
rotation: rotation,
duration: kFollowMeAnimationDuration,
curve: Curves.easeOut,
);
@@ -153,6 +157,7 @@ class GpsController {
required int Function() getProximityAlertDistance,
required List<OsmNode> Function() getNearbyNodes,
required List<NodeProfile> Function() getEnabledProfiles,
required bool Function() getNorthLockEnabled,
}) async {
final perm = await Geolocator.requestPermission();
if (perm == LocationPermission.denied ||
@@ -168,6 +173,7 @@ class GpsController {
final proximityAlertDistance = getProximityAlertDistance();
final nearbyNodes = getNearbyNodes();
final enabledProfiles = getEnabledProfiles();
final northLockEnabled = getNorthLockEnabled();
processPositionUpdate(
position: position,
@@ -178,6 +184,7 @@ class GpsController {
proximityAlertDistance: proximityAlertDistance,
nearbyNodes: nearbyNodes,
enabledProfiles: enabledProfiles,
northLockEnabled: northLockEnabled,
);
});
}
+13 -6
View File
@@ -1,16 +1,18 @@
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map_animations/flutter_map_animations.dart';
import 'package:provider/provider.dart';
import '../../app_state.dart';
import '../../dev_config.dart';
import '../../services/localization_service.dart';
import '../camera_icon.dart';
import '../compass_indicator.dart';
import 'layer_selector_button.dart';
/// Widget that renders all map overlay UI elements
class MapOverlays extends StatelessWidget {
final MapController mapController;
final AnimatedMapController mapController;
final UploadMode uploadMode;
final AddNodeSession? session;
final EditNodeSession? editSession;
@@ -82,6 +84,11 @@ class MapOverlays extends StatelessWidget {
),
),
// Compass indicator (top-right, below mode indicator)
CompassIndicator(
mapController: mapController,
),
// Zoom indicator, positioned relative to button bar
Positioned(
left: 10,
@@ -96,7 +103,7 @@ class MapOverlays extends StatelessWidget {
builder: (context) {
double zoom = 15.0; // fallback
try {
zoom = mapController.camera.zoom;
zoom = mapController.mapController.camera.zoom;
} catch (_) {
// Map controller not ready yet
}
@@ -173,8 +180,8 @@ class MapOverlays extends StatelessWidget {
heroTag: "zoom_in",
onPressed: () {
try {
final zoom = mapController.camera.zoom;
mapController.move(mapController.camera.center, zoom + 1);
final zoom = mapController.mapController.camera.zoom;
mapController.mapController.move(mapController.mapController.camera.center, zoom + 1);
} catch (_) {
// Map controller not ready yet
}
@@ -188,8 +195,8 @@ class MapOverlays extends StatelessWidget {
heroTag: "zoom_out",
onPressed: () {
try {
final zoom = mapController.camera.zoom;
mapController.move(mapController.camera.center, zoom - 1);
final zoom = mapController.mapController.camera.zoom;
mapController.mapController.move(mapController.mapController.camera.center, zoom - 1);
} catch (_) {
// Map controller not ready yet
}
+54 -2
View File
@@ -74,6 +74,9 @@ class MapViewState extends State<MapView> {
// Track map center to clear queue on significant panning
LatLng? _lastCenter;
// Track rotation to detect intentional vs accidental rotation
double? _lastRotation;
// State for proximity alert banner
bool _showProximityBanner = false;
@@ -178,6 +181,17 @@ class MapViewState extends State<MapView> {
}
return [];
},
getNorthLockEnabled: () {
if (mounted) {
try {
return context.read<AppState>().northLockEnabled;
} catch (e) {
debugPrint('[MapView] Could not read north lock enabled: $e');
return false;
}
}
return false;
},
);
// Fetch initial cameras
@@ -544,7 +558,45 @@ class MapViewState extends State<MapView> {
maxZoom: (appState.selectedTileType?.maxZoom ?? 18).toDouble(),
onPositionChanged: (pos, gesture) {
setState(() {}); // Instant UI update for zoom, etc.
if (gesture) widget.onUserGesture();
if (gesture) {
widget.onUserGesture();
// Handle north lock: prevent rotation or disable lock if user rotates significantly
if (appState.northLockEnabled) {
try {
final currentRotation = pos.rotation;
if (_lastRotation != null) {
// Calculate rotation change since last gesture
final rotationChange = (currentRotation - _lastRotation!).abs();
// If user tries to rotate significantly, disable north lock and allow it
if (rotationChange > kNorthLockDisableThresholdDegrees) {
appState.setNorthLockEnabled(false);
// Allow this rotation to proceed
} else {
// Small rotation or zoom gesture - force map back to north (0°)
if (currentRotation.abs() > 0.1) { // Only correct if actually rotated
WidgetsBinding.instance.addPostFrameCallback((_) {
try {
_controller.animateTo(
dest: pos.center,
zoom: pos.zoom,
rotation: 0.0,
duration: const Duration(milliseconds: 100), // Quick snap back
curve: Curves.easeOut,
);
} catch (_) {
// Controller not ready, ignore
}
});
}
}
}
_lastRotation = currentRotation;
} catch (_) {
// Controller not ready, ignore
}
}
}
if (session != null) {
appState.updateSession(target: pos.center);
@@ -622,7 +674,7 @@ class MapViewState extends State<MapView> {
// All map overlays (mode indicator, zoom, attribution, add pin)
MapOverlays(
mapController: _controller.mapController,
mapController: _controller,
uploadMode: appState.uploadMode,
session: session,
editSession: editSession,