如何使用 BitmapDescriptor.fromAssetImage() 设置自定义标记图标？答案

【问题标题】：How to use BitmapDescriptor.fromAssetImage() to set a custom Marker icon?如何使用 BitmapDescriptor.fromAssetImage() 设置自定义标记图标？
【发布时间】：2019-10-09 03:15:13
【问题描述】：

我正在尝试在我的 Flutter 应用中为我的地图标记设置自定义图标。由于BitmapDescriptor.fromAsset()已被弃用，我正在努力寻找如何使用BitmapDescriptor.fromAssetImage()。

我没有找到任何关于此的文档或 Stackoverflow 问题。

这是我创建它的当前方式（没有自定义图像）：

Marker(
          markerId: MarkerId(pos.toString()),
          position: pos,
          infoWindow: InfoWindow(
            title: store['store_name'],
            snippet: '',
          ),
          icon: BitmapDescriptor.defaultMarker));

【问题讨论】：

标签： dart flutter google-maps-markers

【解决方案1】：

在类中定义一个字段：

BitmapDescriptor myIcon;

在地图准备好之前检索图标。

@override
void initState() {
    BitmapDescriptor.fromAssetImage(
        ImageConfiguration(size: Size(48, 48)), 'assets/my_icon.png')
        .then((onValue) {
      myIcon = onValue;
    });
 }

设置图标：

icon: myIcon;

确保你已经在 pubspec.yaml 的 Flutter 部分设置了图标

 assets:
    - assets/my_icon.png

【讨论】：

有效！感谢您的明确答复。标记为解决方案。
大家好，我已经在应用加载之前在 initState 中加载了图标，我通过记录器确认了这一点，但在页面加载后我看到一个错误 `com.google.maps.api.android.lib6.common。 apiexception.a：无法解码图像。提供的图像必须是位图。任何人都可以帮忙吗？非常感谢
我会尝试使用但返回错误..软件说 Unhandled Exception: PlatformException(error, Failed to decode image.提供的图像必须是位图。如何解决？谢谢
由于某种原因，我发现将Size(48, 48) 更改为Size(10, 10) 并不会改变图标的大小。
@JVE999 大小参数ImageConfiguration 被BitmapDescriptor 忽略

【解决方案2】：

更好的解决方案是将 GoogleMap 小部件包装在 FutureBuilder 中。在单独的 Future 中生成您的标记，并分配未来的结果到 GoogleMap 小部件中的标记

FutureBuilder：

FutureBuilder(
  future: generateMarkers(positions),
  initialData: Set.of(<Marker>[]),
  builder: (context, snapshot) => GoogleMap(        
    initialCameraPosition: CameraPosition(target: LatLng(0, 0)),
    markers: snapshot.data,
  ),
);

标记生成器：

Future<Set<Marker>> generateMarkers(List<LatLng> positions) async {
List<Marker> markers = <Marker>[];
for (final location in positions) {    
  final icon = await BitmapDescriptor.fromAssetImage(
      ImageConfiguration(size: Size(24, 24)), 'assets/my_icon.png');

  final marker = Marker(
    markerId: MarkerId(location.toString()),
    position: LatLng(location.latitude, location.longitude),
    icon: icon,
  );

  markers.add(marker);
}

return markers.toSet();

}

【讨论】：

你应该从循环中提取final icon =...，以加快代码速度。

【解决方案3】：

你可以像这样使用它：

Marker marker = Marker(
        icon: await BitmapDescriptor.fromAssetImage(
            ImageConfiguration(size: Size(48, 48)), 'assets/images/pin.png'
        )
    );

【讨论】：

异步放在哪里？