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

feat: Add support for offline vector maps using MBTiles

Browse Source 
- Introduced new MapLayerType for vector MBTiles.
- Enhanced MapLayer class to handle vector-specific properties.
- Implemented MBTilesService for managing MBTiles files, including import and deletion functionalities.
- Updated MapManagementScreen to allow importing and managing MBTiles files.
- Added UI components for displaying and interacting with MBTiles layers.
- Integrated vector tile rendering in MapTab, supporting dynamic theme loading.
- Updated pubspec.yaml to include necessary dependencies for MBTiles and vector tiles.
This commit is contained in:
Janez T
2025-10-16 23:35:43 +02:00
parent 7f20e5ad36
commit 3a0bcabdea
26 changed files with 2042 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

295
lib/screens/map_management_screen.dart
View File

@@ -1,8 +1,11 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
import 'package:file_picker/file_picker.dart';
import '../services/tile_cache_service.dart';
import '../services/validation_service.dart';
import '../services/mbtiles_service.dart';
import '../models/map_layer.dart';
import '../l10n/app_localizations.dart';
@@ -28,6 +31,8 @@ class _MapManagementScreenState extends State<MapManagementScreen> {
bool _isLoading = false;
String? _statusMessage;
Map<String, dynamic>? _cacheStats;
final MbtilesService _mbtilesService = MbtilesService();
List<MbtilesMetadata> _mbtilesFiles = [];
// Download parameters
late MapLayer _selectedLayer;
@@ -77,6 +82,7 @@ class _MapManagementScreenState extends State<MapManagementScreen> {
}
_loadCacheStats();
_loadMbtilesFiles();
}
@override
@@ -107,6 +113,111 @@ class _MapManagementScreenState extends State<MapManagementScreen> {
}
}
Future<void> _loadMbtilesFiles() async {
if (!mounted) return;
try {
final files = await _mbtilesService.getAllMetadata();
if (!mounted) return;
setState(() {
_mbtilesFiles = files;
});
} catch (e) {
debugPrint('Error loading MBTiles files: $e');
}
}
Future<void> _importMbtilesFile() async {
try {
final result = await FilePicker.platform.pickFiles(
type: FileType.custom,
allowedExtensions: ['mbtiles'],
);
if (result == null || result.files.isEmpty) return;
final sourcePath = result.files.first.path;
if (sourcePath == null) return;
if (!mounted) return;
setState(() => _isLoading = true);
final importedFile = await _mbtilesService.importMbtilesFile(sourcePath);
if (!mounted) return;
setState(() => _isLoading = false);
if (importedFile != null) {
await _loadMbtilesFiles();
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(AppLocalizations.of(context)!.mbtilesImportedSuccessfully),
backgroundColor: Colors.green,
),
);
}
} else {
_showError(AppLocalizations.of(context)!.failedToImportMbtiles);
}
} catch (e) {
if (!mounted) return;
setState(() => _isLoading = false);
_showError('${AppLocalizations.of(context)!.failedToImportMbtiles}: $e');
}
}
Future<void> _deleteMbtilesFile(MbtilesMetadata metadata) async {
final confirmed = await showDialog<bool>(
context: context,
builder: (context) => AlertDialog(
title: Text(AppLocalizations.of(context)!.deleteMbtilesConfirmTitle),
content: Text(
AppLocalizations.of(context)!.deleteMbtilesConfirmMessage(metadata.name),
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, false),
child: Text(AppLocalizations.of(context)!.cancel),
),
TextButton(
onPressed: () => Navigator.pop(context, true),
style: TextButton.styleFrom(foregroundColor: Colors.red),
child: Text(AppLocalizations.of(context)!.delete),
),
],
),
);
if (confirmed != true) return;
if (!mounted) return;
setState(() => _isLoading = true);
try {
final success = await _mbtilesService.deleteMbtilesFile(metadata.file);
if (!mounted) return;
setState(() => _isLoading = false);
if (success) {
await _loadMbtilesFiles();
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(AppLocalizations.of(context)!.mbtilesDeletedSuccessfully),
backgroundColor: Colors.green,
),
);
}
} else {
_showError(AppLocalizations.of(context)!.failedToDeleteMbtiles);
}
} catch (e) {
if (!mounted) return;
setState(() => _isLoading = false);
_showError('${AppLocalizations.of(context)!.failedToDeleteMbtiles}: $e');
}
}
Future<void> _downloadRegion() async {
final validator = ValidationService();
@@ -309,6 +420,10 @@ class _MapManagementScreenState extends State<MapManagementScreen> {
_buildStatisticsCard(),
const SizedBox(height: 16),
// Offline Vector Maps (MBTiles)
_buildMbtilesCard(),
const SizedBox(height: 16),
// Download Region
_buildDownloadCard(),
const SizedBox(height: 16),
@@ -382,6 +497,172 @@ class _MapManagementScreenState extends State<MapManagementScreen> {
);
}
Widget _buildMbtilesCard() {
return Card(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text(
AppLocalizations.of(context)!.offlineVectorMaps,
style: Theme.of(context).textTheme.titleLarge,
overflow: TextOverflow.ellipsis,
),
),
IconButton(
icon: const Icon(Icons.refresh),
onPressed: _loadMbtilesFiles,
),
],
),
const SizedBox(height: 8),
Text(
AppLocalizations.of(context)!.offlineVectorMapsDescription,
style: TextStyle(fontSize: 12, color: Colors.grey[600]),
),
const SizedBox(height: 16),
// List of MBTiles files
if (_mbtilesFiles.isEmpty)
Center(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
Icon(Icons.map_outlined, size: 48, color: Colors.grey[400]),
const SizedBox(height: 8),
Text(
AppLocalizations.of(context)!.noMbtilesFiles,
style: TextStyle(color: Colors.grey[600]),
),
],
),
),
)
else
..._mbtilesFiles.map((metadata) => Card(
color: Theme.of(context).colorScheme.surfaceContainerHighest,
margin: const EdgeInsets.only(bottom: 8),
child: ExpansionTile(
leading: Icon(
metadata.isVector ? Icons.layers : Icons.image,
color: metadata.isVector ? Colors.blue : Colors.orange,
),
title: Text(
metadata.name,
style: const TextStyle(fontWeight: FontWeight.bold),
),
subtitle: Text(
'${metadata.fileSizeFormatted} • ${metadata.format?.toUpperCase() ?? "Unknown"}',
),
children: [
Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (metadata.description != null) ...[
Text(
metadata.description!,
style: TextStyle(color: Colors.grey[700]),
),
const SizedBox(height: 12),
],
_buildInfoRow(
AppLocalizations.of(context)!.zoomLevels,
'${metadata.minZoom ?? "?"} - ${metadata.maxZoom ?? "?"}',
),
if (metadata.bounds != null)
_buildInfoRow(
AppLocalizations.of(context)!.bounds,
metadata.bounds!,
),
if (metadata.isVector) ...[
_buildInfoRow(
AppLocalizations.of(context)!.type,
AppLocalizations.of(context)!.vectorTiles,
),
_buildInfoRow(
AppLocalizations.of(context)!.schema,
_mbtilesService.getVectorSchema(metadata) ??
AppLocalizations.of(context)!.unknown,
),
],
const SizedBox(height: 12),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
TextButton.icon(
onPressed: () => _deleteMbtilesFile(metadata),
icon: const Icon(Icons.delete, color: Colors.red),
label: Text(
AppLocalizations.of(context)!.delete,
style: const TextStyle(color: Colors.red),
),
),
],
),
],
),
),
],
),
)),
const SizedBox(height: 16),
// Import button
ElevatedButton.icon(
onPressed: _importMbtilesFile,
icon: const Icon(Icons.file_upload),
label: Text(AppLocalizations.of(context)!.importMbtiles),
style: ElevatedButton.styleFrom(
minimumSize: const Size.fromHeight(48),
),
),
const SizedBox(height: 8),
Text(
AppLocalizations.of(context)!.importMbtilesNote,
style: TextStyle(fontSize: 12, color: Colors.grey[600]),
),
],
),
),
);
}
Widget _buildInfoRow(String label, String value) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 4),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: 100,
child: Text(
label,
style: TextStyle(
fontWeight: FontWeight.w500,
color: Colors.grey[700],
),
),
),
Expanded(
child: Text(
value,
style: TextStyle(color: Colors.grey[800]),
),
),
],
),
);
}
Widget _buildDownloadCard() {
return Card(
child: Padding(
@@ -559,13 +840,17 @@ class _MapManagementScreenState extends State<MapManagementScreen> {
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
_statusMessage ?? AppLocalizations.of(context)!.downloadingDots,
style: TextStyle(
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onPrimaryContainer,
Expanded(
child: Text(
_statusMessage ?? AppLocalizations.of(context)!.downloadingDots,
style: TextStyle(
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onPrimaryContainer,
),
overflow: TextOverflow.ellipsis,
),
),
const SizedBox(width: 8),
Text(
'${_downloadProgress.toStringAsFixed(1)}%',
style: TextStyle(

225
lib/screens/map_tab.dart
View File

@@ -1,12 +1,17 @@
import 'dart:async';
import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart' as flutter_map;
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
import 'package:provider/provider.dart';
import 'package:geolocator/geolocator.dart';
import 'package:flutter_compass/flutter_compass.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:vector_map_tiles/vector_map_tiles.dart';
import 'package:vector_tile_renderer/vector_tile_renderer.dart' as vtr;
import 'package:http/http.dart' as http;
import '../providers/contacts_provider.dart';
import '../providers/messages_provider.dart';
import '../providers/map_provider.dart';
@@ -21,6 +26,7 @@ import '../services/tile_cache_service.dart';
import '../services/background_location_service.dart';
import '../services/location_tracking_service.dart';
import '../services/map_marker_service.dart';
import '../services/mbtiles_service.dart';
import '../widgets/map_debug_info.dart';
import '../widgets/map/map_legend.dart';
import '../widgets/map/compass_widget.dart';
@@ -61,6 +67,13 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
StreamSubscription<CompassEvent>? _compassStreamSubscription;
final BackgroundLocationService _backgroundLocationService = BackgroundLocationService();
// MBTiles layers
List<MapLayer> _mbtilesLayers = [];
// Vector tile theme
vtr.Theme? _vectorTheme;
bool _isLoadingTheme = false;
// Dropped pin state
LatLng? _droppedPinLocation;
bool _isDraggingPin = false;
@@ -81,6 +94,7 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
void initState() {
super.initState();
_loadSettings();
_loadMbtilesLayers();
_initializeTileCache();
_initLocationTracking();
_startCompassTracking();
@@ -172,6 +186,39 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
);
}
/// Load MBTiles layers from file system
Future<void> _loadMbtilesLayers() async {
try {
final mbtilesService = MbtilesService();
final metadata = await mbtilesService.getAllMetadata();
if (mounted) {
setState(() {
_mbtilesLayers = metadata.map((meta) {
// Determine if data is gzipped (for Geofabrik files)
final isGzipped = meta.format == 'pbf';
return MapLayer.fromMbtilesFile(
name: meta.name,
mbtilesFile: meta.file,
styleUrl: 'https://tiles.openfreemap.org/styles/bright',
sourceName: 'openmaptiles',
maxZoom: 20.0, // Override to 20 for overzooming
isGzipped: isGzipped,
attribution: meta.attribution,
);
}).toList();
});
debugPrint('Loaded ${_mbtilesLayers.length} MBTiles layers');
}
} catch (e) {
debugPrint('Error loading MBTiles layers: $e');
}
}
/// Get all available layers (default + MBTiles)
List<MapLayer> get _allLayers => [...MapLayer.allLayers, ..._mbtilesLayers];
Future<void> _loadSettings() async {
final prefs = await SharedPreferences.getInstance();
if (mounted) {
@@ -180,8 +227,9 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
final lastLon = prefs.getDouble('map_last_longitude');
final lastZoom = prefs.getDouble('map_last_zoom');
// Load last map layer if available
final lastLayerIndex = prefs.getInt('map_last_layer');
// Load last map layer
final lastLayerType = prefs.getInt('map_last_layer_type');
final lastLayerName = prefs.getString('map_last_layer_name');
setState(() {
_showLegend = prefs.getBool('map_show_legend') ?? false;
@@ -202,9 +250,23 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
_savedMapZoom = lastZoom;
}
// Restore last used map layer
if (lastLayerIndex != null && lastLayerIndex >= 0 && lastLayerIndex < MapLayer.allLayers.length) {
_currentLayer = MapLayer.allLayers[lastLayerIndex];
// Restore last used map layer (by type and name for MBTiles)
if (lastLayerType != null) {
final layerType = MapLayerType.values[lastLayerType];
if (layerType == MapLayerType.vectorMbtiles && lastLayerName != null) {
// Find MBTiles layer by name
final mbtilesLayer = _mbtilesLayers.firstWhere(
(layer) => layer.name == lastLayerName,
orElse: () => MapLayer.openStreetMap,
);
_currentLayer = mbtilesLayer;
} else {
// Use default layer
_currentLayer = MapLayer.allLayers.firstWhere(
(layer) => layer.type == layerType,
orElse: () => MapLayer.openStreetMap,
);
}
}
});
}
@@ -218,7 +280,12 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
await prefs.setBool('map_fullscreen', _isFullscreen);
await prefs.setDouble('map_gps_update_distance', _gpsUpdateDistance);
await prefs.setBool('background_tracking_enabled', _backgroundTrackingEnabled);
await prefs.setInt('map_last_layer', MapLayer.allLayers.indexOf(_currentLayer));
// Save layer type and name (for MBTiles layers)
await prefs.setInt('map_last_layer_type', _currentLayer.type.index);
if (_currentLayer.type == MapLayerType.vectorMbtiles) {
await prefs.setString('map_last_layer_name', _currentLayer.name);
}
}
Future<void> _saveMapPosition() async {
@@ -344,6 +411,45 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
);
}
/// Load vector tile theme from URL
Future<void> _loadVectorTheme(String styleUrl) async {
if (_isLoadingTheme) return;
setState(() {
_isLoadingTheme = true;
});
try {
final response = await http.get(Uri.parse(styleUrl));
if (response.statusCode == 200) {
final styleJson = jsonDecode(response.body) as Map<String, Object?>;
final theme = vtr.ThemeReader().read(styleJson);
if (mounted) {
setState(() {
_vectorTheme = theme;
_isLoadingTheme = false;
});
}
} else {
throw Exception('Failed to load style: ${response.statusCode}');
}
} catch (e) {
debugPrint('Error loading vector theme: $e');
if (mounted) {
setState(() {
_isLoadingTheme = false;
});
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('Failed to load map style: $e'),
backgroundColor: Colors.red,
),
);
}
}
}
void _showLayerSelector(BuildContext context) {
showModalBottomSheet(
context: context,
@@ -378,20 +484,76 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
),
),
const Divider(),
...MapLayer.allLayers.map((layer) => ListTile(
leading: _currentLayer.type == layer.type
? const Icon(Icons.check_circle, color: Colors.green)
: const Icon(Icons.radio_button_unchecked),
title: Text(layer.getLocalizedName(context)),
subtitle: Text(layer.attribution),
onTap: () {
setState(() {
_currentLayer = layer;
});
_saveSettings();
Navigator.pop(context);
},
)),
Expanded(
child: ListView(
shrinkWrap: true,
children: [
// Online layers section
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Text(
AppLocalizations.of(context)!.onlineLayers,
style: Theme.of(context).textTheme.labelLarge?.copyWith(
color: Colors.grey[600],
),
),
),
...MapLayer.allLayers.map((layer) => ListTile(
leading: _currentLayer == layer
? const Icon(Icons.check_circle, color: Colors.green)
: const Icon(Icons.radio_button_unchecked),
title: Text(layer.getLocalizedName(context)),
subtitle: Text(layer.attribution),
onTap: () async {
setState(() {
_currentLayer = layer;
});
_saveSettings();
Navigator.pop(context);
},
)),
// Offline MBTiles layers section
if (_mbtilesLayers.isNotEmpty) ...[
const Divider(),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Text(
AppLocalizations.of(context)!.offlineLayers,
style: Theme.of(context).textTheme.labelLarge?.copyWith(
color: Colors.grey[600],
),
),
),
..._mbtilesLayers.map((layer) => ListTile(
leading: _currentLayer == layer
? const Icon(Icons.check_circle, color: Colors.green)
: Icon(
layer.isVector ? Icons.layers : Icons.image,
color: layer.isVector ? Colors.blue : Colors.orange,
),
title: Text(layer.name),
subtitle: Text(layer.attribution),
onTap: () async {
// Load vector theme if switching to vector layer
if (layer.isVector && layer.styleUrl != null) {
Navigator.pop(context);
await _loadVectorTheme(layer.styleUrl!);
}
setState(() {
_currentLayer = layer;
});
_saveSettings();
if (!layer.isVector) {
Navigator.pop(context);
}
},
)),
],
],
),
),
],
),
),
@@ -946,12 +1108,23 @@ class _MapTabState extends State<MapTab> with AutomaticKeepAliveClientMixin {
},
),
children: [
TileLayer(
urlTemplate: _currentLayer.urlTemplate,
tileProvider: _tileCache.getTileProvider(_currentLayer),
userAgentPackageName: 'com.meshcore.sar',
maxZoom: _currentLayer.maxZoom,
),
// Render vector or raster tile layer based on layer type
if (_currentLayer.isVector && _vectorTheme != null)
VectorTileLayer(
theme: _vectorTheme!,
tileProviders: TileProviders({
_currentLayer.sourceName ?? 'default':
_tileCache.getVectorTileProvider(_currentLayer)!,
}),
maximumZoom: _currentLayer.maxZoom,
)
else if (!_currentLayer.isVector)
flutter_map.TileLayer(
urlTemplate: _currentLayer.urlTemplate,
tileProvider: _tileCache.getTileProvider(_currentLayer),
userAgentPackageName: 'com.meshcore.sar',
maxZoom: _currentLayer.maxZoom,
),
// Advertisement path polylines (rendered before markers)
Consumer<MapProvider>(
builder: (context, mapProvider, _) {