En este curso se retoman los temas vistos en cursos anteriores. Se complementan con aspectos prácticos como la forma de implementar mapas en tus proyectos con el API de Google Maps. También, muestra cómo aprovechar el multitask de Android y hacer animaciones en 2D para llevar tus aplicaciones a más dispositivos como weareables, televisiones y autos. Después de este curso, podrás subir tu aplicación a Google Play Store y hacerte visible para el mundo entero.
Ejemplo: Consumiendo Json con Gson
Loading...
From the course by Universidad Nacional Autónoma de México
Desarrollo de aplicaciones avanzadas con Android
73 ratings
Universidad Nacional Autónoma de México
73 ratings
Course 4 of 5 in the Specialization Desarrollo de aplicaciones móviles con Android
From the lesson
Web Services
En este módulo, aprenderás a consumir un API Rest para generar persistencia en tus aplicaciones móviles consumiendo datos de Instagram, serializando y deserializando datos JSON.
Meet the Instructors
Anahi SalgadoAnahi Salgado. Android Certified Application Developer, programadora, capacitadora y conferencista.
Universidad Nacional Autónoma de México
Muy bien, pues una vez que you hemos implementado Retrofit en nuestro proyecto,
you creamos nuestro adaptador para Retrofit,
para realizar nuestras consultas, pues ahora se supone que you
estamos obteniendo la respuesta pero en realidad como platicamos hace un momento,
la respuesta no está viniendo como realmente nosotros la queremos.
La respuesta está viniendo en esta forma, en este tipo de JSON y pues la verdad,
este JSON es, tiene demasiados datos o demasiadas cosas que para el
detalle de nuestro proyecto, la verdad es que no nos interesa tanto tener todo eso.
Vamos a analizar un poco el modelo.
Tenemos aquí nuestro POJO, nuestro POJO contacto y lo que hemos comentado desde
un principio, que a nosotros nos interesa solamente mostrar para este ejemplo,
es necesitamos el identificador del contacto, o sea el identificador
de nuestro perfil de Instagram, necesitamos el nombre completo,
necesitamos la URL de la foto y también necesitamos la cantidad de likes.
Y además pues nosotros solamente habíamos dicho
que estaríamos mostrando como en forma de grid en un RecyclerView,
una tarjeta o tarjetas de esta forma.
Okey, estaremos mostrando,
aquí está el preview, estaremos trabajando esta tarjeta, okey.
Entonces dijimos que esta tarjeta iba a estar
en 2 columnas e iba a estar repetidas donde aquí íbamos a estar mostrando
todas las fotos del perfil de mi perrito, de mi perritomike.
Entonces pues todas estas fotos deben mostrarse aquí en este grid.
Entonces lo que haré será pues identificar mi objeto,
o mi modelo de datos y entonces a partir de este modelo de datos, voy a identificar
en mi JSON cuáles son los datos que a mí realmente me interesan, okey.
Entonces yo tengo por acá, tengo aquí mi modelo de datos y entonces
en comparación con lo que tengo vamos a quitar esto,
vamos a hacer esto así un poquito, aquí está, listo, yo necesito el ID,
perfecto, el ID sí lo estoy obteniendo, lo estoy obteniendo
dentro de un objeto que viene junto con la data, un objeto user,
después necesito el nombre completo, también tengo ese dato es el full_name,
y después necesito la URL de la foto que si analizamos un poco,
pues en realidad aquí viene esta es la foto,
en realidad todo este objeto pertenece a la foto, el 0 es la primera foto,
el 1 la segunda foto, el 2 la tercera foto, y así sucesivamente.
Y entonces esta foto, la foto 0 la tengo disponible en 3 resoluciones,
es decir que a mí solamente me interesa una sola URL,
pero aquí estoy teniendo 3 URLs, okey.
Una para una resolución baja, una para una resolución
muy pequeña y otra para una resolución estándar, okey.
Entonces pues bueno, a mí esto como tal no me está funcionando
la forma en que viene este modelo de datos no me está funcionando,
y esto es algo muy común que vamos a toparnos en algún momento,
que las APIs pues probablemente no las construyamos nosotros mismos,
las construya alguien más y entonces pues no tenemos acceso o no podemos
definir cómo es que queremos que nos den la respuesta en cuestión de la API.
Entonces a veces no tenemos ese privilegio de decir quiero que me respondas
solamente por estos 4 datos y no todos los 20 datos que me traes aquí.
Y entonces, ¿qué hacemos en esos casos?
No podemos generar un modelo que tenga todo esto porque pues realmente sería
demasiado trabajo y ahorita pues este resultado, pues, son al menos no se,
20 datos, podríamos tener JSONs u objetos todavía mucho más complejos.
Y entonces generar una réplica de este objeto,
la verdad es que no es una solución.
Entonces lo que tendremos que hacer es generar nuestro propio deserializador,
es decir estuvimos trabajando con Retrofit
en nuestro adaptador, aquí está nuestro RestApiAdapter,
estuvimos trabajando con Retrofit este objeto, un GsonConverterFactory,
que este es precisamente el que se dedica a crear la copia o el que
se dedica como que a identificar la copia de todo lo que está aquí,
identifica si tengo una clase que sea toda la copia de este elemento.
Entonces nosotros vamos a hacer nuestro propio Gson,
vamos a hacer nuestra propia forma de estar codificando los datos.
Y entonces para eso voy a necesitar un deserializador, okey.
Voy a necesitar una nueva clase que me ayude a estar deserializando mis datos
en la forma que yo quiero que finalmente aparezcan, es decir en esta forma.
Entonces primeramente pues vamos a crear aquí,
estamos en nuestro package RestApi, y ahí voy a crear
un package que se llame deserializador.
Le pondremos deserializador
y perfecto, ahí deben estar todos nuestros deserializadores, ahorita
pues habrá una única clase puesto que solo estamos generando una sola petición,
pero aquí deben estar concentradas todas tus clases que se dediquen a deserializar
en los modelos que tú finalmente quieres o lo que finalmente necesitas.
Entonces vamos a ponerle aquí contactoDeserializador.
Listo.
Y entonces pues lo que vamos a estar trabajando es
que esta clase va a estar implementando de una interfaz,
una interfaz que proviene del paquete Gson que you Gson, no o Gson,
trato de decirlo más como Gson para que a veces no nos confundamos con JSON.
Okey, entonces nosotros you habíamos importado una librería Gson que
proviene del equipo de square, y que you viene pues lista
y compatible a la perfección con Retrofit, es del mismo equipo square.
Y entonces en nuestro contactoDeserializador vamos a estar
implementando, voy a colocar implement la interfaz
JsonDeserializer, okey, esto es lo que busco.
Y como observas, pues trae también consigo
la forma de diamante y entonces esto lo que espera es que
la forma o la clase que vamos a estar tomando como referencia para deserializar,
que será nuestra contactoResponse, okey.
Esta clase contactoResponse es la clase objetivo que definimos,
o sea es la clase que nosotros hemos decidido que
así se comporte nuestra data, así se comporta nuestro JSON.
Vamos a implementar los métodos, implement methods, es un único método, deserialize,
le vamos a dar okey, y muy bien, deserialize.
Entonces aquí vamos a comenzar partiendo de un objeto Gson,
okey, le voy a poner aquí Gson igual a new, y este objeto Gson nos va a ayudar
a comenzar a deserializar la data que estamos obteniendo, okey.
Entonces, bien, con este Gson voy a colocar aquí Gson.fromJson,
le voy a decir
del Json que estás trayendo que en realidad lo estamos cachando aquí,
este es Json,
coma, quiero que lo asemejes con la clase
contactoResponse.class, va a ser la relación que vamos a establecer
y entonces quiero que me devuelvas un contactoResponse,
un objeto de tipo contactoResponse, bien.
Pues hasta ahorita, esto no es todo, todavía no hemos terminado, y entonces
este contactoResponse es lo que finalmente vamos a estar devolviendo aquí.
Okey, porque you va a ser el objeto.
Ahorita vamos a empezar a trabajar toda esta parte del Gson,
pero este objeto que estamos devolviendo you va a ser el objeto final you
con todos los datos de aquí, de nuestro JSON,
las únicas claves o los únicos datos que necesitamos.
Entonces continuando por acá, lo primero que nos topamos
en esto es que esta data como tal, si observas tiene unos.
corchetes en vez de unas llaves, cuando veamos llaves en un objeto como esto,
me voy a acercar un poco, cuando veamos llaves,
nos estamos refiriendo a un objeto.
Pero cuando yo vea corchetes, me estoy refiriendo a un arreglo de objetos.
Entonces tengo por aquí mi objeto 0, mi objeto 1, 2, 3, hasta el 8,
entonces lo primero que voy a estar trabajando son arreglos de objetos.
Entonces voy a declarar un objeto de tipo JsonArray
y entonces le voy a poner aquí contactoResponseData, okey.
Le coloco data porque eso corresponde, eso es como un indicador para mi que
es la data, así se llama el nombre de ese JsonArray.
Entonces colocaré aquí mi Json.
le voy a decir primero getAsJsonObject y posteriormente
le voy a decir .getAsJsonArray.
Y entonces ese JsonArray lo que espera dice, que espera un string
que es el nombre de la etiqueta que aquí estamos mostrando.
Este array se llama data, okey, nosotros pondríamos aquí data, así como está.
Y entonces esta data you le pertenece a este objeto contactoResponseData.
Muy bien.
No podemos estar manejando esto,
porque pues ahorita es data pero mañana le cambian el nombre, entonces la mejor
práctica para esto es generar una clase que me ayude a estar trabajando con esto.
Entonces para hacer esto mucho mejor haremos una clase donde concentremos
todas nuestras JsonKeys, que serán todas nuestras llaves para
accesar a cada atributo de este objeto Json.
Entonces comenzando por la etiqueta data, entonces vamos a borrar esto,
y voy a generar mi clase, vamos a hacerla desde acá, okey.
Vamos a hacer nuestras JsonKeys aquí
en RestApi Java class, le voy a poner JsonKeys.
Perfecto, y esta como hemos venido manejando será una clase final
y entonces lo primero que voy a declarar
static_final o final string y le vamos a poner
en este caso será Response_Array
y aquí le vamos a poner Media_Response_Array
y donde vienen los Media de la respuesta
es en la etiqueta data, okey; bien.
Ahora lo siguiente voy a hacer un control d,
vamos a ir poniendo cada etiqueta que nos interesa.
Entonces de data
me interesa según mi modelo de datos el ID, okey,
y el ID, la etiqueta ID viene así, tal cual como ID.
Vamos a ponerla, le vamos a poner aquí
User_ID y será la etiqueta id,
así en minúscula, tiene que estar escrito exactamente igual.
Después me interesa el nombre completo,
el nombre completo y será el full name, okey.
Vamos a poner full_name.
Y vamos a poner aquí User_Fullname.
you está.
Bien, la siguiente según mi modelo es la URL de la foto,
vamos a poner aquí Media_Url
y este viene como url, url.
Bien, después viene este, likes, okey, likes.
Vamos a poner acá Media_Likes.
Bien, me gusta que esto esté acomodado así,
así que le voy a colocar aquí de esta forma
y para el likes, el de likes esperamos recibir un
número y entonces en el de likes se llama count, okey.
Vamos a ponerle aquí likes count.
Muy bien, entonces you tengo mi data,
otra cosa que necesitaré también es bueno, yo tengo los parámetros clave
pero como vimos algunos parámetros están anidados en ciertos objetos,
por ejemplo la URL o por ejemplo el full_name del usuario,
del usuario o del mismo usuario, vemos que por ejemplo el
ID viene en el objeto user y el full name también viene en el objeto user,
entonces necesitaremos de pronto también estar accesando
al objeto user para posteriormente extraer el ID y extraer el full_name.
Entonces también necesito tener esa clave aquí mismo, okey.
Entonces voy a poner aquí user y colocaré user, perfecto.
Entonces van, lo que vamos a colocar ahorita o lo que estamos colocando son
como todas las llaves padre, para accesar a las llaves hijo.
Entonces you accesé a ID, full_name, voy a irlo colocando un poco más
en jerarquía, para ir viendo como todo el camino que irá recorriendo.
Entonces a partir de data, llega al objeto user,
luego entra al id, luego entra al full_name.
Posteriormente necesitamos ahora el url, la url de la imagen.
Para esto pues, antes de llegar a la url
necesitaré llegar a este objeto image, entonces vamos a ponerle
Media_Images, okey.
Y debe llamarse images.
Así, images.
Y una vez entrando a images, tengo que decidir bueno,
tengo 3 objetos anidados.
Tengo el de low resolution, thumbnail y standard,
voy a escoger este de standard, que tiene una resolución de 320 por 320.
Entonces necesitaré accesar a este objeto standard resolution
vamos a poner aquí, le voy a poner
Media_standard_resolution.
Okey.
Y entonces por acá necesito colocar
standard en minúsculas y voy a seleccionarlo aquí y lo voy a copiar, para
que no tengamos problemas con la manera en que lo estamos escribiendo, okey.
Vamos a acomodar estos que queden igual, y muy bien.
Entonces estoy entrando a images, después
standard resolution, para finalmente accesar a la url.
Perfecto, ahora me faltaría el de count que son para los likes.
Para los likes necesitaré entrar primeramente a la etiqueta padre likes,
entonces para esto voy a manejar acá abajo Likes_Count
que corresponderá a ese de count y este será likes.
Vamos a ver si es en plural, sí, es en plural, likes, perfecto.
Aquí están todas mis JsonKeys,
y así si quiero ir accesando a más elementos dentro del objeto,
pues bueno tengo que fijarme que si están anidados pues las etiquetas padre.
Excelente.
Pues podemos continuar con nuestro deserializador que lo habíamos dejado
aquí, entonces me está solicitando el nombre de la clave,
el nombre de la llave, entonces mi llave está en JsonKeys y
aquí se llama le habíamos puesto,
como lo dejamos como MediaResponseArray, okey.
MediaResponseArray, aquí está.
Perfecto, you está el primero, ahora después de esto,
voy a empezar a deserializar todo lo que está en este array,
okey, y entonces para ello voy a generar un método auxiliar,
que le voy a poner private y esto me debe devolver
un ArrayList de contacto, recuerda que estamos devolviendo
el objeto contactoResponse que a su vez contiene un ArrayList de contacto.
Entonces ese ArrayList de contacto corresponde a esto que está aquí y esto
es lo que yo voy a estar deserializando en este método, y entonces pues por esa
razón, al deserializar al contactoResponse continúa
un ArrayList, y al deserializar esto este será nuestro mismo resultado.
Ahorita lo vemos y será más claro, deserializador,
deserializar ContactodeJson.
Okey, vamos a ponerlo así, entonces este va a recibir el JsonArray.
Ten cuidado de no estar importando, mira aquí tenemos dos okey,
dos JsonArray, necesitamos el que comienza con mayúsculas y después viene minúsculas
porque el otro, este es el que realmente necesitamos que proviene de Json,
de Gson, el otro proviene más que nada de otras clases de Java como tal.
Pero este no nos funciona, necesitamos el de Json.
Entonces fíjate muy bien cuál es el que estás importando,
es el que está en minúsculas.
Y aquí vamos a ponerle contacto,
este mismo objeto es el que vamos a estar recibiendo para deserializarlo.
Bien, y entonces voy a poner, voy a declarar mi objeto que voy a devolver
al final, contactos igual a new ArrayList.
Listo, entonces esto para deserializarlo lo haré en un bucle for,
okey, voy a poner un for y, y será hasta que la data se acabe, ¿no?
O sea hasta que este .size, hasta ahí se acabe, entonces este for
me va a estar ayudando a estar todo esto arreglo 0,
1, 2, 3, lo vamos a estar ahí iterando para entonces si quiero el ID,
entonces tendré que entrar primero al objeto user y luego obtener el ID,
si quiero la url tendré que entrar primero al objeto images,
y luego standard resolution y luego you obtener la ur.
Entonces, muy bien, con este for voy a poder estar haciendo eso todas
las veces por tantas fotos tenga, ajá, gracias al for.
Entonces voy a poner JsonObject, okey,
voy a accesar a los datos del usuario, ajá, esto.
Como observas, como te platiqué hace un momento, siempre que yo vea estas llaves,
quiere decir que voy a accesar a un objeto.
Si yo veo estas, estos corchetes, quiere decir que voy a accesar a un arreglo.
Entonces por eso la primera, el primer objeto lo declaramos JsonArray,
porque estoy declarando este que es un arreglo.
Quiero obtener el ID, entonces voy a accesar a un objeto,
ajá, este es el ID voy a accesar a un objeto.
Entonces por eso aquí voy a estar utilizando mi JsonObject, y entonces voy
a poner contacto
Response, y voy a poner User, okey.
Y lo haré a partir de mi objeto contactoResponseData.get,
le voy a decir el objeto en particular que obtenga,
por ejemplo si mi for va en el 0, entonces comenzará aquí.
Aquí todavía no nos está entrando al usuario, sino que
analizando un poco esta data, es más que nada el objeto 0, ajá.
Estoy entrando aquí a contactoResponseData que corresponde a este,
lo siguiente es un objeto sería entrar al objeto 0,
y pues lo haré, aquí le vamos a poner contactoResponseData también,
DataJson, okey, DataObject.
Así lo vamos a manejar y le diré getId.getAsJsonObject
que es lo que tengo, ajá.
Entonces estoy entrando al objeto 0,
a partir del objeto 0 es entonces cuando you puedo accesar
a mi objeto y user, y es precisamente lo que voy a poner a continuación, okey.
Vamos a poner JsonObject, eso también es un objeto, y vamos a poner un userJson.
Y a partir de este, contactoResponseDataObject le voy a decir
getAsJsonObject, obtén el objeto Json,
cuya clave sea user, esto es lo que necesitamos cachar.
Entonces aquí voy a usar mi clase de claves y le voy a poner este, user, ajá.
Listo.
Entonces ahora sí, este user Json es exactamente este objeto,
y a partir de este objeto you voy a poder obtener el ID y el full name.
Entonces obtengamos eso, obtengamos el ID y el full name.
Entonces el ID dijimos que lo vamos a manejar en un string,
le voy a decir user, userJson.get
y a partir de mi clave, user_id y le diré
que obtenga eso como un string, getAsString.
Entonces you estoy obteniendo el ID, que es lo primero, vamos con el full name.
Voy a poner String_nombreCompleto y
utilizaré mi objeto Json.get JsonKeys.User_Fullname
y tráeme eso como un string.
Listo, perfecto.
Vamos a acomodar esto para que se vea mejor, ahí está.
Espero que esto lo vayan entendiendo, en realidad es muy
de pronto se va convirtiendo muy intuitivo, muy lógico de seguir,
si seguimos, si analizamos la estructura de como viene el JSON y tenemos esa
capacidad de identificar cuál es un arreglo y cuál es un objeto,
la verdad es que es muy sencillo estar generando nuestro deserializador.
Bien, you tengo el nombre completo, ¿qué otro dato necesitaba de ahí?
Nada más, el ID y el nombre completo.
Ahora voy a obtener la foto, okey.
Entonces vamos con la foto.
Igual voy a necesitar un la foto viene en un JsonObject y le voy a poner imageJson.
Okey, voy a poner contactoResponseData le voy a poner .getAsJsonObject
y le voy a pedir a esa data .image
Media_Images; y sí, aquí, bien.
Media_images.
Ahora a esa imagen le debo pedir,
si vemos como viene el objeto,
le debo pedir otro objeto que es standard resolution, standard resolution.
Entonces JsonObject, le
vamos a poner standard
stdResolution Json y utilizaré imageJson.
getAsJsonObject y le solicitaré la de la JsonKey,
la etiqueta o la llave que me da ese dato.
Okey, muy bien.
Entonces you tengo, you estoy aquí.
Lo siguiente es solicitar la URL,
esto no es un objeto sino es simplemente un dato, una variable.
Entonces eso you lo puedo estar guardando String url de la foto.
Y aquí puedo pedir, vamos a acomodar esto,
a partir del objeto std standard resolution Json
puedo solicitar con el método get JsonKeys
.url media_url, ahí está.
Media_url y aquí vamos a decirle getAsString,
ahí está, perfecto, you tengo la foto.
Me faltaría los likes.
Si vamos de nuevo, para los likes, necesito
a partir del objeto 0, obtener los likes.
Okey, entonces a partir de este necesitaré los likes y de los
likes es un objeto también, entonces será JsonObject, le vamos a poner
likesJson contactoResponseData.getAsJsonObject,
le voy a pedir JsonKeys.
el de likes, el objeto likes.
A partir de ese objeto you puedo obtener
que los likes que vienen en un entero,
es un dato entero y entonces le puedo decir likesJson.get
se llama keys JsonKeys.
era count, aquí está count y le diré getAsInt,
dámelo como un entero, aquí está, este es el que estoy usando count.
Listo, you están los datos que quiero obtener y como estoy en un for,
va a estar sacando estos datos de cada elemento,
cada elemento tiene absolutamente las mismas llaves entonces
no tengo que preocuparme por eso, cada elemento trae la misma estructura.
Y entonces lo que voy a estar devolviendo dijimos que es un arreglo de contactos.
Entonces voy a estar llenando este array de contactos,
pues con objetos de tipo contacto, le voy a poner aquí current,
le vamos a poner contactoActual igual a new
Contacto y le vamos a decir contactoActual.setId,
setId, y le pondremos nuestro Id,
contactoActual.setNombreCompleto y le pondremos nuestra variable
nombreCompleto, contactoActual.setUrlFoto
le ponemos la URL de la foto y contactoActual.likes
setLikes, le pondremos los likes.
Bien.
Perfecto, una vez que you tengo el objeto lleno con los datos que estoy
obteniendo del deserializador, procederé
a meterlos en mi ArrayList.
Entonces este ArrayList lo estoy llenando aquí y lo último
es que una vez que esté lleno, pues tengo que devolverlo contactos.
Perfecto.
you estoy devolviendo del deserializador el arreglo de contactos y
entonces puedo completar you mi objeto contactoResponse
le voy a decir contactoResponse.setContactos,
setContactos recibe un arreglo de contactos y entonces pues,
¿quién me está devolviendo un arreglo de contactos?
Pues el deserializador que acabo de crear el cual recibe toda la data y entonces
deserializa la data con la estructura que nosotros definimos por aquí, okey.
Entonces contactoResponse.setContactos deserializador.
Y no olvides simplemente devolver el objeto contactoResponse.
Esto es todo lo que hay que hacer de nuestro deserializador,
okey, sobreescribiendo el método deserialize
vamos a poder deserializar y darle la estructura que nosotros queremos.
Okey, entonces bien, si you estamos listos con nuestro deserializador,
bueno tenemos que llamar este deserializador en alguna parte,
¿y en qué parte la vamos a estar llamando?
Bueno pues en nuestro adaptador que habíamos dejado por aquí.
Recuerdas que este GsonConverterFactory lo único que hace es
toda este JSON que estamos devolviendo por acá,
detectar una clase que sea exactamente igual a acá.
Entonces, vamos nosotros aquí a definir
un objeto o a definir un método,
el cual ese método se va a encargar de decirle al GsonConverterFactory
que mi contacto deserializador va a estar asociado
o debe coincidir con mi objeto o mi clase contacto.
Entonces contacto debe coincidir con
contacto deserializador y eso se lo vamos a decir en el adaptador.
Para ello, aquí en mi RestApiAdapter voy a crear
un método public void,
public y vamos a devolver aquí un objeto de tipo Gson o Gson,
y le vamos a decir construye un
Gson o le vamos a decir convierte, sí
construye
un Gson deserializador.
Okey, construye un Gson deserializador, listo.
Bien, entonces
aquí vamos a generar una clase que se llama Gson,
GsonBuilder, vamos a generar un objeto de este tipo
GsonBuilder, ahí está,
y este GsonBuilder lo que esto nos va a ayudar precisamente a asociar que
el contacto deserializador, todo lo que deserialice de nuestro JSON
se lo asocie al objeto contactoResponse, a nuestra respuesta que habíamos,
a nuestro modelo que habíamos definido, registerTypeAdapter le
diré que sea primeramente contactoResponse.class,
new_ContactoDeserializador,
listo; muy bien.
Y entonces a mi Gson le voy a poner aquí miGson,
le diré que esta asociatividad, esto que acabo de hacer entonces lo cree.
Le voy a decir create y voy a devolver aquí
o podemos aquí generar un return así, ahí está perfecto.
Muy bien, para tener menos líneas de código, 3 líneas de código,
eso es todo lo que haremos.
Ahora este construye GsonDeserializador lo estaremos llamando donde
estamos llamando nuestro RestApi, y aquí sería bueno
ponerle construyeGsonDeserializador de MediaRecent.
Okey, para que entendemos cuál es la deserialización que estamos haciendo,
de quién, aquí podemos construir varios
y entonces estar asociando varios deserializadores con sus propios modelos.
Okey, bien.
Entonces donde estábamos llamando este
es donde estábamos llamando este RestApi era aquí en el presentador,
aquí está RestApi.
Y entonces vamos a modificar un poco en el método
de RestApiAdapter el método establecerConexionRest.
Api y le vamos a decir que reciba un objeto Gson, okey.
Un objeto de Gson y lo que haremos por acá
será que antes de llamar a este método establecer conexiones, yo tendré que haber
definido primeramente este que está aquí, construyeGsonDeserializador,
y devolver mi GsonBuilder para que este objeto Gson yo lo pueda pasar aquí.
Lo pueda pasar aquí.
Y entonces ahora you no va a construir un Gson o you no va a deserializar
de forma general, sino que ahora va a deserializar de forma específica
a partir del objeto que le estemos pasando de nuestro construyeGsonDeserializador.
Ahorita que estemos llamando las clases esto va a tener mucho más sentido.
Aquí en donde habíamos definido en nuestro RecyclerView fragment presenter,
voy a colocar aquí restApiAdapter.
Okey, es importante aquí pusimos el método como private,
vamos a definirlo como público porque lo necesitamos accesar desde otra clase.
Entonces aquí you podemos tener acceso a él, establecer conexión
con el API de Instagram, así,
okey este no es, es construyeGson,
primero va a construir el Gson y este lo podemos almacenar en un Gson,
Gson le vamos a decir Gson de mediaRecent.
Gson, ahí está,
aquí le voy a poner GsonMediaRecent, ahí está perfecto.
Y este GsonMediaRecent es el que estaremos pasando
en nuestro establecerConexionRestApiInstagram.
¿Qué está pasando?
Bueno primeramente estamos definiendo un objeto del tipo RestApiAdapter,
aquí está este objeto, este objeto
que lo primero que le estamos diciendo es que quiero,
este objeto va a establecer una conexión con el servidor,
con el API de Instagram, y entonces va a generar una consulta al API de Instagram
y esa consulta me va a devolver un resultado en formato de JSON, okey.
Cuando yo esté recibiendo esa consulta, esa respuesta de formato de JSON,
automáticamente lo que hace Retrofit es localizar una clase
que tenga el mismo modelo o la misma forma de la respuesta que estamos recibiendo.
Entonces lo que estamos haciendo aquí es primero construir nuestra,
nuestra forma en que queremos deserializar los datos.
Entonces antes de que se genere la
conexión, primero configuramos la forma en que queremos deserializar los datos,
entonces preparamos nuestro objeto y posteriormente
establecemos la conexión y le pasamos el objeto o le pasamos
la manera en que queremos deserializar esa respuesta.
Eso se lo pasamos aquí en este Gson y cuando establezca
la conexión con Root, automáticamente este objeto you va a estar preparado para
deserializar con el objeto que está recibiendo, este objeto,
el tiene asociado el contactoResponse y el contactoDeserializador,
tiene asociado su propio deserializador.
Y entonces a partir de ahí comienza a generar toda, se establece
el endpoint y empieza la consulta y todo se va haciendo automatizado.
Entonces este método construyeGsonDeserializadorMediaRecent,
tú puedes estar pues generando varios más por acá hasta
esto es para obtener los medios recientes,
o sea las fotos recientes pero puedes no se, traer la cantidad de followers,
y entonces necesitarás un deserializador para deserializar todo
el JSON de los followers, okey, y traer solamente los datos que a ti te importen.
Entonces de esta manera es como you estamos trabajando esto you se forma
muy fácilmente y yo creo que you estamos listos para correr nuestro proyecto
que no lo hemos corrido, no hemos visto esto cómo funciona.
Vamos a correrlo.
Esperemos que se genere la consulta, que se genere todo lo que
habíamos definido al principio y entonces vamos a estar al pendiente aquí
de nuestro look at porque estamos enviando varios mensajes.
Okey, aquí tenemos algunos errores,
estos errores nos están saliendo porque bueno, cambiamos,
recuerda que cambiamos la forma este, del modelo de contacto,
y entonces ahora you no tengo estos datos como tal, ahorita la verdad
es que ahorita you no estoy ocupando este modelo de datos o esta fuente de datos.
Entonces pues únicamente voy a comentar
esta parte, este while lo vamos a comentar así,
no nos va a causar nada, ningún error, no nos debería causar ningún
error porque la fuente de datos you la cambiamos, ¿en dónde fue que la cambiamos?
En nuestro RecyclerView fragmentPresenter.
Anteriormente teníamos obtener contactos de una base de datos,
y ahora vamos a obtener medios recientes de una Api, okey.
Vamos a correrlo de nuevo, vamos a estar al pendiente
aquí en nuestro Android Monitor, parece que no tenemos ningún error,
you está instalando la aplicación.
Y aquí nos está pensando un error,
y okey, esto es muy importante, y eso fue algo que se nos olvidó poner.
Dice que nos falta el permiso de internet,
eso es muy muy importante y es donde deberíamos haber comenzado.
Vamos a abrir nuestro archivo Android Manifest, okey,
entonces habíamos hemos establecido un permiso de llamadas,
de call phone, voy a generar mi permiso de internet,
voy a poner uses-permission y aquí vamos a buscar el de internet, ahí está.
Ahí está, perfecto, lo había puesto
simplemente en la cabecera de los permisos antes de la etiqueta application.
Lo voy a correr de nuevo, vamos a estar pendientes de
la consola, voy a borrar todo y en run,
y you nos está mostrando algo.
Okey, you nos está mostrando aquí algunos contactos, 1, 2, 3, 4, 5, 6, 7, 8, 9,
9 contactos, eso está bien, no está tronando nuestra aplicación.
Está perfecto, quiere decir que se está ejecutando la consulta.
Entonces no estamos viendo las fotos.
Recuerdas que pues no, no estábamos viendo las fotos porque
pues las fotos era algo que íbamos a dejar para el final y esto es algo interesante
porque las fotos las voy a estar manejando con una librería adicional,
que también es creada por el equipo de Square y esto se llama Picasso, okey.
Picasso, square Picasso.
Picasso es una librería que nos va a ayudar a implementar imágenes,
te acuerdas que lo que estábamos trayendo de las imágenes era una URL,
una URL de la imagen, aquí está, esta URL.
Entonces si yo selecciono esto, copiamos todo esto así,
y quiero verla, simplemente nos está trayendo esto, ¿no?
Entonces Picasso lo que hace es tomar como punto de partida una URL,
aquí se alcanza a ver, una URL y entonces introducirla en un objeto ImageView.
Eso es exactamente lo que nosotros queremos.
Nosotros en el proyecto anterior estábamos tomando las imágenes de a partir de
pues, de como un recurso que estaban incluídas en el proyecto.
Ahora las imágenes las vamos a obtener de una forma distinta,
las vamos a obtener a partir de una URL,
y entonces yo necesitaré implementar Picasso para estar trabajando esto.
Iré a la parte de download y aquí está,
es super fácil de integrar, igualmente tengo una librería en Gradle.
Voy a abrir mi archivo app module app, y voy a integrarlo aquí square.
com.squareup.picasso:picasso:2.5.2, y le voy
a decir sincroniza ahora.
En este momento pues Gradle va a empezar a sincronizar.
Listo, you acabó, fue muy rápido, y vamos a integrar picasso.
La forma en que estamos mostrando nuestras imágenes es en nuestra tarjetita,
en esta tarjetita que corresponde al RecyclerView.
Bueno, esta tarjetita, esta imagen, la estamos haciendo posible
gracias a nuestro contacto adaptador, a este RecyclerView que teníamos ahí,
en la carpeta de la raíz Adapter, contacto adaptador.
Y te acuerdas que incluso hasta lo habíamos comentado, ¿no?
Habíamos dejado este comentado así.
Bien.
Pues, aquí, lo que voy a hacer es traer mi librería picasso.with,
y le voy a decir, aquí va a recibir un contexto, yo you tenía un objeto activity,
le voy a dar un enter, le voy a decir .load, y con el contacto que tengo como
base voy a obtener la URL getUrlFoto,
que en este punto del proyecto, a este punto del proyecto
el objeto contacto con todos los datos you debió llegar aquí sano y salvo.
Y bueno, entonces le voy a dar geturl.placeholder.
Un placeholder es una imagen que me va a servir en caso de que pues,
no sé, la imagen no sea vista, entonces le voy a decir .placeholder,
y le voy a decir ese, ¿okey?
Que me traiga ese de bonus icon, .into,
y dónde quiero que se inserte esta URL de esta foto.
Lo quiero en este imgFoto, image view foto,
que lo obtengo a partir de mi ViewHolder, imgFoto.
Listo, es todo lo que hay que hacer.
you deben verse nuestras fotos, ¿okey?
Y vamos a darle aquí enter.
Otra cosa que estoy detectando ahorita que es a propósito de esto, es que
tengo aquí la palabra Likes, dijimos que no queremos estar mostrando eso,
entonces voy a borrar esto, así, de ahí.
Perfecto.
Vamos a darle play, y vamos a esperar a que nuestro proyecto empiece a correr.
you abrió, y perfecto.
you están aquí nuestros contactos,
las fotos de nuestros perritos, se están viendo a la perfección,
y vamos a revisar en comparación de lo que tenía yo por aquí.
De hecho, la cantidad de likes es, coincide a la perfección porque también
estamos trayendo los likes, entonces pues esta es mi aplicación
aquí en la web de Instagram, aquí está mi primer perrito.
Ahorita la aplicación se detuvo al dar like en una de las fotos,
vamos a ver por qué.
Y recuerda que lo que habíamos puesto era que al momento de
estar dando clic a una foto de un perrito deberíamos ver la foto del perrito,
entonces nos está diciendo que hay un Null Pointer Exception
en detalle contacto en la línea 41, ¿okey?
Entonces vamos a ver, estoy aquí.
Okey, vamos a nuestro Adapter, ContactoAdaptador,
a ver lo que estamos enviando cuando alguien le dé clic aquí a la foto.
¿Okey?
Entonces, estamos mostrando la URL,
y aquí getLikes, a partir de la bandera like y a partir de la bandera URL.
Entonces estamos mandando la foto y estamos mandando los likes que hay.
Muy bien, a la clase detalle contacto.
Ahí estamos enviando la URL, y es con like, ¿okey?
La URL y like también, y tenemos TextView,
detalles, LikesDetalle, vamos a abrir este layout,
a ver si está, y no,
no está un view como ese porque todavía tenemos asociado activity detalleContacto,
entonces vamos a cambiarle el layout.
Nosotros, si recuerdas nosotros habíamos definido otro activity detalleContacto
foto, y vamos a aprovechar que estamos aquí en el detalle para también
mostrar la imagen, y la imagen la haremos de la
misma forma que con picasso, entonces voy a copiar esto que teníamos con picasso,
o bien vamos a implementarlo, para que nos quede más práctica.
Vamos a poner picasso.with, necesitaremos el contexto,
aquí sí podemos poner this,
.load es básicamente la URL, la URL que estamos recibiendo,
y colocaré .placeholder,
mi archivo drawable que es un shock s,
.into, en qué view quiero mostrar, y acá tengo un view.
Es importante inicializar ese view,
entonces vamos a inicializarlo antes aquí, y
le voy a poner ImageView findViewById
R.Id.imgFotoDetalle.
Bien, ahí está.
Entonces aquí es donde lo quiero meter.
Muy bien.
Perfecto, vamos a correr esto de nuevo, lo voy a quitar,
y vamos a esperar un momento a que corra todo esto de nuevo.
Excelente,
you corrió nuestro proyecto, aquí están nuestras fotos,
aquí están apareciendo you, vamos a entrar a una foto y you nos está mostrando
la foto, muy bien, y vamos a entrar ahora a esta.
Ahí está, perfecto.
Y aquí también está la otra foto que tiene dos likes.
Vamos a compararlo con lo que tenemos acá en nuestro perfil.
Ahorita tengo dos likes en esta foto, y aquí evidentemente también.
De hecho es la única foto en la cual ahorita tengo likes, a ver vamos a dar
like, podemos dar nuestro like en una, me parece que sí, aquí tengo un like en esta.
Le voy a dar, perfecto, okey.
Entonces, esto pues bueno, hay que volver a inicializar la aplicación para que ahora
aparezcan, y sí, se está sincronizando perfectamente.
Tengo dos likes en esta foto, y si entro a la foto puedo ver toda la foto.
Y por ejemplo ahora vamos a dar like en esta, en este perrito.
Si observas ahorita dice 0,
vamos a terminar la aplicación y volverlo a iniciar para que se sincronice y
aquí está también, aquí está su huesito que le estamos dando.
Solamente, nosotros en vez de manejar corazoncitos estamos dándole huesitos
a cada perrito, y todos los datos los están manejando de una forma excelente.
Perfecto, así es cómo podemos estar generando consultas
a una app en específico, y además estarlas integrando en nuestro proyecto.
Aprendimos bastantes cosas, e incluso a poder mostrar imágenes que provengan
desde Internet o desde una URL en nuestros proyectos.
Explore our Catalog
Join for free and get personalized recommendations, updates and offers.
Coursera provides universal access to the world’s best education,
partnering with top universities and organizations to offer courses online.
© 2019 Coursera Inc. All rights reserved.
