Показать анимированный GIF - PullRequest
       44

Показать анимированный GIF

245 голосов
/ 07 сентября 2010

Я хочу отображать анимированные GIF-изображения в моей заявке. Как я выяснил, сложный способ, которым Android не поддерживает анимированный GIF изначально.

Однако он может отображать анимацию, используя AnimationDrawable :

Разработка> Руководства> Изображения и графика> Обзор чертежей

В примере используется анимация, сохраненная в виде кадров в ресурсах приложения, но мне нужно для непосредственного отображения анимированного GIF.

Мой план состоит в том, чтобы разбить анимированный GIF на кадры и добавить каждый кадр как нарисованный в AnimationDrawable.

Кто-нибудь знает, как извлечь кадры из анимированного GIF и преобразовать каждый из них в Drawable ?

Ответы [ 29 ]

6 голосов
/ 15 мая 2014

Попробуйте, приведенный ниже код, отобразить gif-файл в строке прогресса

loading_activity.xml (в папке Layout)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ffffff" >

    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:indeterminate="true"
        android:indeterminateDrawable="@drawable/custom_loading"
        android:visibility="gone" />

</RelativeLayout>

custom_loading.xml (в папке для рисования)

здесь я помещаю black_gif.gif (в папку для рисования), вы можете поместить свой собственный gif здесь

<?xml version="1.0" encoding="utf-8"?>
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/black_gif"
    android:pivotX="50%"
    android:pivotY="50%" />

LoadingActivity.java (в папке res)

public class LoadingActivity extends Activity {

    ProgressBar bar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_loading);
        bar = (ProgressBar) findViewById(R.id.progressBar);
        bar.setVisibility(View.VISIBLE);

    }

}
5 голосов
/ 15 августа 2012

У меня был успех с предложенным решением в этой статье , классом под названием GifMovieView, который отображает View, который затем может быть отображен или добавлен к определенному ViewGroup. Ознакомьтесь с другими методами, представленными в частях 2 и 3 указанной статьи.

Единственным недостатком этого метода является то, что сглаживание в фильме не так уж хорошо (должно быть побочным эффектом от использования "теневого" класса Android Movie). Тогда вам лучше установить сплошной цвет фона в анимированном GIF-файле.

4 голосов
/ 03 апреля 2014

@ PointerNull дал хорошее решение, но оно не идеально.Он не работает на некоторых устройствах с большими файлами и показывает некорректную анимацию Gif с дельта-кадрами в предыдущей версии ICS.Я нашел решение без этих ошибок.Это библиотека с собственным декодированием для рисования: android-gif-drawable от koral .

4 голосов
/ 01 марта 2014

Некоторые мысли о примере BitmapDecode ... В основном он использует древний, но довольно безликий класс Movie из android.graphics.В последних версиях API вам необходимо отключить аппаратное ускорение , как описано здесь .В противном случае для меня это было ошибкой.

<activity
            android:hardwareAccelerated="false"
            android:name="foo.GifActivity"
            android:label="The state of computer animation 2014">
</activity>

Вот пример BitmapDecode, сокращенный только с частью GIF.Вы должны сделать свой собственный виджет (вид) и нарисовать его самостоятельно.Не такой мощный, как ImageView.

import android.app.Activity;
import android.content.Context;
import android.graphics.*;
import android.os.*;
import android.view.View;

public class GifActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(new GifView(this));
    }

    static class GifView extends View {
        Movie movie;

        GifView(Context context) {
            super(context);
            movie = Movie.decodeStream(
                    context.getResources().openRawResource(
                            R.drawable.some_gif));
        }
        @Override
        protected void onDraw(Canvas canvas) {   
            if (movie != null) {
                movie.setTime(
                    (int) SystemClock.uptimeMillis() % movie.duration());
                movie.draw(canvas, 0, 0);
                invalidate();
            }
        }
    }
}

2 других метода, один с ImageView, другой с WebView можно найти в этом прекрасном учебнике .Метод ImageView использует лицензированный Apache android-gifview от Google Code.

4 голосов
/ 25 февраля 2018

Скольжение 4.6

1.Загрузить gif

GlideApp.with(context)
            .load(R.raw.gif) // or url
            .into(imageview);

2.Чтобы получить файл объекта

