Jetpack Compose: How to click on Maker in Google Maps?

Question

I use official Google Maps Compose lib and I can't understand...how implement click on the marker?

@Composable
fun MapContent(city: City)  {
    val pos = LatLng(city.latitude, city.longitude)
    val cameraPositionState = rememberCameraPositionState {
        position = CameraPosition.fromLatLngZoom(pos, 12f)
    }
    val mapState = rememberMarkerState(position = pos)
    
    GoogleMap(
        modifier = Modifier.fillMaxSize(),
        cameraPositionState = cameraPositionState,
        uiSettings = MapUiSettings(zoomControlsEnabled = false)
    ) {
        Marker(
            state = mapState,
            onClick = {
                Timber.tag("GoogleMapClick").d("click!!!")
                false
            }
        )
    }
}

It doesn't work. Can you help me, what's wrong? I want to click on the marker and show BottomSheet with City info, but it looks like onClick doesn't work...

implementation 'com.google.maps.android:maps-compose:2.5.3'
implementation 'com.google.android.gms:play-services-maps:18.1.0'

Answer 1

You should use onInfoWindowClick instead onClick

Here my code that works ;)

            Card(modifier = Modifier
                .fillMaxWidth()
                .height(250.dp)
                .padding()
                .clip(RoundedCornerShape(24.dp))) {
                GoogleMap(
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(250.dp)
                        .padding(),
                    cameraPositionState = cameraPositionState
                ) {
                    viewData.items.forEach {
                        val position = LatLng(
                            it.geolocalisation.first(),
                            it.geolocalisation.last())
                        Marker(
                            state = MarkerState(position = position),
                            title = it.nom,
                            snippet = it.categorie,
                            onInfoWindowClick = { _ ->
                                onClickItem(it)
                                coroutineScope.launch {
                                    if (sheetState.isVisible) sheetState.hide()
                                    else sheetState.show()
                                }
                            }
                        )
                    }
                }
            }

Answer 2

just use

MarkerInfoWindow(
        state = MarkerState(position = singapore),
    ) {
        if (it.isInfoWindowShown) {
            //do something
            it.hideInfoWindow()
        }