如何自定义 Google 地图上的 myLocationEnabled 按钮？答案

【问题标题】：How to customize myLocationEnabled button on Google Maps?如何自定义 Google 地图上的 myLocationEnabled 按钮？
【发布时间】：2019-08-12 17:19:48
【问题描述】：

我需要创建一个按钮来显示用户的当前位置。这就是我使用谷歌地图的原因，它有这样的选项。但是，我需要自定义 MyLocation 按钮，但不知道该怎么做。你能帮我解决这个问题吗？

虽然我是 Flutter 的新手 :D

【问题讨论】：

标签： google-maps flutter flutter-layout

【解决方案1】：

我找不到简单的方法，但由于一切都是 Flutter 中的小部件，您可以将您的谷歌地图放入您的堆栈中，并将 iconbutton 或您需要的任何自定义按钮添加到您的堆栈中。

GoogleMap(
                      onMapCreated: _onMapCreated,
                      initialCameraPosition:
                          CameraPosition(target: LatLng(0.0, 0.0)),
                      markers: markers,
                    ),
                    IconButton(
                      icon: Icon(Icons.battery_charging_full),
                      onPressed: () async {
                        final center = await getUserLocation();
                        getNearbyPlaces(center);
                        Marker myPosition = Marker(
                            markerId: MarkerId('myLocation'),
                            position: center == null
                                ? LatLng(0, 0)
                                : LatLng(center.latitude, center.longitude),
                            icon: BitmapDescriptor.fromAsset(
                                'assets/logo.png'));
                        setState(() {
                          markers.add(myPosition);
                        });
                      },
                    ),
                  ],
                )

所以我在这里所做的基本上是，

我有Stack，它可以帮助我将IconButton 放在GoogleMap 之上。当用户按下该按钮时，我添加了一个新的Marker 以显示当前位置，在我的State 上有一个Markers 的Set，称为markers，我正在创建一个新的Marker 通过获取用户的当前位置，并将自定义图标添加到该标记，然后将其添加到我的标记（集），以在 GoogleMap 上显示。

我的 getUserLocation 函数：

  Future<LatLng> getUserLocation() async {
    LocationManager.LocationData currentLocation;
    final location = LocationManager.Location();
    try {
      currentLocation = await location.getLocation();
      final lat = currentLocation.latitude;
      final lng = currentLocation.longitude;
      final center = LatLng(lat, lng);
      return center;
    } on Exception {
      currentLocation = null;
      return null;
    }
  }

我有 location: ^2.1.0 包并将其用作 LocationManager import 'package:location/location.dart' as LocationManager;

【讨论】：