Carga imagenes desde internet a tu proyecto Android

En cualquiera de nuestros proyectos no siempre tendremos todas las imágenes en nuestro ambiente de desarrollo, si no que en muchas ocasiones se cargan desde fuentes que se encuentran en internet, esta información se puede conseguir desde una API o una base de datos, y en el presente artículo te enseñare a cargar estas imagenes y mostrarlas en tu aplicación android.

Para realizar lo anteriormente mencionado usaremos la librería Glide la cual es una librería muy fácil de usar y a la vez bastante poderosa ya que nos permite no solo la carga de imágenes sino tambien el caching de estas mismas en disco.

Como primer paso vamos agregar esta librería en nuestro proyecto, para lo cual debemos agregar en la zona de dependencias de nuestro gradle las siguientes lineas:

1implementation 'com.github.bumptech.glide:glide:4.7.1'
2annotationProcessor 'com.github.bumptech.glide:compiler:4.7.1'
3

Con esto ya realizado android studio sincronizara cambios y agregará esta dependencia a nuestro proyecto.

Como primer paso debemos crear el ImageView donde renderizaremos esta imágen, para lo cual simplemente crearemos este ImageView en el archivo xml de nuestro Activity.

1<?xml version="1.0" encoding="utf-8"?>
2<LinearLayout 
3    android:orientation="vertical"
4    android:layout_width="match_parent"
5    android:layout_height="match_parent"
6    xmlns:android="http://schemas.android.com/apk/res/android">
7
8    <ImageView
9        android:id="@+id/ed_image"
10        android:layout_width="100dp"
11        android:layout_height="100dp" />
12
13</LinearLayout>
14

Ahora en nuestro archivo de java vamos a asociar el ImageView del xml con el código java:

1public class MainActivity extends AppCompatActivity {
2
3    private ImageView imageView;
4    
5    @Override
6    protected void onCreate(Bundle savedInstanceState) {
7        super.onCreate(savedInstanceState);
8        setContentView(R.layout.activity_main);
9        // Asociamos ImageView
10        imageView = findViewById(R.id.ed_image);
11    }
12}
13

Y como último paso antes de empezar a usar Glide, debemos darle el permiso de acceso a internet a nuestra aplicación con la siguiente línea en el archivo manifest:

1 <uses-permission android:name="android.permission.INTERNET"></uses-permission>
2

Esta etiqueta debe ser hija directa de la etiqueta manifest.

Ya con todo esto hecho, cargar la imágen es muy sencillo y se puede realizar con las siguientes líneas de código:

1        // Cargamos la imagen
2        String EDteamImage = "https://ed.team/sites/default/files/styles/16_9_medium/public/2018-04/guia-de-estilos.jpg?itok=73JysFzx";
3        Glide.with(getApplicationContext()).load(EDteamImage).into(imageView);
4

Basicamente lo que estamos haciendo es guardar en una variable de tipo String la dirección de la imágen(Recuerda que esta puede venir desde una API o desde una base de datos), despues usamos Glide en el cual ejecutamos el método estático with() que recibe como parámetro el contexto de la Activity, despues ejecutamos el método load() que recibe como parámetro un String con la dirección de la imágen, la cual esta en la variable EDteamImage, por último ejecutamos el método into() donde pasamos el ImageView previamente creado en el cual renderizaremos nuestra imágen.

Ya cuando ejecutemos nuestra aplicación la imagen se vería así

Espero que te haya gustado, te invito a visitar la documentación de Glide ya que tiene opciones muy interesantes para el manejo de estas imágenes, que se que pueden ser de mucha utilidad en tus proyectos Android.

Hasta la próxima.