Flutter OpenStreetMap 中用户的实时位置

Question

我的团队正在构建一个关于实时公交车监控的 Flutter 应用程序。我们能够获取用户的当前位置，但无法获取用户移动时的位置。另一个问题是我们使用 OpenStreetMaps。查看 YouTube 后，大多数视频都使用 Google 地图。我真的不知道如何编写这个代码。

Answer 1

import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:location/location.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MapScreen(),
    );
  }
}

class MapScreen extends StatefulWidget {
  @override
  _MapScreenState createState() => _MapScreenState();
}

class _MapScreenState extends State<MapScreen> {
  LocationData _currentLocation;
  Location location = Location();

  @override
  void initState() {
    super.initState();
    checkLocationPermission();
    _getCurrentLocation();
    // Uncomment the line below to enable real-time location updates
    // _startLocationUpdates();
  }

  Future<void> checkLocationPermission() async {
    bool serviceEnabled;
    PermissionStatus permissionGranted;

    serviceEnabled = await location.serviceEnabled();
    if (!serviceEnabled) {
      serviceEnabled = await location.requestService();
      if (!serviceEnabled) {
        // Handle the case where the user denies service enablement
        return;
      }
    }

    permissionGranted = await location.hasPermission();
    if (permissionGranted == PermissionStatus.denied) {
      permissionGranted = await location.requestPermission();
      if (permissionGranted != PermissionStatus.granted) {
        // Handle the case where the user denies the permission
        return;
      }
    }
  }

  Future<void> _getCurrentLocation() async {
    LocationData locationData = await location.getLocation();
    setState(() {
      _currentLocation = locationData;
    });
  }

  void _startLocationUpdates() {
    location.onLocationChanged.listen((LocationData currentLocation) {
      setState(() {
        _currentLocation = currentLocation;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Real-time Bus Monitoring'),
      ),
      body: FlutterMap(
        options: MapOptions(
          center: LatLng(
            _currentLocation?.latitude ?? 0.0,
            _currentLocation?.longitude ?? 0.0,
          ),
          zoom: 13.0,
        ),
        layers: [
          TileLayerOptions(
            urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
            subdomains: ['a', 'b', 'c'],
          ),
          MarkerLayerOptions(
            markers: [
              Marker(
                width: 80.0,
                height: 80.0,
                point: LatLng(
                  _currentLocation?.latitude ?? 0.0,
                  _currentLocation?.longitude ?? 0.0,
                ),
                builder: (ctx) => Icon(
                  Icons.location_on,
                  color: Colors.red,
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    // Ensure to dispose of location subscriptions to avoid memory leaks
    location.dispose();
    super.dispose();
  }
}