Glide: Displaying GIF in ImageView using Glide

Created on 11 Apr 2016  路  12Comments  路  Source: bumptech/glide

Glide Version:compile 'com.github.bumptech.glide:glide:3.7.0'

Integration libraries:No

Device/Android Version:4.4.2

I am using Glide for the very fist time to display GIF inside ImageView. I have coded it the way it is given across several sites. But it is not working. I have given all the code below:(Please let me know if I have mistaken anything)

Project level build.gradle

buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.0.0'
        classpath 'com.google.gms:google-services:2.1.0-alpha5'
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        jcenter()
    }
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

App level build.gradle file:

apply plugin: 'com.android.application'

android {
    compileSdkVersion 22
    buildToolsVersion "23.0.3"

    defaultConfig {
        applicationId "com.example.winner.myapplication"
        minSdkVersion 19
        targetSdkVersion 22
        versionCode 1
        versionName "1.0"
        renderscriptTargetApi 19
        renderscriptSupportModeEnabled true

    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:22.2.1'
    //compile files('libs/ion-2.1.6.jar')
    //compile files('libs/androidasync-2.1.6.jar')
    compile 'com.github.bumptech.glide:glide:3.7.0'
}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.winner.myapplication.MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:gravity="center"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:id="@+id/layoutImage1"
        android:orientation="vertical"
        android:layout_gravity="center"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World!" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:gravity="center"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:id="@+id/layoutImage2"
        android:orientation="vertical"
        android:layout_below="@+id/layoutImage1"
        android:layout_gravity="center"
        >
        <ImageView
            android:id="@+id/test_image"
            android:layout_width="160dp"
            android:layout_height="90dp"
            android:scaleType="fitXY"
            android:layout_gravity="center"
            android:src="@drawable/test"
            />

    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:gravity="center"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:id="@+id/layoutImage3"
        android:orientation="vertical"
        android:layout_below="@+id/layoutImage2"
        android:layout_gravity="center"
        >
        <TextView android:text="Hello World!" android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="right"
            android:id="@+id/submit"
            android:text="Submit" />

    </LinearLayout>

</RelativeLayout>

Activity Java code:

package com.example.winner.myapplication;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.bumptech.glide.request.target.GlideDrawableImageViewTarget;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final Button submit = (Button) findViewById(R.id.submit);
        submit.setOnClickListener(onClickSubmit);
    }

    View.OnClickListener onClickSubmit = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            ImageView iView = (ImageView) findViewById(R.id.test_image);
            Glide.with(getApplicationContext()).
                    load("http://i.imgur.com/1ALnB2s.gif").into(iView);

        }
    };
}

I do not see the GIF image after clicking on the Submit button.

question
Source
picture vilaspatil321

All 12 comments

Try with another website's GIF. It's possible the server is replying with an HTML page instead of the raw bytes.

You can add a listener to look for exceptions: https://github.com/bumptech/glide/wiki/Debugging-and-Error-Handling#requestlistener

TWiStErRob picture TWiStErRob on 11 Apr 2016

