Events and gestures

VERSION 2.1.2

The TomTomMap component, provided by the Map Display Compose module, responds to various gestures with predefined behaviors that can be customized. By default, the map supports the following gestures:

  • Panning - moving one finger to drag the map.
  • Zooming:
    • Pinching to zoom in or out (scaling).
    • Double-tapping to zoom in (scaling).
    • Double-tapping and dragging to zoom in or out.
  • Rotating - rotating two fingers around each other.
  • Tilting - shoving (moving two fingers up or down on the map in parallel).

Handling map events

You can handle various map events by defining simple functions in the TomTomMap . The following gestures can be captured within the map component:

  • Single tap: Captured using the onMapClick lambda.
  • Double tap: Captured using the onMapDoubleClickListener lambda.
  • Long click: Captured using the onMapLongClick lambda.
  • Panning: Handled using the onMapPanningListener lambda.

You can define these optional event handlers when creating the TomTomMap composable. Here’s how to set up the map with optional event handling:

1TomTomMap(
2 infrastructure = mapDisplayInfrastructure,
3 state = mapViewState,
4 onMapClick = { geoPoint: GeoPoint ->
5 // YOUR CODE GOES HERE
6 },
7 onMapDoubleClickListener = { geoPoint: GeoPoint ->
8 // YOUR CODE GOES HERE
9 },
10 onMapLongClick = { geoPoint: GeoPoint ->
11 // YOUR CODE GOES HERE
12 },
13 onMapPanningListener = {
14 // YOUR CODE GOES HERE
15 },
16)

Enabling or disabling gestures

To enable or disable specific gestures, you can configure the GesturesConfig within the GesturesState of the MapViewState. This allows you to control how users interact with the map.

1mapViewState.gestureState.config = GesturesConfig {
2 isMultiPointerPanEnabled = true
3 isRotationEnabled = true
4 isScrollEnabled = true
5 isTiltEnabled = true
6 isZoomEnabled = true
7}
  • isMultiPointerPanEnabled - determining whether the map panning with two or more fingers is enabled.
  • isRotationEnabled - determines whether rotation is enabled.
  • isScrollEnabled - determines whether panning is enabled.
  • isTiltEnabled - determines whether tilting is enabled.
  • isZoomEnabled - determines whether zoom is enabled.

Gesture exclusions

You can specify circumstances where specific gestures are ignored. For example, if the map is being scaled (zoomed-in or -out), the user cannot pan it until the scaling is complete. To set a gesture exclusion, you can configure the GesturesState in MapViewState using the GesturesConfig. The exclusions parameter allows you to define which gestures should be ignored while a specific gesture is being performed.

Here’s how you can change the move gesture exclusions:

1mapViewState.gestureState.config = GesturesConfig {
2 exclusions = mapOf(
3 GestureType.Move to setOf(GestureType.Scale),
4 )
5}

In this example, when you start scaling the map, panning it is disabled. The Map Display module uses the following default configuration for gesture exclusions:

  • Tilting excludes rotating, scaling and quick scaling.
  • Rotating excludes tilting, scaling and quick scaling.
  • Scaling excludes tilting and quick scaling.
  • Quick scaling excludes shove and scaling.
  • Moving excludes tilting and quick scaling.
  • Long pressing excludes rotation, scaling, quick scaling, tilting, and double tapping.
  • Double tapping excludes scaling and quick scaling.

You can also lift all restrictions for a specific GestureType by giving it an empty exclusion set:

1mapViewState.gestureState.config = GesturesConfig {
2 exclusions = mapOf(
3 GestureType.Move to setOf(),
4 )
5}

Next steps

Since you have learned how to interact with the map, here are recommendations for the next steps: