Flutter地图显示当前位置标记报错：Null check operator used on a null value

问题根源 #

1. 初始空值强制解包：currentposition初始为null，但在MapOptions.center里直接用!强制解包，页面首次渲染时必然触发空值错误。
2. 位置获取方法未执行：getCurrentPosition方法仅定义未调用，永远拿不到用户位置数据。
3. 经纬度顺序颠倒：Marker的point参数里把经度和纬度写反，会导致标记显示在错误区域。
4. 权限与服务检查逻辑漏洞：原代码中status.isDenied && !serviceEnabling的判断逻辑错误，未分别处理权限拒绝和位置服务未启用的场景。

修复步骤 #

1. 设置默认初始位置：给地图中心提供默认坐标，避免初始空值异常。
2. 初始化时调用位置获取：在initState中执行getCurrentPosition，页面加载时就开始获取位置。
3. 修正经纬度顺序：调整Marker的point参数顺序，遵循LatLng(纬度, 经度)的规范。
4. 完善权限与服务检查：分别处理权限拒绝、位置服务未启用的情况，给用户明确提示。
5. 安全处理空值：使用位置数据前先判断是否为null，避免强制解包。

修复后的完整代码 #

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';

class MapScreen extends StatefulWidget {
  const MapScreen({super.key});

  @override
  State<MapScreen> createState() => _MapScreenState();
}

class _MapScreenState extends State<MapScreen> {
  MapController mapController = MapController();
  Position? currentposition;
  // 设置默认初始位置（示例为北京天安门坐标）
  final LatLng defaultLocation = const LatLng(39.9042, 116.4074);

  @override
  void initState() {
    super.initState();
    // 页面初始化时启动位置获取
    getCurrentPosition();
  }

  void getCurrentPosition() async {
    // 先检查位置服务是否启用
    bool serviceEnabled = await Geolocator.isLocationServiceEnabled();
    if (!serviceEnabled) {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('请开启位置服务')),
        );
      }
      return;
    }

    // 请求位置权限
    PermissionStatus status = await Permission.location.request();
    if (status.isDenied) {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('需要位置权限才能显示当前位置')),
        );
      }
      return;
    }

    // 权限与服务正常，获取当前位置
    if (status.isGranted) {
      try {
        Position position = await Geolocator.getCurrentPosition(
          desiredAccuracy: LocationAccuracy.high,
        );
        setState(() {
          currentposition = position;
        });
        // 获取位置后自动移动地图中心到当前位置
        mapController.move(
          LatLng(position.latitude, position.longitude),
          16.0,
        );
      } catch (e) {
        print('获取位置失败: $e');
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        FlutterMap(
          mapController: mapController,
          options: MapOptions(
            // 优先使用当前位置，否则用默认位置
            center: currentposition != null
                ? LatLng(
                    currentposition!.latitude,
                    currentposition!.longitude,
                  )
                : defaultLocation,
            zoom: 16.0,
            maxZoom: 19,
            minZoom: 13,
          ),
          children: [
            TileLayer(
              urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
              subdomains: ['a', 'b', 'c'],
            ),
            MarkerLayer(
              markers: currentposition != null
                  ? [
                      Marker(
                        height: 80.0,
                        width: 80.0,
                        // 修正经纬度顺序：纬度在前，经度在后
                        point: LatLng(
                          currentposition!.latitude,
                          currentposition!.longitude,
                        ),
                        builder: (ctx) => const Icon(
                          Icons.location_on,
                          color: Colors.red,
                          size: 40,
                        ),
                      ),
                    ]
                  : [],
            )
          ],
        ),
      ],
    );
  }
}

额外优化说明 #

• 把Widget名改为MapScreen，遵循Dart大驼峰命名规范
• 添加异常捕获，避免获取位置时的崩溃
• 获取位置后自动移动地图中心到当前位置
• 给标记图标设置颜色和大小，提升辨识度

内容的提问来源于stack exchange，提问作者Abderrezak Douba