Another possiblity: the image is decoded and then re-encoded as GIF which takes a really long time (high resolution, and lot of frames), so try adding .diskCacheStrategy(SOURCE) before .into(.

See #281 and related issues.

TWiStErRob picture TWiStErRob on 11 Apr 2016

The URL returns GIF image in the browser. I have checked it using curl command in Git Bash on windows and there too it returns GIF binary data.
I have also tried to use .diskCacheStrategy(SOURCE)before .into(. It did not work either.
Can you please check out if the same piece of code runs at your end? OR you can point me to any Gist having complete code to demonstrate basic GIF loading into ImageView using Glide.

vilaspatil321 picture vilaspatil321 on 12 Apr 2016

I tried and it's the re-encoding. 

Glide.with(this).("http://i.imgur.com/1ALnB2s.gif").into(iView)

loaded in 1.5 minutes, you can see that the GC is working hard during that time.

Glide.with(this).("http://i.imgur.com/1ALnB2s.gif").diskCacheStrategy(DiskCacheStrategy.SOURCE).into(iView)

loads immediately without a problem.

TWiStErRob picture TWiStErRob on 12 Apr 2016
😕1 👍1

I don't know whats going wrong in my case but it is not working. I tried this:

Glide.with(this).load("http://i.imgur.com/1ALnB2s.gif").
                diskCacheStrategy(DiskCacheStrategy.SOURCE).into(iView);

But nothing happens. The ImageView apeears blank.

vilaspatil321 picture vilaspatil321 on 12 Apr 2016

Please try these https://github.com/bumptech/glide/wiki/Debugging-and-Error-Handling#requestlistener

TWiStErRob picture TWiStErRob on 12 Apr 2016

The log says:

04-12 22:57:01.383 9818-9818/com.example.winner.myapplication D/GLIDE: onException(java.lang.SecurityException: Permission denied (missing INTERNET permission?), http://www.kizoa.com/img/e8nZC.gif, Target for: android.widget.ImageView{41fdffd8 V.ED.... ......ID 148,32-468,212 #7f0c0051 app:id/test_image}, true)
      java.lang.SecurityException: Permission denied (missing INTERNET permission?)
          at java.net.InetAddress.lookupHostByName(InetAddress.java:431)
          at java.net.InetAddress.getAllByNameImpl(InetAddress.java:236)
          at java.net.InetAddress.getAllByName(InetAddress.java:214)
          at com.android.okhttp.internal.Dns$1.getAllByName(Dns.java:28)
          at com.android.okhttp.internal.http.RouteSelector.resetNextInetSocketAddress(RouteSelector.java:216)
          at com.android.okhttp.internal.http.RouteSelector.next(RouteSelector.java:122)
          at com.android.okhttp.internal.http.HttpEngine.connect(HttpEngine.java:292)
          at com.android.okhttp.internal.http.HttpEngine.sendSocketRequest(HttpEngine.java:255)
          at com.android.okhttp.internal.http.HttpEngine.sendRequest(HttpEngine.java:206)
          at com.android.okhttp.internal.http.HttpURLConnectionImpl.execute(HttpURLConnectionImpl.java:355)
          at com.android.okhttp.internal.http.HttpURLConnectionImpl.connect(HttpURLConnectionImpl.java:89)
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadDataWithRedirects(HttpUrlFetcher.java:72)
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadData(HttpUrlFetcher.java:44)
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadData(HttpUrlFetcher.java:20)
          at com.bumptech.glide.load.model.ImageVideoModelLoader$ImageVideoFetcher.loadData(ImageVideoModelLoader.java:70)
          at com.bumptech.glide.load.model.ImageVideoModelLoader$ImageVideoFetcher.loadData(ImageVideoModelLoader.java:53)
          at com.bumptech.glide.load.engine.DecodeJob.decodeSource(DecodeJob.java:170)
          at com.bumptech.glide.load.engine.DecodeJob.decodeFromSource(DecodeJob.java:128)
          at com.bumptech.glide.load.engine.EngineRunnable.decodeFromSource(EngineRunnable.java:122)
          at com.bumptech.glide.load.engine.EngineRunnable.decode(EngineRunnable.java:101)
          at com.bumptech.glide.load.engine.EngineRunnable.run(EngineRunnable.java:58)
          at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:422)
          at java.util.concurrent.FutureTask.run(FutureTask.java:237)
          at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1112)
          at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:587)
          at java.lang.Thread.run(Thread.java:841)
          at com.bumptech.glide.load.engine.executor.FifoPriorityThreadPoolExecutor$DefaultThreadFactory$1.run(FifoPriorityThreadPoolExecutor.java:118)
       Caused by: libcore.io.GaiException: getaddrinfo failed: EAI_NODATA (No address associated with hostname)
          at libcore.io.Posix.getaddrinfo(Native Method)
          at libcore.io.ForwardingOs.getaddrinfo(ForwardingOs.java:61)
          at java.net.InetAddress.lookupHostByName(InetAddress.java:406)
          at java.net.InetAddress.getAllByNameImpl(InetAddress.java:236)聽
          at java.net.InetAddress.getAllByName(InetAddress.java:214)聽
          at com.android.okhttp.internal.Dns$1.getAllByName(Dns.java:28)聽
          at com.android.okhttp.internal.http.RouteSelector.resetNextInetSocketAddress(RouteSelector.java:216)聽
          at com.android.okhttp.internal.http.RouteSelector.next(RouteSelector.java:122)聽
          at com.android.okhttp.internal.http.HttpEngine.connect(HttpEngine.java:292)聽
          at com.android.okhttp.internal.http.HttpEngine.sendSocketRequest(HttpEngine.java:255)聽
          at com.android.okhttp.internal.http.HttpEngine.sendRequest(HttpEngine.java:206)聽
          at com.android.okhttp.internal.http.HttpURLConnectionImpl.execute(HttpURLConnectionImpl.java:355)聽
          at com.android.okhttp.internal.http.HttpURLConnectionImpl.connect(HttpURLConnectionImpl.java:89)聽
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadDataWithRedirects(HttpUrlFetcher.java:72)聽
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadData(HttpUrlFetcher.java:44)聽
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadData(HttpUrlFetcher.java:20)聽
          at com.bumptech.glide.load.model.ImageVideoModelLoader$ImageVideoFetcher.loadData(ImageVideoModelLoader.java:70)聽
          at com.bumptech.glide.load.model.ImageVideoModelLoader$ImageVideoFetcher.loadData(ImageVideoModelLoader.java:53)聽
          at com.bumptech.glide.load.engine.DecodeJob.decodeSource(DecodeJob.java:170)聽
          at com.bumptech.glide.load.engine.DecodeJob.decodeFromSource(DecodeJob.java:128)聽
          at com.bumptech.glide.load.engine.EngineRunnable.decodeFromSource(EngineRunnable.java:122)聽
          at com.bumptech.glide.load.engine.EngineRunnable.decode(EngineRunnable.java:101)聽
          at com.bumptech.glide.load.engine.EngineRunnable.run(EngineRunnable.java:58)聽
          at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:422)聽
          at java.util.concurrent.FutureTask.run(FutureTask.java:237)聽
          at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1112)聽
          at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:587)聽
          at java.lang.Thread.run(Thread.java:841)聽
          at com.bumptech.glide.load.engine.executor.FifoPriorityThreadPoolExecutor$DefaultThreadFactory$1.run(FifoPriorityThreadPoolExecutor.java:118)聽
       Caused by: libcore.io.ErrnoException: getaddrinfo failed: EACCES (Permission denied)
          at libcore.io.Posix.getaddrinfo(Native Method)聽
          at libcore.io.ForwardingOs.getaddrinfo(ForwardingOs.java:61)聽
          at java.net.InetAddress.lookupHostByName(InetAddress.java:406)聽
          at java.net.InetAddress.getAllByNameImpl(InetAddress.java:236)聽
          at java.net.InetAddress.getAllByName(InetAddress.java:214)聽
          at com.android.okhttp.internal.Dns$1.getAllByName(Dns.java:28)聽
          at com.android.okhttp.internal.http.RouteSelector.resetNextInetSocketAddress(RouteSelector.java:216)聽
          at com.android.okhttp.internal.http.RouteSelector.next(RouteSelector.java:122)聽
          at com.android.okhttp.internal.http.HttpEngine.connect(HttpEngine.java:292)聽
          at com.android.okhttp.internal.http.HttpEngine.sendSocketRequest(HttpEngine.java:255)聽
          at com.android.okhttp.internal.http.HttpEngine.sendRequest(HttpEngine.java:206)聽
          at com.android.okhttp.internal.http.HttpURLConnectionImpl.execute(HttpURLConnectionImpl.java:355)聽
          at com.android.okhttp.internal.http.HttpURLConnectionImpl.connect(HttpURLConnectionImpl.java:89)聽
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadDataWithRedirects(HttpUrlFetcher.java:72)聽
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadData(HttpUrlFetcher.java:44)聽
          at com.bumptech.glide.load.data.HttpUrlFetcher.loadData(HttpUrlFetcher.java:20)聽
          at com.bumptech.glide.load.model.ImageVideoModelLoader$ImageVideoFetcher.loadData(ImageVideoModelLoader.java:70)聽
          at com.bumptech.glide.load.model.ImageVideoModelLoader$ImageVideoFetcher.loadData(ImageVideoModelLoader.java:53)聽
          at com.bumptech.glide.load.engine.DecodeJob.decodeSource(DecodeJob.java:170)聽
          at com.bumptech.glide.load.engine.DecodeJob.decodeFromSource(DecodeJob.java:128)聽
          at com.bumptech.glide.load.engine.EngineRunnable.decodeFromSource(EngineRunnable.java:122)聽
          at com.bumptech.glide.load.engine.EngineRunnable.decode(EngineRunnable.java:101)聽
          at com.bumptech.glide.load.engine.EngineRunnable.run(EngineRunnable.java:58)聽
          at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:422)聽
          at java.util.concurrent.FutureTask.run(FutureTask.java:237)聽
          at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1112)聽
          at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:587)聽
          at java.lang.Thread.run(Thread.java:841)聽
          at com.bumptech.glide.load.engine.executor.FifoPriorityThreadPoolExecutor$DefaultThreadFactory$1.run(FifoPriorityThreadPoolExecutor.java:118)聽
