¿Alguna vez has tenido la necesidad de usar un proveedor de mapas diferente al de Google Maps? Pues hoy quiero presentarte una alternativa y no te hablo de mostrar un mapa a través de un webview o algo similar, sino de MapBox y como es que lo puedes usar nativamente en Xamarin.Android.
Mapbox
Lo primero que tenemos que hacer es registrarnos en la página oficial de MapBox (https://www.mapbox.com), es un procedimiento gratuito que no toma mucho tiempo y con una cuenta dada de alta ya tenemos un token que nos permitirá inicializar los servicios de MapBox en nuestros futuros proyectos, si deseas más detalles sobre para qué sirve el token puedes visitar la siguiente página: https://www.mapbox.com/help/how-access-tokens-work/
Map Style
Seguido de ello tenemos que elegir con que estilo de mapa queremos trabajar ingresando a la página de mapas de MapBox https://www.mapbox.com/maps/. Vale mencionar que MapBox también te permite crear tus propios estilos para personalizar los mapas, pero no entraremos en esos detalles, así que simplemente elijamos con qué estilos deseamos trabajar.
Nuget
Lo que viene ahora es crear el proyecto y mediante Nuget descargar los componentes correspondientes a Naxam.Mapbox.Droid 5.3.2
Ya con los componentes listos, podemos proceder a hacer lo siguiente para disfrutar de nuestro nuevo mapa.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
using Android.App;
using Android.OS;
using Com.Mapbox.Mapboxsdk;
using Com.Mapbox.Mapboxsdk.Maps;
namespace App3
{
[Activity(Label = "App3", MainLauncher = true)]
public class MainActivity : Activity, IOnMapReadyCallback
{
MapView _mapView = null;
MapboxMap _mapBox = null;
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
Mapbox.GetInstance(this, "[your_token]");
_mapView = new MapView(this);
_mapView.OnCreate(savedInstanceState);
_mapView.Touch += _mapView_Touch;
_mapView.SetStyleUrl("mapbox://styles/mapbox/streets-v9");
_mapView.GetMapAsync(this);
SetContentView(_mapView);
}
private void _mapView_Touch(object sender, Android.Views.View.TouchEventArgs e)
{
}
public void OnMapReady(MapboxMap p0)
{
_mapBox = p0;
_mapBox.CameraChange += _mapBox_CameraChange;
_mapBox.MarkerClick += _mapBox_MarkerClick;
_mapBox.InfoWindowClick += _mapBox_InfoWindowClick;
}
private void _mapBox_CameraChange(object sender, MapboxMap.CameraChangeEventArgs e)
{
}
private void _mapBox_InfoWindowClick(object sender, MapboxMap.InfoWindowClickEventArgs e)
{
}
private void _mapBox_MarkerClick(object sender, MapboxMap.MarkerClickEventArgs e)
{
}
protected override void OnStart()
{
base.OnStart();
_mapView?.OnStart();
}
protected override void OnResume()
{
base.OnResume();
_mapView?.OnResume();
}
protected override void OnPause()
{
base.OnPause();
_mapView?.OnPause();
}
protected override void OnStop()
{
base.OnStop();
_mapView?.OnStop();
}
protected override void OnSaveInstanceState(Bundle outState)
{
base.OnSaveInstanceState(outState);
_mapView?.OnSaveInstanceState(outState);
}
public override void OnLowMemory()
{
base.OnLowMemory();
_mapView?.OnLowMemory();
}
protected override void OnDestroy()
{
base.OnDestroy();
_mapView?.OnDestroy();
}
}
}
No hay comentarios.:
Publicar un comentario