Skip to content

Geo-compose: Remove ViewpointOperations #316

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 12 commits into from
Feb 14, 2024
4 changes: 2 additions & 2 deletions microapps/MapViewSetViewpointApp/README.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
# MapView Set Viewpoint Micro-app

This micro-app demonstrates the use of `MapViewpointOperation` with a composable `MapView`.
This micro-app demonstrates setting the viewpoint on a composable `MapView`.

![Screenshot](screenshot.png)

## Usage

The application starts with a MapView and displays a map. Use the overflow action button in the app bar to choose between different `MapViewpointOperation`s to be performed on the composable MapView. Each operation will set the viewpoint to center on Sofia, Bulgaria.
The application starts with a MapView and displays a map. Use the overflow action button in the app bar to choose between different methods of setting a viewpoint on the composable MapView. Each operation will set the viewpoint to a different location.

For more information on the composable `MapView` component and how it works, see it's [Readme](../../toolkit/geo-compose/README.md).
Original file line number Diff line number Diff line change
Expand Up @@ -35,42 +35,36 @@ import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import com.arcgismaps.geometry.GeometryEngine
import com.arcgismaps.geometry.Envelope
import com.arcgismaps.geometry.Point
import com.arcgismaps.geometry.SpatialReference
import com.arcgismaps.mapping.ArcGISMap
import com.arcgismaps.mapping.BasemapStyle
import com.arcgismaps.mapping.Bookmark
import com.arcgismaps.mapping.Viewpoint
import com.arcgismaps.mapping.view.AnimationCurve
import com.arcgismaps.toolkit.geocompose.MapView
import com.arcgismaps.toolkit.geocompose.MapViewpointOperation
import com.arcgismaps.toolkit.geocompose.MapViewProxy
import kotlinx.coroutines.launch
import kotlin.time.Duration.Companion.seconds

