add calloutView and tappedPoint as MapViewSTate property

Author: prupani-7

show-callout/src/main/java/com/esri/arcgismaps/sample/showcallout/components/ComposeMapView.kt

@@ -28,10 +28,12 @@ import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalLifecycleOwner
 import androidx.compose.ui.viewinterop.AndroidView
 import androidx.lifecycle.LifecycleOwner
+import androidx.lifecycle.lifecycleScope
 import com.arcgismaps.geometry.GeometryEngine
 import com.arcgismaps.geometry.Point
 import com.arcgismaps.geometry.SpatialReference
 import com.arcgismaps.mapping.view.MapView
+import com.arcgismaps.mapping.view.SingleTapConfirmedEvent
 import com.esri.arcgismaps.sample.showcallout.R
 import kotlinx.coroutines.launch
 
@@ -42,7 +44,7 @@ import kotlinx.coroutines.launch
 fun ComposeMapView(
     modifier: Modifier = Modifier,
     mapViewModel: MapViewModel,
-    application: Application
+    onSingleTap: (SingleTapConfirmedEvent) -> Unit = {}
 ) {
     // get an instance of the current lifecycle owner
     val lifecycleOwner = LocalLifecycleOwner.current
@@ -60,6 +62,12 @@ fun ComposeMapView(
             mapView.apply {
                 map = mapViewState.arcGISMap
                 setViewpoint(mapViewState.viewpoint)
+                // show callout at the tapped location using the set View
+                mapView.callout.show(mapViewState.calloutContent, mapViewState.latLongPoint)
+                lifecycleOwner.lifecycleScope.launch {
+                    // center the map on the tapped location
+                    setViewpointCenter(mapViewState.latLongPoint)
+                }
             }
         }
     )
@@ -68,20 +76,7 @@ fun ComposeMapView(
     LaunchedEffect(Unit) {
         launch {
             mapView.onSingleTapConfirmed.collect {
-                // get map point from the Single tap event
-                it.mapPoint?.let { mapPoint ->
-                    // convert the point to WGS84 for obtaining lat/lon format
-                    val wgs84Point =
-                        GeometryEngine.projectOrNull(mapPoint, SpatialReference.wgs84()) as Point
-                    // create a textview for the callout
-                    val calloutView = TextView(application).apply {
-                        text = application.getString(R.string.callout_text, wgs84Point.y, wgs84Point.x)
-                    }
-                    // show callout at the tapped location using the set View
-                    mapView.callout.show(calloutView, wgs84Point)
-                    // center the map on the tapped location
-                    mapView.setViewpointCenter(mapPoint)
-                }
+                onSingleTap(it)
             }
         }
     }

show-callout/src/main/java/com/esri/arcgismaps/sample/showcallout/components/MapViewModel.kt

@@ -17,21 +17,43 @@
 package com.esri.arcgismaps.sample.showcallout.components
 
 import android.app.Application
+import android.widget.TextView
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
 import androidx.lifecycle.AndroidViewModel
+import com.arcgismaps.geometry.GeometryEngine
+import com.arcgismaps.geometry.Point
+import com.arcgismaps.geometry.SpatialReference
 import com.arcgismaps.mapping.ArcGISMap
 import com.arcgismaps.mapping.BasemapStyle
 import com.arcgismaps.mapping.Viewpoint
+import com.esri.arcgismaps.sample.showcallout.R
 import kotlinx.coroutines.flow.MutableStateFlow
 
-class MapViewModel(application: Application) : AndroidViewModel(application) {
+class MapViewModel(private val application: Application) : AndroidViewModel(application) {
     // set the MapView mutable stateflow
-    val mapViewState = MutableStateFlow(MapViewState())
-}
+    val mapViewState = MutableStateFlow(MapViewState(application))
+
+    fun onMapTapped(mapPoint: Point?) {
+        // get map point from the Single tap event
+        mapPoint?.let { mapPoint ->
+            // convert the point to WGS84 for obtaining lat/lon format
+            mapViewState.value.latLongPoint =
+                GeometryEngine.projectOrNull(mapPoint, SpatialReference.wgs84()) as Point
+            // create a textview for the callout
+            mapViewState.value.calloutContent.text = application.getString(R.string.callout_text, mapViewState.value.latLongPoint.y, mapViewState.value.latLongPoint.x)
+            }
+        }
+    }
+
 
 /**
  * Data class that represents the MapView state
  */
-data class MapViewState(
-    var arcGISMap: ArcGISMap = ArcGISMap(BasemapStyle.ArcGISNavigationNight),
+data class MapViewState(val application: Application) {
+    var arcGISMap: ArcGISMap = ArcGISMap(BasemapStyle.ArcGISNavigationNight)
     var viewpoint: Viewpoint = Viewpoint(34.056295, -117.195800, 1000000.0)
-)
+    var calloutContent: TextView by mutableStateOf(TextView(application))
+    var latLongPoint: Point by mutableStateOf(Point(0.0, 0.0, SpatialReference.wgs84()))
+}

show-callout/src/main/java/com/esri/arcgismaps/sample/showcallout/screens/MainScreen.kt

@@ -47,7 +47,10 @@ fun MainScreen(sampleName: String, application: Application) {
                 ComposeMapView(
                     modifier = Modifier.fillMaxSize(),
                     mapViewModel = mapViewModel,
-                    application = application
+                    onSingleTap = { singleTapConfirmedEvent ->
+                        mapViewModel.onMapTapped(singleTapConfirmedEvent.mapPoint)
+                    }
+
                 )
             }
         }