Flutter Maps: How to change Marker Icon on marker tap



我正试图找到一种解决方案,在点击标记时更改标记图标,以便提供视觉反馈。不过,我还没想好怎么做。最初的想法是通过索引访问标记,但由于标记排列在Set<Markers>中,因此没有改变以正确的方式访问它。那么就可以很容易地用新的记号笔替换旧的记号笔。有没有一种常见的方法可以做到这一点?

编辑:

使用Java时,有以下选项。标记的CCD_ 2。这不是对Flutter的追逐。

像这样:

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

快乐编码:(

我也遇到了同样的问题。谷歌地图API没有此选项。我手动解决了它。

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

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

标记点击:

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

谷歌地图的onTap:

onTap: (value){
if (markerFlag != null) {
setState(() {
_allMarkers[markerFlag] = _allMarkers[markerFlag].copyWith(iconParam: defaultMarkerIcon);
markerFlag = null;
});
}
}
//onTap Marker: 
widget.markersStation.add(
Marker(
markerId: MarkerId(markerId),
position: latLng,
icon: iconMarkerStationGrey,
onTap: () {
setState(() {
for (var j = 0; j < widget.markersStation.length; j++) {
widget.markersStation[j] = widget.markersStation[j]
.copyWith(iconParam: iconMarkerStationGrey);
}
if (idMarkerSelected != int.parse(markerId)) {
widget.markersStation[int.parse(markerId)] = widget
.markersStation[int.parse(markerId)]
.copyWith(iconParam: iconMarkerStationSelected);
idMarkerSelected = int.parse(markerId);
}
});
),)

//onTap Map :
markers: widget.markersStation.toSet(),
onTap: (position) async {
_customInfoWindowController.hideInfoWindow!();
BitmapDescriptor iconMarkerStationGrey =
await BitmapDescriptor.fromAssetImage(
const ImageConfiguration(size: Size(24, 24)),
"icons/marker_station_gris_17677@2x.png");
if (idMarkerSelected > -1) {
setState(() {
widget.markersStation[idMarkerSelected] = widget
.markersStation[idMarkerSelected]
.copyWith(iconParam: iconMarkerStationGrey);
idMarkerSelected = -1;
});
}
},

相关内容

  • 没有找到相关文章