Hola Vergasianos hoy vamos a ver un hermoso tutorial el cual se basa en consumir un servicio ósea un JSON donde te trae las coordenadas tanto latitud como longitud y luego estas convertirlas en marcadores que se mostraran en google map de Android, quiero dejar en claro algunas cosas, asi tu podrás saber si continuar o no con este tutorial, para empezar vamos usar retrofit para consumir el servicio y el patrón MVP.
Otra cosa que quiero aclarar es que no vamos utilizar una base de datos o lenguaje backend, vamos utilizar un servicio online que nos va generar el Json y nosotros podremos consumirlo de forma normal. Una ves aclarado esto no perdemos mas tiempo y continuamos con el tutorial.
Mostrar coordenadas en GoogleMap con retrofit en android
Contenidos
Herramientas
Deben mirar el siguiente video para poder armar lo necesario al tutorial, también les dejo algunos enlaces que se utilizaran y se explica de forma clara en el video.
https://codepen.io/mmednik/pen/vmZzRy
https://jsonformatter.curiousconcept.com/
https://www.json-generator.com/
JSON
[ { "ID":48, "Titulo":"Helgelandskysten", "Longitud":"12.63376", "Latitud":"66.02219", "Descripcion":"Punto 1" }, { "ID":46, "Titulo":"Tysfjord", "Longitud":"16.50279", "Latitud":"68.03515", "Descripcion":"Punto 2" }, { "ID":44, "Titulo":"Sledehunds-ekspedisjon", "Longitud":"7.53744", "Latitud":"60.08929", "Descripcion":"Punto 3" }, { "ID":43, "Titulo":"Amundsens sydpolferd", "Longitud":"11.38411", "Latitud":"62.57481", "Descripcion":"Punto 4" }, { "ID":39, "Titulo":"Vikingtokt", "Longitud":"6.96781", "Latitud":"60.96335", "Descripcion":"Punto 5" }, { "ID":6, "Titulo":"Tungtvann- sabotasjen", "Longitud":"8.49139", "Latitud":"59.87111", "Descripcion":"Punto 6" } ]
Librerías
//Retrofit implementation 'com.squareup.retrofit2:retrofit:2.0.0' implementation 'com.squareup.retrofit2:converter-gson:2.0.0' //Google Map implementation 'com.google.android.gms:play-services-maps:16.1.0' implementation 'com.google.android.libraries.places:places:1.0.0'
AndroidManifest
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.androfast.appmapretrofitmvp"> <uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES"/> <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/> <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme" android:usesCleartextTraffic="true"> <activity android:name=".view.MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <meta-data android:name="com.google.android.maps.v2.API_KEY" android:value="Aqui debes ingresar tu api key"/> </application> </manifest>
Estructura
Aquí viene la parte Android, chicos tienen que ver el video para poder entender como armar el proyecto, la estructura esta basada en el patrón MVP y deberá tener lo siguiente:
Dentro de cada carpeta ira las siguientes clases:
Coordenada
public class Coordenada { @SerializedName("ID") private String id; @SerializedName("Titulo") private String titulo; @SerializedName("Longitud") private String longitud; @SerializedName("Latitud") private String latitud; @SerializedName("Descripcion") private String descripcion; public Coordenada(String id, String titulo, String longitud, String latitud, String descripcion) { this.id = id; this.titulo = titulo; this.longitud = longitud; this.latitud = latitud; this.descripcion = descripcion; } public String getId() { return id; } public void setId(String id) { this.id = id; } public String getTitulo() { return titulo; } public void setTitulo(String titulo) { this.titulo = titulo; } public String getLongitud() { return longitud; } public void setLongitud(String longitud) { this.longitud = longitud; } public String getLatitud() { return latitud; } public void setLatitud(String latitud) { this.latitud = latitud; } public String getDescripcion() { return descripcion; } public void setDescripcion(String descripcion) { this.descripcion = descripcion; } }
CoordenadaPresenter
public class CoordenadaPresenter { private CoordenadaView coordenadaView; private RetrofitService retrofitService; public CoordenadaPresenter(CoordenadaView coordenadaView) { this.coordenadaView = coordenadaView; if(this.retrofitService == null){ this.retrofitService = new RetrofitService(); } } public void getCoordenadas(){ retrofitService .getApi() .getCoordenada() .enqueue(new Callback<List<Coordenada>>() { @Override public void onResponse(Call<List<Coordenada>> call, Response<List<Coordenada>> response) { List<Coordenada> data = response.body(); if(data !=null && data.size() > 0){ coordenadaView.coordenadaReady(data); } } @Override public void onFailure(Call<List<Coordenada>> call, Throwable t) { Log.d("ERROR", t.getMessage()); } }); } }
RetrofitApi
public interface RetrofitApi { @GET("api/json/get/cerMKoTojm") Call<List<Coordenada>> getCoordenada(); }
RetrofitService
public class RetrofitService { private Retrofit retrofit = null; public RetrofitApi getApi(){ String BASE_URL="http://www.json-generator.com/"; if (retrofit == null) { retrofit = new Retrofit .Builder() .baseUrl(BASE_URL) .addConverterFactory(GsonConverterFactory.create()) .build(); } return retrofit.create(RetrofitApi.class); } }
CoordenadaView
public interface CoordenadaView { void coordenadaReady(List<Coordenada> coordenadas); }
MainActivity
public class MainActivity extends FragmentActivity implements CoordenadaView, OnMapReadyCallback { private GoogleMap nMap; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); SupportMapFragment supportMapFragment =(SupportMapFragment)getSupportFragmentManager() .findFragmentById(R.id.map); supportMapFragment.getMapAsync(this); } @Override protected void onResume() { super.onResume(); CoordenadaPresenter coordenadaPresenter = new CoordenadaPresenter(this); coordenadaPresenter.getCoordenadas(); } @Override public void coordenadaReady(List<Coordenada> coordenadas) { for (Coordenada coordenada: coordenadas){ nMap.moveCamera( CameraUpdateFactory.newLatLngZoom(new LatLng(66.02219,12.63376),4)); nMap.addMarker(new MarkerOptions() .position(new LatLng(Double.valueOf(coordenada.getLatitud()),Double.valueOf(coordenada.getLongitud()))) .title(coordenada.getTitulo())); } } @Override public void onMapReady(GoogleMap googleMap) { nMap = googleMap; } }
activity_main
<?xml version="1.0" encoding="utf-8"?> <fragment xmlns:android="http://schemas.android.com/apk/res/android" xmlns:map="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/map" android:name="com.google.android.gms.maps.SupportMapFragment" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".view.MainActivity" />
Hola soy Alex Céspedes fundador de ANDROFAST, programo algunas cosas por diversión, me gusta aprender cosas nuevas y estoy pendiente de todo lo que tenga que ver con tecnología. Este blog lo cree para todas las personas que tengan dificultades en la programación, para ser sincero nunca fui bueno y reprobé algunos cursos de programación, pero mis ganas de aprender pudieron más. SI YO PUEDO TU PUEDES ANIMO!