Question

我只是在玩新的Google Map的Flutter软件包。

我想通过使用MapType来更改地图的PopupMenuButton，例如混合地图，卫星地图，无地图等。下面是我的代码。

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';

class MapPage extends StatefulWidget {
  @override
  _MapPageState createState() => _MapPageState();
}

class _MapPageState extends State<MapPage> {
  GoogleMapController mapController;
  List arrMapTyep = [
    {'title': 'none', 'value': MapType.none},
    {'title': 'hybrid', 'value': MapType.hybrid},
    {'title': 'normal', 'value': MapType.normal},
    {'title': 'satellite', 'value': MapType.satellite},
    {'title': 'terrain', 'value': MapType.terrain}
  ];
  MapType currentMapType = MapType.normal;

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Google Map"),
        actions: <Widget>[
          PopupMenuButton(
              icon: Icon(Icons.more_vert),
              initialValue: currentMapType,
              onSelected: (value) {
                setState(() {
                  currentMapType = value;
                });
              },
              itemBuilder: (BuildContext context) => _setupAllMapType()
              )
        ],
      ),
      body: Container(
        child: GoogleMap(
          onMapCreated: _onMapCreated,
          options: GoogleMapOptions(
              mapType: currentMapType,
              compassEnabled: true,
              myLocationEnabled: true,
              cameraPosition: CameraPosition(
                  target: LatLng(37.785834, -122.406417), 
                  zoom: 16,
                )
              ),
        ),
      ),
    );
  }

  void _onMapCreated(GoogleMapController controller) {
    setState(() {
      mapController = controller;
    });
  }

  List<PopupMenuItem> _setupAllMapType() {
    List<PopupMenuItem> temArr = List();
    for (var i = 0; i < arrMapTyep.length; i++) {
      temArr.add(
        PopupMenuItem(
          value: arrMapTyep[i]['value'],
          child: Text(arrMapTyep[i]['title']),
        ),
      );
    }

    return temArr;
  }
}

我打电话给setState，但可以使用。

Answer 1

我不确定现在回答是否为时已晚，但万一像我这样的人偶然发现了这个问题；

可以通过对currentMapType变量进行setState（）调用来实现MapType的实时更改。我已经在我的应用程序中实现了它，它像黄油一样光滑！

希望有帮助。祝你振奋！

快速参考（将“普通地图”类型更改为“卫星”地图类型）：

@JmsListener

Flutter google_maps_flutter无法通过PopupMenuButton更改MapType

1 个答案: