google-maps - 在颤动中更新谷歌地图警报对话框中的标记

Question

我正在尝试使用以下方法在对话窗口上加载 googlemap(google_maps_flutter 0.5.25+1 library)

_loadMapDialog() {
try {
  if (_currentPosition.latitude == null) {
    Toast.show("Location not available. Please wait...", context,
        duration: Toast.LENGTH_LONG, gravity: Toast.BOTTOM);
    _getLocation(); //_getCurrentLocation();
    return;
  }
  _controller = Completer();
  _userpos = CameraPosition(
    target: LatLng(latitude, longitude),
    zoom: 14.4746,
  );

  markers.add(Marker(
      markerId: markerId1,
      position: LatLng(latitude, longitude),
      infoWindow: InfoWindow(
        title: 'New Location',
        snippet: 'Delivery Location',
      )));

  showDialog(
    context: context,
    builder: (context) {
      return StatefulBuilder(
        builder: (BuildContext context, StateSetter setState) {
          return AlertDialog(
            title: Text("Select Your Location"),
            titlePadding: EdgeInsets.all(5),
            content: Text(curaddress),
            actions: <Widget>[
              Container(
                height: screenHeight / 1.4 ?? 600,
                width: screenWidth ?? 400,
                child: 
                GoogleMap(
                  mapType: MapType.normal,
                  initialCameraPosition: _userpos,
                  markers: markers,
                  onMapCreated: (controller) {
                    _controller.complete(controller);
                  },
                  onTap: _loadLoc,
              ),
              )
            ],
          );
        },
      );
    },
  );
} catch (e) {
  print(e);
  return;
}


 }

      void _loadLoc(LatLng loc) async{
        setState(() {
          print("insetstate");
          markers.clear();
          latitude = loc.latitude;
          longitude = loc.longitude;
          label = latitude.toString();
          _getLocationfromlatlng(latitude,longitude);
          _home = CameraPosition(
            target: loc,
            zoom: 14,
          );
          markers.add(Marker(
              markerId: markerId1,
              position: LatLng(latitude, longitude),
              infoWindow: InfoWindow(
                title: 'New Location',
                snippet: 'Delivery Location',
              )));

        });
        _userpos = CameraPosition(
            target: LatLng(latitude, longitude),
            zoom: 14.4746,
          );
        _newhomeLocation();
      }

      Future<void> _newhomeLocation() async {
        gmcontroller = await _controller.future;
        gmcontroller.animateCamera(CameraUpdate.newCameraPosition(_home));
        Navigator.of(context).pop(false);
        _loadMapDialog();
      }

我确实设法在我的 AlertDialog 中加载了地图。问题是我需要能够在地图上选择新位置删除以前的标记并在地图上显示新标记，但是除非应用程序执行热重载，否则标记不会显示在地图上。现在我正在使用一种愚蠢的方式来弹出当前的警报对话框并使用 _loadMapDialog() 方法再次显示它来重新加载小部件。我确实尝试使用 flutter_places_dialog 库，但似乎我遇到了活动返回结果错误的问题。

扑腾 newb 在这里善良..

标签： google-mapsflutterdartflutter-alertdialog

Answer 1

问题是您正在使用 StatefulWidget 提供的 setState 更新标记。但是 Dialog 正在使用 StatefulBuilder 提供的 setState 更新其状态。

解决方案是将 StatefulBuilder 的 setState 添加到 onTap 回调函数的参数中，并像我的代码一样在 _loadLoc 函数中使用它。

List<Marker> markers = [];
@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('GoogleMap'),
    ),
    body: Center(
      child: RaisedButton(
        onPressed: () {
          showDialog(
            context: (context),
            builder: (context) {
              return StatefulBuilder(builder: (context, newSetState) {
                return AlertDialog(
                  title: Text('Google Map'),
                  content: GoogleMap(
                    initialCameraPosition: CameraPosition(
                        target: LatLng(11.004556, 76.961632), zoom: 14),
                    markers: markers.toSet(),
                    onTap: (newLatLng) {
                      addMarker(newLatLng, newSetState);

                    },
                  ),
                );
              });
            });
      },
    ),
  ),
);

addMarker(latLng, newSetState)
{
  newSetState(() {
    markers.clear();
    markers.add(Marker(markerId: MarkerId('New'), position: latLng));
  });
}