vilaspatil321 picture vilaspatil321 on 12 Apr 2016

I added below given lines in android manifest file:

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

Its working now. Thanks a lot for helping me out.

vilaspatil321 picture vilaspatil321 on 12 Apr 2016

ImageView yourimageview= (ImageView) findViewById(R.id.yourimageview);
GlideDrawableImageViewTarget yourimageViewTarget = new GlideDrawableImageViewTarget(yourimageview);
Glide.with(this).load(R.raw.sample_gif).into(yourimageViewTarget );

try using GlideDrawableImageViewTarget Class

UzmaFaruck picture UzmaFaruck on 17 Apr 2018

The code works well with uri address and with file in Resources. It is possible to display a saved gif in the memory of the device, not within the project.
Tank you.

El codigo funciona bien con direccion uri y con archivo en Resources. Es posible mostrar un gif guardado en la memoria del dispositivo, no dentro del proyecto.
Gracias

BaltasarA picture BaltasarA on 11 Nov 2018

@BaltasarA you can load a byte[] containing the raw image File contents.

TWiStErRob picture TWiStErRob on 12 Nov 2018

Thank you very much for your prompt response. I solved the problem with https://github.com/koral--/android-gif-drawable/blob/dev/README.md
Muchas gracias por tu pronta respuesta. He resuelto el problema con https://github.com/koral--/android-gif-drawable/blob/dev/README.md

BaltasarA picture BaltasarA on 12 Nov 2018
Was this page helpful?
0 / 5 - 0 ratings

Related issues

PatrickMA picture PatrickMA  路  3Comments
FooBarBacon picture FooBarBacon  路  3Comments
MrFuFuFu picture MrFuFuFu  路  3Comments
billy2271 picture billy2271  路  3Comments
Morteza-Rastgoo picture Morteza-Rastgoo  路  3Comments