GlideApp.with(context)
                .asGif()
                .load(R.raw.gif) //or url
                .into(new SimpleTarget<GifDrawable>() {
                    @Override
                    public void onResourceReady(@NonNull GifDrawable resource, @Nullable Transition<? super GifDrawable> transition) {

                        resource.start();
                      //resource.setLoopCount(1);
                        imageView.setImageDrawable(resource);
                    }
                });
2 голосов
/ 23 августа 2013

Поместите его в WebView, он должен иметь возможность корректно отображать его, поскольку браузер по умолчанию поддерживает файлы GIF. (Froyo +, если я не ошибаюсь)

2 голосов
/ 08 августа 2018

Только для Android API (Android Pie) 28 и +

используйте AnimatedImageDrawable как
// ImageView from layout
val ima : ImageView = findViewById(R.id.img_gif)
// create AnimatedDrawable 
val decodedAnimation = ImageDecoder.decodeDrawable(
        // create ImageDecoder.Source object
        ImageDecoder.createSource(resources, R.drawable.tenor))
// set the drawble as image source of ImageView
ima.setImageDrawable(decodedAnimation)
// play the animation
(decodedAnimation as? AnimatedImageDrawable)?.start()

XML-код, добавьте ImageView

<ImageView
    android:id="@+id/img_gif"
    android:background="@drawable/ic_launcher_background" <!--Default background-->
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    android:layout_width="200dp"
    android:layout_height="200dp" />

AnimatedImageDrawable является потомком Drawable и создан ImageDecoder.decodeDrawable

ImageDecoder.decodeDrawable, что дополнительно потребовало экземпляра ImageDecoder.Source, созданного ImageDecoder.createSource.

ImageDecoder.createSourceможет принимать источник только как имя, ByteBuffer, File, resourceId, URI, ContentResolver для создания исходного объекта и использует его для создания AnimatedImageDrawable как Drawable (полиморфный вызов)

static ImageDecoder.Source  createSource(AssetManager assets, String fileName)
static ImageDecoder.Source  createSource(ByteBuffer buffer)
static ImageDecoder.Source  createSource(File file)
static ImageDecoder.Source  createSource(Resources res, int resId)
static ImageDecoder.Source  createSource(ContentResolver cr, Uri uri)

Примечание: Вы можететакже создайте Bitmap, используя ImageDecoder # decodeBitmap .

Вывод:

image

AnimatedDrawable также поддерживает изменение размера, управление кадрами и цветом

2 голосов
/ 19 января 2018

Существует два варианта загрузки анимированных GIF-файлов в наши приложения для Android

1) Использование Glide для загрузки изображения в ImageView.

    String urlGif = "https://cdn.dribbble.com/users/263558/screenshots/1337078/dvsd.gif";
    //add Glide implementation into the build.gradle file.
    ImageView imageView = (ImageView)findViewById(R.id.imageView);
    Uri uri = Uri.parse(urlGif);
    Glide.with(getApplicationContext()).load(uri).into(imageView);

2) Использование HTML для загрузки GIF-файла в WebView

Создать HTML-файл с адресом .gif файла:

<html style="margin: 0;">
<body style="margin: 0;">
<img src="https://..../myimage.gif" style="width: 100%; height: 100%" />
</body>
</html>

сохраните этот файл в каталоге ресурсов:

enter image description here

Загрузите этот html в WebView вашего приложения:

    WebView webView =  (WebView)findViewById(R.id.webView);
    webView = (WebView) findViewById(R.id.webView);
    webView.loadUrl("file:///android_asset/html/webpage_gif.html");

Вот полный пример этих двух вариантов .

enter image description here

1 голос
/ 08 июня 2016

Используйте фреску.Вот как это сделать:

http://frescolib.org/docs/animations.html

Вот репо с примером:

https://github.com/facebook/fresco/tree/master/samples/animation

Осторожно, фреска неподдержка переноса контента!

1 голос
/ 29 марта 2016

Я думаю, что лучшей библиотекой для обработки файлов gif является эта: koral

Использовал ее, и я добился успеха, и эта библиотека предназначена для GIF'S;но где Пикассо и Глайд являются универсальным каркасом изображения;так что я думаю, что разработчики этой библиотеки полностью сконцентрировались на gif-файлах

...