首页 > 解决方案 > 在颤振中将纬度和经度传递给Latlng时出错

问题描述

我正在尝试重构我的代码并将 showMap 类分离到一个新的 dart 文件中。我正在从调用此类的屏幕向 showMap 传递纬度和经度。我检查过这里的纬度和经度不为空。但我收到一条错误消息:

The following NoSuchMethodError was thrown building showMap(dirty): The method 'compareTo' was called on null. Receiver: null Tried calling: compareTo(-90.0)

class showMap extends StatelessWidget {
  showMap({this.latitude, this.longitude});
  double latitude;
  double longitude;

  @override
  Widget build(BuildContext context) {
    return FlutterMap(
      options: MapOptions(
        center: LatLng(latitude, longitude), // The Error line
        zoom: 16.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(58.7041, 37.1025),
              builder: (ctx) => GestureDetector(
                child: Container(
                  child: Icon(
                    Icons.location_on,
                    size: 60,
                    color: Color(0xFF744D81),
                  ),
                ),
                onTap: () {
                  showModalBottomSheet(
                      context: context,
                      builder: (context) {
                        return MarkerPopup();
                      });
                },
              ),
            ),
            Marker(
              width: 80.0,
              height: 80.0,
              point: LatLng(58.4419, 37.0784),
              builder: (ctx) => GestureDetector(
                child: Container(
                  child: Icon(Icons.location_on,
                      size: 60, color: Color(0xFF744D81)),
                ),
                onTap: () {
                  showModalBottomSheet(
                      context: context,
                      builder: (context) {
                        return MarkerPopup();
                      });
                },
              ),
            ),
          ],
        ),
      ],
    );
  }
}

这是调用 showMap 的代码部分:

class _HomePageState extends State<HomePage> {

  void getLocation() async {
    Location location = Location();
    await location.getCurrrentLocation();
    latitude = location.latitude;
    longitude = location.longitude;
  }

  @override
  void initState() {
    super.initState();
    getLocation();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Udan'),
        backgroundColor: Color(0xFF4E295B),
        centerTitle: true,
      ),
      
      body: Stack(
        children: <Widget>[
          showMap(
            latitude: latitude,
            longitude: longitude,
          ),
        ],
      ),
    );
  }
}


奇怪的是,一两秒钟后,错误消失了,地图被加载到了正确的中心。但与此同时,代码中断并且屏幕显示错误。我猜这是因为获取位置需要时间,并且传递纬度和经度的空值,直到获取位置。在将值分配给 showMap 之前,我已经在原始屏幕中使用了异步等待。我怎样才能让它工作?谢谢。

标签: flutterdartopenstreetmapflutter-dependenciesflutter-packages

解决方案


getLocation 方法包含一个异步操作,并且 build 方法在它解析之前执行。

一个选项可能是在纬度和经度为空时显示加载器。一旦未来的 location.getCurrrentLocation 得到解决,您就可以调用 showMap。


推荐阅读