Afficher des animations GIFS avec Glide

 

Salut les amis, dorénavant j’essayerai de partager aussi des petits codes utiles. Aujourd’hui nous allons essayer d’afficher des animations GIF. Et nous allons faire cela grâce à la librairie Glide 😀

Qu’est-ce Glide ?

Pour faire bref, Glide est une librairie qui vous permet d’afficher des images comme Picasso. Mais je dirais que l’un de ses points forts, c’est qu’on peut afficher des gif contrairement à Picasso.

L’intégration

  1. Dans Android studio, créer un nouveau projet en allant dans File->New->New Project                                       
  2. Dans Application name mettez “GlideExemple” et Company domaine “com.tutoandroidfrance.glideexamplegif”
  3. Dans votre fichier build.gradle, copier le code suivant et synchroniser
    compile 'com.github.bumptech.glide:glide:3.6.0'
  4. Ajouter la permission INTERNET dans votre fichier AndroidManifest.xml 
    </pre>
    <pre><?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="com.androidpourtous.glideexamplegif" >
    
        <uses-permission android:name="android.permission.INTERNET"/>
    
        <application
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher"
            android:label="@string/app_name"
            android:theme="@style/AppTheme" >
            <activity
                android:name=".MainActivity"
                android:label="@string/app_name" >
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
    
                    <category android:name="android.intent.category.LAUNCHER" />
                </intent-filter>
            </activity>
        </application>
    
    </manifest></pre>
    <pre>
  5. Créer un fichier activity_main.xml dans layouts et copier le code suivant
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"     android:layout_height="match_parent"  tools:context=".MainActivity">
    
        <ImageView         android:layout_alignParentTop="true"         android:layout_width="match_parent"         android:layout_height="200dp"         android:id="@+id/imageView3" />
    
        <LinearLayout         android:layout_below="@id/imageView3"         android:layout_width="match_parent"         android:layout_height="200dp"         android:weightSum="2"         android:orientation="horizontal">
    
            <ImageView             android:layout_width="wrap_content"             android:layout_height="match_parent"             android:layout_weight="1"             android:id="@+id/imageView1" />
    
            <ImageView             android:layout_width="wrap_content"             android:layout_height="match_parent"             android:layout_weight="1"             android:id="@+id/imageView2" />
    
        </LinearLayout>
    
    </RelativeLayout>
  6. Créer une class MainActivity 
    package com.androidpourtous.glideexamplegif;
    
    import android.os.Bundle;
    import android.support.v7.app.ActionBarActivity;
    import android.widget.ImageView;
    
    import com.bumptech.glide.Glide;
    
    public class MainActivity extends ActionBarActivity {
    
        private ImageView image1, image2, image3;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            image1 = (ImageView) findViewById(R.id.imageView1);
            image2 = (ImageView) findViewById(R.id.imageView2);
            image3 = (ImageView) findViewById(R.id.imageView3);
    
            Glide.with(this).load("http://media.giphy.com/media/UtiwNokthANEY/giphy.gif").into(image1);
            Glide.with(this).load("http://media0.giphy.com/media/fLL4hTppVlf0Y/giphy.gif").into(image2);
            Glide.with(this).load("http://media.giphy.com/media/2aOQ9yk8oQYKc/giphy.gif").into(image3);
        }
    
    }

Maintenant vous pouvez admirer le résultat ! 😀

Voilà le CODE SOURCE

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *