Flutter Maps：如何更改标记点击上的标记图标

Posted 2023-02-23

【中文标题】Flutter Maps：如何更改标记点击上的标记图标

【英文标题】：Flutter Maps: How to change Marker Icon on marker tap

【发布时间】：2020-03-12 09:18:44

【问题描述】：

我正在尝试找到一种解决方案，以便在点击标记时更改标记图标，以便提供视觉反馈。不过，我还没有弄清楚如何做到这一点。第一个想法是通过索引访问标记，但由于标记排列在Set<Markers> 中，因此以正确的方式访问它没有任何变化。那么用新的标记交换旧标记很容易。有没有一种通用的方法可以做到这一点？

编辑：

使用 Java，有类似的选项。 setIcon 用于标记。这不是 Flutter 的追求。

像这样：

marker.setIcon(BitmapDescriptorFactory.fromResource(R.drawable.ic_selected_user_mark_icon));

编码愉快:)

【问题讨论】：

你必须建立一个新的GoogleMap 并在markers 属性中传递你的标记

嘿，谢谢你的回答。那肯定是消失了，但我不想重新渲染整个地图，因为它看起来很糟糕。

@Flacon，你找到解决办法了吗？

【参考方案1】：

我遇到了同样的问题。 Google Maps API 没有这个选项。我手动解决了。

您可以在 Marker 的 onTap 和 GoogleMap 的 onTap 属性中创建标志并更改图标 Marker。

int markerFlag = null;
List<Marker> _allMarkers = [];

标记的 onTap：

onTap: () 
            if (markerFlag != idMarker)                   
              setState(() 
                if (markerFlag != null) 
                  _allMarkers[markerFlag] = _allMarkers[markerFlag].copyWith(iconParam: defaultMarkerIcon);
                
               _allMarkers[idMarker] = _allMarkers[idMarker].copyWith(iconParam: selectedMarkerIcon);
               markerFlag = idMarker;
              );                
            
          

GoogleMap 的 onTap：

onTap: (value)
    if (markerFlag != null) 
      setState(() 
        _allMarkers[markerFlag] = _allMarkers[markerFlag].copyWith(iconParam: defaultMarkerIcon);
        markerFlag = null;
      );
    
  

【讨论】：

这是一个很好的解决方案。提醒一下，标记需要作为 SET，而不是 LIST，所以我在我的 GoogleMap 小部件中使用了markers: _markers.toSet(),。此解决方案是否有任何性能成本？