LocationMaps

00LocationMaps

Código auxiliar para o projecto sobre User Location e Mapas

05 MainScreenOSM.kt

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MainScreenOSM(modifier: Modifier = Modifier, viewModel: LocationViewModel) {
    //val context = LocalContext.current
    var autoEnabled by remember{ mutableStateOf(false) }
    val location = viewModel.currentLocation.observeAsState()

    var geoPoint by remember{ mutableStateOf(GeoPoint(
        location.value?.latitude ?: 0.0, location.value?.longitude ?: 0.0
    )) }

    if (autoEnabled)
        LaunchedEffect(key1 = location.value) {
            geoPoint = GeoPoint(
                        location.value?.latitude ?: 0.0, location.value?.longitude ?: 0.0
                    )
        }
    Column(
        modifier = modifier
            .fillMaxSize()
            .padding(8.dp),
        verticalArrangement = Arrangement.SpaceBetween,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Row(
            modifier=Modifier
                .fillMaxWidth(),
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text(text = "Lat: ${location.value?.latitude ?: "--"}")
            Switch(checked = autoEnabled, onCheckedChange = {
                autoEnabled = it
            })
            Text(text = "Lon: ${location.value?.longitude ?: "--"}")
        }
        Spacer(Modifier.height(16.dp))

        Box(
            modifier = Modifier
                .padding(8.dp)
                .fillMaxWidth()
                .fillMaxHeight(0.5f)
                .clipToBounds()
                .background(Color(255, 240, 128)),
        ) {
            AndroidView(
                factory = { context ->
                    MapView(context).apply {
                        setTileSource(TileSourceFactory.MAPNIK);//==TileSourceFactory.DEFAULT_TILE_SOURCE
                        setMultiTouchControls(true)
                        controller.setCenter(geoPoint)
                        controller.setZoom(18.0)
                        /*for(poi in viewModel.POIs)
                            overlays.add(
                                Marker(this).apply {
                                    position = GeoPoint(poi.latitude,poi.longitude)
                                    setAnchor(Marker.ANCHOR_CENTER, Marker.ANCHOR_BOTTOM)
                                    title = poi.team
                                }
                            )*/
                    }
                },
                update = { view ->
                    view.controller.setCenter(geoPoint)
                }
            )
        }
    }
}

10 POIs

data class Coordinates(val team: String,val latitude : Double, val longitude: Double)

...

val POIs = listOf(
        Coordinates("Liverpool",53.430819,-2.960828),
        Coordinates("Manchester City",53.482989,-2.200292),
        Coordinates("Manchester United",53.463056,-2.291389),
        Coordinates("Bayern Munich", 48.218775, 11.624753),
        Coordinates("Barcelona",41.38087,2.122802),
        Coordinates("Real Madrid",40.45306,-3.68835)
    )
    
...

Spacer(Modifier.height(16.dp))
LazyColumn(
    modifier = Modifier
        .fillMaxSize()
) {
    items(viewModel.POIs) {
        Card(
            modifier = Modifier
                .fillMaxWidth()
                .padding(8.dp),
            elevation = CardDefaults.cardElevation(4.dp),
            colors = CardDefaults.cardColors(
                containerColor = Color(128,192,255)
            ),
            onClick = {
                geoPoint = GeoPoint(it.latitude, it.longitude)
            }
        ) {
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(8.dp),
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                Text(text = it.team, fontSize = 20.sp)
                Text(text = "${it.latitude} ${it.longitude}", fontSize = 14.sp)
            }
        }
    }
}