/**
* Displays a composable [MapView] and permits setting the viewpoint using options in a dropdown menu.
* The dropdown menu options represent different methods of setting the viewpoint, and all of them center
* on the same location. A circular progress indicator is displayed over the map while an operation
* is in progress.
* The dropdown menu options represent different methods of setting the viewpoint.
*/
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MainScreen() {
val arcGISMap by remember { mutableStateOf(ArcGISMap(BasemapStyle.ArcGISStreets)) }
var mapViewpointOperation: MapViewpointOperation? by remember { mutableStateOf(null) }
val mapViewProxy = remember { MapViewProxy() }
var showProgressIndicator by remember { mutableStateOf(false) }
LaunchedEffect(key1 = mapViewpointOperation) {
showProgressIndicator = true
mapViewpointOperation?.await()
showProgressIndicator = false
}
val coroutineScope = rememberCoroutineScope()
Scaffold(
topBar = {
TopAppBar(
Expand All @@ -87,7 +81,14 @@ fun MainScreen() {

SetViewpointDropdownMenu(
expanded = actionsExpanded,
onSetViewpointOperation = { mapViewpointOperation = it },
onSelectViewpointMethod = {
actionsExpanded = false
coroutineScope.launch {
showProgressIndicator = true
it.method(mapViewProxy)
showProgressIndicator = false
}
},
onDismissRequest = { actionsExpanded = false }
)
}
Expand All @@ -103,7 +104,7 @@ fun MainScreen() {
MapView(
modifier = Modifier.fillMaxSize(),
arcGISMap = arcGISMap,
viewpointOperation = mapViewpointOperation
mapViewProxy = mapViewProxy
)
if (showProgressIndicator) {
CircularProgressIndicator()
Expand All @@ -113,63 +114,124 @@ fun MainScreen() {
}

/**
* A drop down menu providing [MapViewpointOperation]s for the composable [MapView].
* A drop down menu providing methods of setting the viewpoint for the composable [MapView].
*/
@Composable
fun SetViewpointDropdownMenu(
expanded: Boolean,
modifier: Modifier = Modifier,
onSetViewpointOperation: (MapViewpointOperation) -> Unit,
onDismissRequest: () -> Unit
onSelectViewpointMethod: (SetViewpointMethod) -> Unit,
onDismissRequest: () -> Unit,
) {
val viewpointOperationsList = remember {
listOf("Animate", "Center", "Rotate", "Scale", "Set", "SetBookmark", "SetBoundingGeometry")
}
val sofia = remember {
Point(23.321736, 42.697703, SpatialReference.wgs84())
}
val scale = remember { 170000.0 }
val bookmark = remember {
Bookmark(
"Sofia",
Viewpoint(sofia, scale)
)
}
val sofiaBounds = remember {
GeometryEngine.bufferOrNull(sofia, 0.083) ?: error("Couldn't buffer point")
}
DropdownMenu(
expanded = expanded,
onDismissRequest = onDismissRequest,
modifier = modifier
) {
viewpointOperationsList.forEach {
val viewpointOperationName = it
SetViewpointMethod.entries.forEach {
DropdownMenuItem(
text = { Text(text = viewpointOperationName) },
onClick = {
val viewpointOperation = when (viewpointOperationName) {
"Animate" -> MapViewpointOperation.Animate(
Viewpoint(sofia, scale),
5.0.seconds,
AnimationCurve.EaseOutCubic
)
text = { Text(text = it.label) },
onClick = { onSelectViewpointMethod(it) }
)
}
}
}

"Center" -> MapViewpointOperation.Center(sofia, scale)
"Rotate" -> MapViewpointOperation.Rotate(0.0)
"Scale" -> MapViewpointOperation.Scale(scale)
"Set" -> MapViewpointOperation.Set(Viewpoint(sofia, scale))
"SetBookmark" -> MapViewpointOperation.SetBookmark(bookmark)
"SetBoundingGeometry" -> MapViewpointOperation.SetBoundingGeometry(
sofiaBounds
)
/**
* An enum class representing different methods of setting the viewpoint on a composable [MapView].
*
* Each entry has a [label] for displaying in a drop down along with a [method] property that calls
* the matching method on the passed-in [MapViewProxy].
*/
enum class SetViewpointMethod(val label: String, val method: suspend (MapViewProxy) -> Unit) {
SET_VIEWPOINT(
"setViewpoint",
{ mapViewProxy ->
mapViewProxy.setViewpoint(
// Disneyland
Viewpoint(
Point(
-117.9190,
33.8121,
SpatialReference.wgs84()
), 170000.0
)
)
}
),

else -> error("Unexpected MapViewpointOperation")
}
onSetViewpointOperation(viewpointOperation)
onDismissRequest()
}
SET_VIEWPOINT_ANIMATED(
"setViewpointAnimated",
{ mapViewProxy ->
mapViewProxy.setViewpointAnimated(
// Sofia, Bulgaria
Viewpoint(
Point(
23.321736,
42.697703,
SpatialReference.wgs84()
), 170000.0
),
5.0.seconds,
AnimationCurve.EaseOutCubic
)
}
}
),

SET_VIEWPOINT_CENTER(
"setViewpointCenter",
{ mapViewProxy ->
mapViewProxy.setViewpointCenter(
// Catalina
Point(
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this looks better at these coordinates
Point(
-118.419710,
33.432245,
SpatialReference.wgs84()
),
1000000.0
)

-118.419710,
33.432245,
SpatialReference.wgs84()
),
1000000.0
)
}
),

SET_VIEWPOINT_ROTATION(
"setViewpointRotation (to North)",
{ mapViewProxy ->
mapViewProxy.setViewpointRotation(0.0)
}
),

SET_VIEWPOINT_SCALE(
"setViewpointScale (to 170,000)",
{ mapViewProxy ->
mapViewProxy.setViewpointScale(170000.0)
}
),

SET_VIEWPOINT_GEOMETRY(
"setViewpointGeometry",
{ mapViewProxy ->
// Golden gate bridge
mapViewProxy.setViewpointGeometry(
Envelope(
-122.612736915401,
37.75166841571218,
-122.446736915401,
37.91766841571218,
spatialReference = SpatialReference.wgs84()
)
)
}
),

SET_BOOKMARK(
"setBookmark",
{ mapViewProxy ->
mapViewProxy.setBookmark(
com.arcgismaps.mapping.Bookmark(
"Rotterdam",
Viewpoint(Point(4.4777, 51.9244, SpatialReference.wgs84()), 170000.0)
)
)
}
)
}
5 changes: 3 additions & 2 deletions microapps/SceneViewSetViewpointApp/README.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
# SceneView Set Viewpoint Micro-app

This micro-app demonstrates the use of `SceneViewpointOperation` with a composable `SceneView`.
This micro-app demonstrates setting the viewpoint on a composable `SceneView`.

|SceneView Set Viewpoint|
|:--:|
|![image](screenshot.png)|

## Usage

The application starts with a SceneView and displays a scene. Use the overflow action button in the app bar to choose between different `SceneViewpointOperation`s to be performed on the composable SceneView.
The application starts with a SceneView and displays a scene. Use the overflow action button in the app bar to choose between different methods of setting a viewpoint on the composable SceneView. Each operation will set the viewpoint to a different location.

For more information on the composable `SceneView` component and how it works, see it's [Readme](../../toolkit/geo-compose/README.md).

Loading