MapViewStateInterface

MapViewStateInterface es un componente principal que gestiona la inicialización del mapa, la posición de la cámara y el estado general del mapa. Cada SDK de mapa tiene su propia implementación, pero MapConductor proporciona una API unificada en todos los proveedores.

Implementaciones de SDK de Mapa

MapConductor admite 5 SDKs de mapa, cada uno con su propia implementación de MapViewStateInterface:

• GoogleMapViewState - Google Maps
• MapboxViewState - Mapbox Map
• HereViewState - HERE Map
• ArcGISMapViewState - ArcGIS Map
• MapLibreViewState - MapLibre Map

Propiedades Principales

Estado de Inicialización

• isInitialized: StateFlow<InitState>: Rastrea el estado de inicialización del mapa
  • NotStarted: La inicialización del mapa no ha comenzado
  • Initializing: El mapa se está inicializando actualmente
  • Initialized: El mapa está listo para usar
  • Failed: La inicialización falló

Gestión de Cámara

• cameraPosition: MapCameraPosition: Posición de cámara actual y posición de cámara inicial cuando se carga el mapa

Diseño de Mapa

• mapDesignType: ActualMapDesignType: Estilo/diseño del mapa (específico del proveedor)

Movimiento de Cámara

Movimiento Simple

• moveCameraTo(GeoPoint, Long?)

  fun moveCameraTo(
      position: GeoPoint,
      durationMillis: Long? = 0,
  )

  • Mueve la cámara a la posición especificada. Los ángulos de zoom y inclinación se mantienen desde el momento en que se llama a moveCameraTo.
  • Cuando se especifica durationMillis en milisegundos, la cámara se mueve con animación.

Movimiento con Opciones de Cámara

• moveCameraTo(MapCameraPosition, Long?)

  fun moveCameraTo(
      cameraPosition: MapCameraPosition,
      durationMillis: Long? = 0,
  )

  • Mueve la cámara usando MapCameraPosition. Se pueden especificar zoom e inclinación al mismo tiempo. Las propiedades que se omiten mantienen sus valores desde cuando se llamó a moveCameraTo.
  • Cuando se especifica durationMillis en milisegundos, la cámara se mueve con animación.

Ejemplos de Uso

Control de Cámara

@Composable
fun CameraControlExample() {
    val london = GeoPoint.fromLatLong(51.4985, 0.0)
    val camera = MapCameraPosition(position = london, zoom = 8.0)
    val mapViewState = rememberHereMapViewState(cameraPosition = camera)

    Column(modifier = modifier) {
        Button(
            onClick = {
                val sanFrancisco = GeoPoint.fromLatLong(37.7749, -122.4194)
                mapViewState.moveCameraTo(
                    position = sanFrancisco,
                    durationMillis = 3000
                )
            }
        ) {
            Text("Move to San Francisco")
        }

        HereMapView(
            modifier = Modifier.fillMaxSize(),
            state = mapViewState,
            onCameraMoveEnd = {
                println("Camera movement completed")
            }
        ) {
            // Marker, Polygon, etc
        }
    }
}

Cambio de Diseño de Mapa

@Composable
fun MapDesignSwitchExample() {
    val london = GeoPoint.fromLatLong(51.4985, 0.0)
    val camera = MapCameraPosition(position = london, zoom = 8.0)
    val mapViewState = rememberHereMapViewState(
        cameraPosition = camera,
        mapDesign = HereMapDesign.NormalDay
    )

    Column(modifier = modifier) {
        Row(modifier = Modifier.fillMaxWidth()) {
            Button(
                onClick = {
                    mapViewState.mapDesignType = HereMapDesign.NormalDay
                }
            ) {
                Text("NormalDay")
            }
            Spacer(modifier = Modifier.width(20.dp))

            Button(
                onClick = {
                    mapViewState.mapDesignType = HereMapDesign.NormalNight
                }
            ) {
                Text("NormalNight")
            }

            Spacer(modifier = Modifier.width(20.dp))
            Button(
                onClick = {
                    mapViewState.mapDesignType = HereMapDesign.HybridDay
                }
            ) {
                Text("HYBRID_DAY")
            }
        }

        HereMapView(
            state = mapViewState
        ) {
            // Marker, Polyline... etc,
        }
    }
}

Manejo de Eventos

MapViewStateInterface funciona con el componente de proveedor de mapa elegido para proporcionar manejo de eventos integral:

// Reemplace MapView con su proveedor de mapas elegido, como GoogleMapView, MapboxMapView
MapView(
    state = mapViewState,
    onMapLoaded = {
        println("Mapa cargado exitosamente")
    },
    onMapClick = { geoPoint ->
        println("Mapa clickeado en: ${geoPoint.latitude}, ${geoPoint.longitude}")
    }
) {
    // Contenido del mapa
}

Mejores Prácticas

1. Inicialización del Estado: Inicializar MapViewStateInterface con posición de cámara y límites apropiados
2. Animación de Cámara: Usar duraciones de animación razonables para experiencia de usuario fluida (500ms - 3000ms)
3. Estabilidad del Estado: Usar remember para mantener el estado entre recomposiciones
4. Actualizaciones Reactivas: Usar StateFlow para actualizaciones reactivas del estado de inicialización
5. Manejo de Errores: Verificar el estado de inicialización antes de realizar operaciones de cámara
6. Gestión de Memoria: Limpiar escuchadores cuando el mapa ya no sea necesario