How to display an animated GIF?

Question

I would like to display an animated GIF.

activity_main.xml

<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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:src="@drawable/mmouse" />
</RelativeLayout>

I want display the GIF and loop it.

http://android-er.blogspot.it/2014/03/play-animated-gif-with.html — IntelliJ Amiya, Jun 13 '15 at 08:16

score 0 · Answer 1 · edited May 23 '17 at 11:52

0

Currently Android did not support displaying gif format in ImageView. You can using WebView or android.graphics.Movie class.

Your can refer more in here

edited May 23 '17 at 11:52

Community

1
1

answered Jun 13 '15 at 04:38

ThaiPD

3,503
3
30
48

score 0 · Answer 2 · answered Jun 13 '15 at 09:16

You can use a custom WebView. This is how I do it,

First make a custom WebView view,

public class GifWebView extends WebView {

    public GifWebView(Context context) {
        super(context);
    }

    public GifWebView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public void setGifAssetPath(String pPath) {
        String baseUrl = pPath.substring(0, pPath.lastIndexOf("/") + 1);
        String fileName = pPath.substring(pPath.lastIndexOf("/")+1);
        StringBuilder strBuilder = new StringBuilder();
        strBuilder.append("<html><head><style type='text/css'>body{margin:auto auto;text-align:center;} img{width:100%;} </style>");
        strBuilder.append("</head><body>");
        strBuilder.append("<img src=\"" + fileName + "\" width=\"100%\" /></body></html>");
        String data = strBuilder.toString();
        Log.d(this.getClass().getName(), "data: " + data);
        Log.d(this.getClass().getName(), "base url: " + baseUrl);
        Log.d(this.getClass().getName(), "file name: " + fileName);
        loadDataWithBaseURL(baseUrl, data, "text/html", "utf-8", null);
    }
}

Then add it in your layout,

<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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

        <com.example.GifWebView
            android:id="@+id/gif_view"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:scrollbars="none"
            android:visibility="gone" />

</RelativeLayout>

Now to load a image,

gifView = (GifWebView) findViewById(R.id.gif_view);
gifView.setGifAssetPath(image_path);

How to display an animated GIF?

2 Answers2