687 lines
24 KiB
Dart
687 lines
24 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_map/flutter_map.dart';
|
|
import 'package:latlong2/latlong.dart';
|
|
import 'package:geolocator/geolocator.dart';
|
|
import 'package:permission_handler/permission_handler.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import '../../providers/api_provider.dart';
|
|
import '../../models/post.dart';
|
|
import 'beacon_detail_screen.dart';
|
|
import 'create_beacon_sheet.dart';
|
|
|
|
class BeaconScreen extends ConsumerStatefulWidget {
|
|
final LatLng? initialMapCenter;
|
|
|
|
const BeaconScreen({super.key, this.initialMapCenter});
|
|
|
|
@override
|
|
ConsumerState<BeaconScreen> createState() => _BeaconScreenState();
|
|
}
|
|
|
|
class _BeaconScreenState extends ConsumerState<BeaconScreen> {
|
|
final MapController _mapController = MapController();
|
|
final DraggableScrollableController _sheetController = DraggableScrollableController();
|
|
|
|
List<Post> _beacons = [];
|
|
bool _isLoading = false;
|
|
bool _isLoadingLocation = false;
|
|
|
|
late LatLng _mapCenter;
|
|
LatLng? _userLocation;
|
|
|
|
bool _locationPermissionGranted = false;
|
|
double _currentZoom = 14.0;
|
|
bool _suppressAutoCenterOnUser = false;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_mapCenter = widget.initialMapCenter ?? const LatLng(37.7749, -122.4194);
|
|
_suppressAutoCenterOnUser = widget.initialMapCenter != null;
|
|
if (widget.initialMapCenter != null) {
|
|
_loadBeacons(center: widget.initialMapCenter);
|
|
}
|
|
_checkLocationPermission();
|
|
}
|
|
|
|
Future<void> _checkLocationPermission() async {
|
|
final status = await Permission.location.status;
|
|
if (mounted) {
|
|
setState(() => _locationPermissionGranted = status.isGranted);
|
|
if (status.isGranted) {
|
|
await _getCurrentLocation(forceCenter: !_suppressAutoCenterOnUser);
|
|
await _loadBeacons();
|
|
}
|
|
}
|
|
}
|
|
|
|
Future<void> _requestLocationPermission() async {
|
|
setState(() => _isLoadingLocation = true);
|
|
try {
|
|
final status = await Permission.location.request();
|
|
setState(() => _locationPermissionGranted = status.isGranted);
|
|
if (status.isGranted) {
|
|
await _getCurrentLocation(forceCenter: !_suppressAutoCenterOnUser);
|
|
await _loadBeacons();
|
|
} else {
|
|
if (!mounted) return;
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(content: Text('Location access is required to show nearby incidents.')),
|
|
);
|
|
}
|
|
} finally {
|
|
if (mounted) setState(() => _isLoadingLocation = false);
|
|
}
|
|
}
|
|
|
|
Future<void> _getCurrentLocation({bool forceCenter = false}) async {
|
|
if (!_locationPermissionGranted) return;
|
|
setState(() => _isLoadingLocation = true);
|
|
try {
|
|
final position = await Geolocator.getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
|
|
if (mounted) {
|
|
setState(() {
|
|
_userLocation = LatLng(position.latitude, position.longitude);
|
|
if (forceCenter || !_suppressAutoCenterOnUser) {
|
|
_mapController.move(_userLocation!, _currentZoom);
|
|
_suppressAutoCenterOnUser = false;
|
|
}
|
|
});
|
|
}
|
|
} catch (e) {
|
|
if (mounted) {
|
|
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Could not get location: $e')));
|
|
}
|
|
} finally {
|
|
if (mounted) setState(() => _isLoadingLocation = false);
|
|
}
|
|
}
|
|
|
|
Future<void> _loadBeacons({LatLng? center}) async {
|
|
final target = center ?? _userLocation ?? _mapCenter;
|
|
setState(() => _isLoading = true);
|
|
try {
|
|
final apiService = ref.read(apiServiceProvider);
|
|
final beacons = await apiService.fetchNearbyBeacons(
|
|
lat: target.latitude,
|
|
long: target.longitude,
|
|
radius: 16000,
|
|
);
|
|
if (mounted) setState(() { _beacons = beacons; _isLoading = false; });
|
|
} catch (e) {
|
|
if (mounted) setState(() => _isLoading = false);
|
|
}
|
|
}
|
|
|
|
void _onMapPositionChanged(MapCamera camera, bool hasGesture) {
|
|
_mapCenter = camera.center;
|
|
_currentZoom = camera.zoom;
|
|
if (hasGesture) _loadBeacons(center: _mapCenter);
|
|
}
|
|
|
|
void _onMarkerTap(Post post) {
|
|
Navigator.of(context).push(MaterialPageRoute(
|
|
builder: (context) => BeaconDetailScreen(beaconPost: post),
|
|
));
|
|
}
|
|
|
|
void _onCreateBeacon() {
|
|
showModalBottomSheet(
|
|
context: context,
|
|
backgroundColor: Colors.transparent,
|
|
isScrollControlled: true,
|
|
builder: (context) => CreateBeaconSheet(
|
|
centerLat: _mapCenter.latitude,
|
|
centerLong: _mapCenter.longitude,
|
|
onBeaconCreated: (post) {
|
|
setState(() => _beacons.add(post));
|
|
_loadBeacons();
|
|
},
|
|
),
|
|
);
|
|
}
|
|
|
|
// ─── Severity summary helpers ─────────────────
|
|
int get _criticalCount => _beacons.where((b) => b.severity == 'critical').length;
|
|
int get _highCount => _beacons.where((b) => b.severity == 'high').length;
|
|
int get _mediumCount => _beacons.where((b) => b.severity == 'medium').length;
|
|
|
|
String get _safetyStatusText {
|
|
final total = _beacons.length;
|
|
if (total == 0) return 'No incidents nearby';
|
|
final critical = _criticalCount;
|
|
final high = _highCount;
|
|
if (critical > 0) return '$critical critical incident${critical > 1 ? 's' : ''} nearby';
|
|
if (high > 0) return '$high danger alert${high > 1 ? 's' : ''} nearby';
|
|
return '$total incident${total > 1 ? 's' : ''} nearby';
|
|
}
|
|
|
|
Color get _safetyStatusColor {
|
|
if (_criticalCount > 0) return Colors.red;
|
|
if (_highCount > 0) return Colors.deepOrange;
|
|
if (_mediumCount > 0) return Colors.amber;
|
|
return Colors.green;
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
if (!_locationPermissionGranted) {
|
|
return Scaffold(body: _buildLocationPermissionOverlay(context));
|
|
}
|
|
|
|
return Scaffold(
|
|
body: Stack(
|
|
children: [
|
|
// Full-screen dark map
|
|
_buildMap(),
|
|
|
|
// Top bar overlay
|
|
_buildTopBar(context),
|
|
|
|
// Draggable bottom sheet — the "Radar" overlay
|
|
DraggableScrollableSheet(
|
|
controller: _sheetController,
|
|
initialChildSize: 0.12,
|
|
minChildSize: 0.12,
|
|
maxChildSize: 0.75,
|
|
snap: true,
|
|
snapSizes: const [0.12, 0.45, 0.75],
|
|
builder: (context, scrollController) {
|
|
return Container(
|
|
decoration: BoxDecoration(
|
|
color: const Color(0xFF1A1A2E),
|
|
borderRadius: const BorderRadius.vertical(top: Radius.circular(20)),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: Colors.black.withValues(alpha: 0.4),
|
|
blurRadius: 20,
|
|
offset: const Offset(0, -4),
|
|
),
|
|
],
|
|
),
|
|
child: CustomScrollView(
|
|
controller: scrollController,
|
|
slivers: [
|
|
// Handle + safety status (collapsed view)
|
|
SliverToBoxAdapter(child: _buildSheetHeader()),
|
|
|
|
// Incident list (expanded view)
|
|
if (_beacons.isEmpty)
|
|
SliverToBoxAdapter(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(32),
|
|
child: Center(
|
|
child: Column(
|
|
children: [
|
|
Icon(Icons.shield, color: Colors.green.withValues(alpha: 0.5), size: 48),
|
|
const SizedBox(height: 12),
|
|
Text('All clear in your area',
|
|
style: TextStyle(color: Colors.white.withValues(alpha: 0.6), fontSize: 14)),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
)
|
|
else
|
|
SliverList(
|
|
delegate: SliverChildBuilderDelegate(
|
|
(context, index) => _buildIncidentCard(_beacons[index]),
|
|
childCount: _beacons.length,
|
|
),
|
|
),
|
|
|
|
// Bottom padding
|
|
const SliverToBoxAdapter(child: SizedBox(height: 40)),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
|
|
// Safety FAB — high contrast report button
|
|
Positioned(
|
|
bottom: 100,
|
|
right: 16,
|
|
child: _buildSafetyFab(),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSheetHeader() {
|
|
return GestureDetector(
|
|
onTap: () {
|
|
final currentSize = _sheetController.size;
|
|
if (currentSize < 0.3) {
|
|
_sheetController.animateTo(0.45, duration: const Duration(milliseconds: 300), curve: Curves.easeOut);
|
|
} else {
|
|
_sheetController.animateTo(0.12, duration: const Duration(milliseconds: 300), curve: Curves.easeOut);
|
|
}
|
|
},
|
|
child: Container(
|
|
padding: const EdgeInsets.fromLTRB(20, 12, 20, 16),
|
|
child: Column(
|
|
children: [
|
|
// Drag handle
|
|
Container(
|
|
width: 40, height: 4,
|
|
decoration: BoxDecoration(
|
|
color: Colors.white.withValues(alpha: 0.3),
|
|
borderRadius: BorderRadius.circular(2),
|
|
),
|
|
),
|
|
const SizedBox(height: 12),
|
|
// Safety status row
|
|
Row(
|
|
children: [
|
|
Container(
|
|
width: 10, height: 10,
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: _safetyStatusColor,
|
|
boxShadow: [BoxShadow(color: _safetyStatusColor.withValues(alpha: 0.5), blurRadius: 6)],
|
|
),
|
|
),
|
|
const SizedBox(width: 10),
|
|
Expanded(
|
|
child: Text(_safetyStatusText,
|
|
style: const TextStyle(color: Colors.white, fontSize: 15, fontWeight: FontWeight.w600)),
|
|
),
|
|
if (_isLoading)
|
|
const SizedBox(width: 16, height: 16, child: CircularProgressIndicator(strokeWidth: 2, color: Colors.white54)),
|
|
const SizedBox(width: 8),
|
|
Text('${_beacons.length}', style: TextStyle(color: Colors.white.withValues(alpha: 0.5), fontSize: 13)),
|
|
Icon(Icons.keyboard_arrow_up, color: Colors.white.withValues(alpha: 0.4), size: 20),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildIncidentCard(Post post) {
|
|
final beacon = post.toBeacon();
|
|
final severityColor = beacon.pinColor;
|
|
final isRecent = beacon.isRecent;
|
|
|
|
return GestureDetector(
|
|
onTap: () => _onMarkerTap(post),
|
|
child: Container(
|
|
margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: const Color(0xFF16213E),
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(
|
|
color: isRecent ? severityColor.withValues(alpha: 0.6) : Colors.white.withValues(alpha: 0.08),
|
|
),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
// Severity indicator
|
|
Container(
|
|
width: 40, height: 40,
|
|
decoration: BoxDecoration(
|
|
color: severityColor.withValues(alpha: 0.2),
|
|
borderRadius: BorderRadius.circular(10),
|
|
),
|
|
child: Icon(beacon.beaconType.icon, color: severityColor, size: 22),
|
|
),
|
|
const SizedBox(width: 12),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: Text(beacon.beaconType.displayName,
|
|
style: const TextStyle(color: Colors.white, fontSize: 14, fontWeight: FontWeight.w600),
|
|
overflow: TextOverflow.ellipsis),
|
|
),
|
|
if (isRecent)
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
|
decoration: BoxDecoration(
|
|
color: Colors.red.withValues(alpha: 0.2),
|
|
borderRadius: BorderRadius.circular(4),
|
|
),
|
|
child: const Text('LIVE', style: TextStyle(color: Colors.red, fontSize: 9, fontWeight: FontWeight.bold)),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 3),
|
|
Text(beacon.body, maxLines: 1, overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(color: Colors.white.withValues(alpha: 0.6), fontSize: 12)),
|
|
const SizedBox(height: 4),
|
|
Row(
|
|
children: [
|
|
Icon(Icons.schedule, size: 11, color: Colors.white.withValues(alpha: 0.4)),
|
|
const SizedBox(width: 3),
|
|
Text(beacon.getTimeAgo(), style: TextStyle(color: Colors.white.withValues(alpha: 0.4), fontSize: 11)),
|
|
const SizedBox(width: 10),
|
|
Icon(Icons.location_on, size: 11, color: Colors.white.withValues(alpha: 0.4)),
|
|
const SizedBox(width: 3),
|
|
Text(beacon.getFormattedDistance(), style: TextStyle(color: Colors.white.withValues(alpha: 0.4), fontSize: 11)),
|
|
const Spacer(),
|
|
Icon(Icons.visibility, size: 11, color: Colors.white.withValues(alpha: 0.4)),
|
|
const SizedBox(width: 3),
|
|
Text('${beacon.verificationCount}', style: TextStyle(color: Colors.white.withValues(alpha: 0.4), fontSize: 11)),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildMap() {
|
|
return FlutterMap(
|
|
mapController: _mapController,
|
|
options: MapOptions(
|
|
initialCenter: _mapCenter,
|
|
initialZoom: _currentZoom,
|
|
onPositionChanged: _onMapPositionChanged,
|
|
minZoom: 3.0,
|
|
maxZoom: 19.0,
|
|
),
|
|
children: [
|
|
// Dark mode tiles for tactical feel
|
|
TileLayer(
|
|
urlTemplate: 'https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png',
|
|
subdomains: const ['a', 'b', 'c', 'd'],
|
|
userAgentPackageName: 'com.sojorn.app',
|
|
retinaMode: RetinaMode.isHighDensity(context),
|
|
),
|
|
MarkerLayer(
|
|
markers: [
|
|
..._beacons.map((beacon) => _createMarker(beacon)),
|
|
if (_locationPermissionGranted && _userLocation != null)
|
|
_createUserLocationMarker(),
|
|
],
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _buildTopBar(BuildContext context) {
|
|
return Positioned(
|
|
top: 0, left: 0, right: 0,
|
|
child: SafeArea(
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
|
decoration: BoxDecoration(
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topCenter,
|
|
end: Alignment.bottomCenter,
|
|
colors: [Colors.black.withValues(alpha: 0.8), Colors.transparent],
|
|
),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
IconButton(
|
|
onPressed: () => Navigator.of(context).pop(),
|
|
icon: const Icon(Icons.arrow_back, color: Colors.white),
|
|
style: IconButton.styleFrom(backgroundColor: Colors.black26),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text('Beacon Network',
|
|
style: Theme.of(context).textTheme.titleMedium?.copyWith(color: Colors.white, fontWeight: FontWeight.bold)),
|
|
Text('${_beacons.length} incident${_beacons.length != 1 ? 's' : ''} nearby',
|
|
style: Theme.of(context).textTheme.bodySmall?.copyWith(color: Colors.white70)),
|
|
],
|
|
),
|
|
),
|
|
if (_isLoading || _isLoadingLocation)
|
|
const Padding(
|
|
padding: EdgeInsets.only(right: 8),
|
|
child: SizedBox(width: 18, height: 18, child: CircularProgressIndicator(strokeWidth: 2, valueColor: AlwaysStoppedAnimation<Color>(Colors.white))),
|
|
),
|
|
IconButton(
|
|
onPressed: _isLoadingLocation ? null : () => _getCurrentLocation(forceCenter: true),
|
|
icon: const Icon(Icons.my_location, color: Colors.white),
|
|
style: IconButton.styleFrom(backgroundColor: Colors.black26),
|
|
),
|
|
IconButton(
|
|
onPressed: () => _loadBeacons(),
|
|
icon: const Icon(Icons.refresh, color: Colors.white),
|
|
style: IconButton.styleFrom(backgroundColor: Colors.black26),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSafetyFab() {
|
|
return FloatingActionButton(
|
|
heroTag: 'safety_report',
|
|
onPressed: _onCreateBeacon,
|
|
backgroundColor: Colors.red,
|
|
foregroundColor: Colors.white,
|
|
elevation: 8,
|
|
child: const Icon(Icons.warning_rounded, size: 28),
|
|
);
|
|
}
|
|
|
|
Widget _buildLocationPermissionOverlay(BuildContext context) {
|
|
return Container(
|
|
color: const Color(0xFF0F0F23),
|
|
child: Center(
|
|
child: Container(
|
|
margin: const EdgeInsets.all(32),
|
|
padding: const EdgeInsets.all(32),
|
|
decoration: BoxDecoration(
|
|
color: const Color(0xFF1A1A2E),
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
const Icon(Icons.shield, size: 64, color: Colors.red),
|
|
const SizedBox(height: 24),
|
|
Text('Enable Location',
|
|
style: Theme.of(context).textTheme.headlineSmall?.copyWith(fontWeight: FontWeight.bold, color: Colors.white),
|
|
textAlign: TextAlign.center),
|
|
const SizedBox(height: 16),
|
|
Text('Location access is required to show safety alerts in your area.',
|
|
style: Theme.of(context).textTheme.bodyMedium?.copyWith(color: Colors.white70),
|
|
textAlign: TextAlign.center),
|
|
const SizedBox(height: 24),
|
|
ElevatedButton.icon(
|
|
onPressed: _isLoadingLocation ? null : _requestLocationPermission,
|
|
icon: _isLoadingLocation
|
|
? const SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2))
|
|
: const Icon(Icons.location_on),
|
|
label: const Text('Allow Location'),
|
|
style: ElevatedButton.styleFrom(backgroundColor: Colors.red, foregroundColor: Colors.white),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Marker _createMarker(Post post) {
|
|
final beacon = post.toBeacon();
|
|
final severityColor = beacon.pinColor;
|
|
final typeIcon = beacon.beaconType.icon;
|
|
final isRecent = beacon.isRecent;
|
|
|
|
final fallbackBase = _userLocation ?? _mapCenter;
|
|
final markerPosition = (post.latitude != null && post.longitude != null)
|
|
? LatLng(post.latitude!, post.longitude!)
|
|
: LatLng(
|
|
fallbackBase.latitude + ((post.distanceMeters ?? 0) / 111000),
|
|
fallbackBase.longitude + ((post.distanceMeters ?? 0) / 111000),
|
|
);
|
|
|
|
return Marker(
|
|
point: markerPosition,
|
|
width: 48,
|
|
height: 48,
|
|
child: GestureDetector(
|
|
onTap: () => _onMarkerTap(post),
|
|
child: _SeverityMarker(
|
|
color: severityColor,
|
|
icon: typeIcon,
|
|
isRecent: isRecent,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Marker _createUserLocationMarker() {
|
|
return Marker(
|
|
point: _userLocation!,
|
|
width: 40,
|
|
height: 40,
|
|
child: _PulsingLocationIndicator(),
|
|
);
|
|
}
|
|
}
|
|
|
|
// ─── Severity-colored Marker with pulse for recent ─────────────
|
|
class _SeverityMarker extends StatefulWidget {
|
|
final Color color;
|
|
final IconData icon;
|
|
final bool isRecent;
|
|
|
|
const _SeverityMarker({
|
|
required this.color,
|
|
required this.icon,
|
|
required this.isRecent,
|
|
});
|
|
|
|
@override
|
|
State<_SeverityMarker> createState() => _SeverityMarkerState();
|
|
}
|
|
|
|
class _SeverityMarkerState extends State<_SeverityMarker>
|
|
with SingleTickerProviderStateMixin {
|
|
late AnimationController _controller;
|
|
late Animation<double> _pulseAnimation;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_controller = AnimationController(
|
|
duration: const Duration(milliseconds: 1200),
|
|
vsync: this,
|
|
);
|
|
|
|
if (widget.isRecent) {
|
|
_pulseAnimation = Tween<double>(begin: 0.85, end: 1.15).animate(
|
|
CurvedAnimation(parent: _controller, curve: Curves.easeInOut),
|
|
);
|
|
_controller.repeat(reverse: true);
|
|
} else {
|
|
_pulseAnimation = const AlwaysStoppedAnimation(1.0);
|
|
}
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_controller.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return AnimatedBuilder(
|
|
animation: _pulseAnimation,
|
|
builder: (context, child) {
|
|
return Transform.scale(
|
|
scale: _pulseAnimation.value,
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: widget.color,
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: widget.color.withValues(alpha: widget.isRecent ? 0.6 : 0.3),
|
|
blurRadius: widget.isRecent ? 12 : 6,
|
|
spreadRadius: widget.isRecent ? 3 : 0,
|
|
),
|
|
],
|
|
),
|
|
child: Icon(widget.icon, color: Colors.white, size: 26),
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|
|
|
|
// ─── Pulsing user location dot ─────────────
|
|
class _PulsingLocationIndicator extends StatefulWidget {
|
|
@override
|
|
State<_PulsingLocationIndicator> createState() => _PulsingLocationIndicatorState();
|
|
}
|
|
|
|
class _PulsingLocationIndicatorState extends State<_PulsingLocationIndicator>
|
|
with SingleTickerProviderStateMixin {
|
|
late AnimationController _controller;
|
|
late Animation<double> _animation;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_controller = AnimationController(
|
|
duration: const Duration(milliseconds: 1500),
|
|
vsync: this,
|
|
)..repeat(reverse: false);
|
|
_animation = Tween<double>(begin: 0.4, end: 1.0).animate(
|
|
CurvedAnimation(parent: _controller, curve: Curves.easeOut),
|
|
);
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_controller.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return AnimatedBuilder(
|
|
animation: _animation,
|
|
builder: (context, child) {
|
|
return Stack(
|
|
alignment: Alignment.center,
|
|
children: [
|
|
Container(
|
|
width: 40, height: 40,
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: Colors.blue.withValues(alpha: 0.3 * (1 - _animation.value)),
|
|
border: Border.all(color: Colors.blue.withValues(alpha: 0.5 * (1 - _animation.value)), width: 2),
|
|
),
|
|
),
|
|
Container(
|
|
width: 16, height: 16,
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: Colors.blue,
|
|
border: Border.all(color: Colors.white, width: 3),
|
|
boxShadow: [BoxShadow(color: Colors.black.withValues(alpha: 0.3), blurRadius: 4, spreadRadius: 1)],
|
|
),
|
|
),
|
|
],
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|