How To Play Gif File Use Android.Graphics.Movie Class

If you want to display a gif image in your android application, you can read this article. It will demonstrate how to use android.graphics.Movie class to read from a gif drawable resource and display it in a custom view canvas.

1. Play Gif Use Android.Graphics.Movie Example.

If you can not watch the above video, you can see it on the youtube URL https://youtu.be/ticI1yYAIG4

  1. There are two buttons in this example, click the first button will show the first gif image, click the second will show another.

2. Use Android Graphics Movie Class To Display Gif Source Code.

  1. Below is this example project source files list.
    C:\WORKSPACE\WORK\DEV2QA.COM-EXAMPLE-CODE\ANDROIDEXAMPLEPROJECT\MOVIEPLAYGIF
    │   .gitignore
    │   build.gradle
    │   gradle.properties
    │   gradlew
    │   gradlew.bat
    │   settings.gradle
    │
    ├───.idea
    │       gradle.xml
    │       misc.xml
    │       modules.xml
    │       runConfigurations.xml
    │
    ├───app
    │   │   .gitignore
    │   │   build.gradle
    │   │   proguard-rules.pro
    │   │
    │   └───src
    │       ├───androidTest
    │       │   └───java
    │       │       └───com
    │       │           └───dev2qa
    │       │               └───movieplaygif
    │       │                       ExampleInstrumentedTest.java
    │       │
    │       ├───main
    │       │   │   AndroidManifest.xml
    │       │   │
    │       │   ├───java
    │       │   │   └───com
    │       │   │       └───dev2qa
    │       │   │           └───movieplaygif
    │       │   │                   MainActivity.java
    │       │   │                   ShowGifView.java
    │       │   │
    │       │   └───res
    │       │       ├───drawable
    │       │       │       gif_one.gif
    │       │       │       gif_two.gif
    │       │       │       ic_launcher_background.xml
    │       │       │
    │       │       ├───drawable-v24
    │       │       │       ic_launcher_foreground.xml
    │       │       │
    │       │       ├───layout
    │       │       │       activity_main.xml
    │       │       │
    │       │       ├───mipmap-anydpi-v26
    │       │       │       ic_launcher.xml
    │       │       │       ic_launcher_round.xml
    │       │       │
    │       │       ├───mipmap-hdpi
    │       │       │       ic_launcher.png
    │       │       │       ic_launcher_round.png
    │       │       │
    │       │       ├───mipmap-mdpi
    │       │       │       ic_launcher.png
    │       │       │       ic_launcher_round.png
    │       │       │
    │       │       ├───mipmap-xhdpi
    │       │       │       ic_launcher.png
    │       │       │       ic_launcher_round.png
    │       │       │
    │       │       ├───mipmap-xxhdpi
    │       │       │       ic_launcher.png
    │       │       │       ic_launcher_round.png
    │       │       │
    │       │       ├───mipmap-xxxhdpi
    │       │       │       ic_launcher.png
    │       │       │       ic_launcher_round.png
    │       │       │
    │       │       └───values
    │       │               colors.xml
    │       │               strings.xml
    │       │               styles.xml
    │       │
    │       └───test
    │           └───java
    │               └───com
    │                   └───dev2qa
    │                       └───movieplaygif
    │                               ExampleUnitTest.java
    │
    └───gradle
        └───wrapper
                gradle-wrapper.jar
                gradle-wrapper.properties
  2. First, you should get two gif images ( gif_one.gif and gif_two.gif ) and copy them into your android project app/res/drawable folder.

2.1 Main Activity Class.

  1. MainActivity.java
    package com.dev2qa.movieplaygif;
    
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.Button;
    import android.widget.LinearLayout;
    
    public class MainActivity extends AppCompatActivity {
    
        private Button showGifOneButton = null;
    
        private Button showGifTwoButton = null;
    
        private LinearLayout gifLinearLayout = null;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            setTitle("dev2qa.com - Android Show Gif Use Movie Example.");
    
            initControls();
    
            final ShowGifView showGifView = new ShowGifView(getApplicationContext());
            gifLinearLayout.addView(showGifView);
    
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    
            showGifView.setLayoutParams(layoutParams);
    
            showGifOneButton.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    showGifView.setGifImageDrawableId(R.drawable.gif_one);
                    showGifView.drawGif();
                }
            });
    
            showGifTwoButton.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    showGifView.setGifImageDrawableId(R.drawable.gif_two);
                    showGifView.drawGif();
                }
            });
    
        }
    
        private void initControls()
        {
            if(showGifOneButton == null)
            {
                showGifOneButton = (Button)findViewById(R.id.showGifOne);
            }
    
            if(showGifTwoButton == null)
            {
                showGifTwoButton = (Button)findViewById(R.id.showGifTwo);
            }
    
            if(gifLinearLayout == null)
            {
                gifLinearLayout = (LinearLayout) findViewById(R.id.gifLinearLayout);
            }
        }
    }

2.2 Custom View Class.

  1. ShowGifView.java
    package com.dev2qa.movieplaygif;
    
    import android.content.Context;
    import android.content.res.Resources;
    import android.graphics.Canvas;
    import android.graphics.Movie;
    import android.view.View;
    
    import java.io.InputStream;
    
    public class ShowGifView extends View {
    
        private InputStream inputStream;
    
        private Movie movie;
    
        private int gifImageDrawableId;
    
        private Context ctx = null;
    
        private long gifStart = 0;
    
        public ShowGifView(Context context) {
            super(context);
    
            // Make the custom view focus.
            setFocusable(true);
    
            ctx = context;
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            long now = System.currentTimeMillis();
    
            if (gifStart == 0) {
                gifStart = now;
            }
    
            if (movie != null) {
                // Get gif movie duration time.
                int duration = movie.duration();
    
                if (duration == 0) {
                    duration = 1000;
                }
                
                // Get played frame percentage. 
                int relTime = (int)((now - gifStart) % duration);
    
                // Set current gif frame time.
                movie.setTime(relTime);
    
                // Get custom view width and height.
                int width = this.getWidth();
                int height = this.getHeight();
    
                // Get gif image width and height.
                int movieWidth = movie.width();
                int movieHeight = movie.height();
    
                // Scale canvas size to fit the custom view.
                canvas.scale(width / movieWidth, height / movieHeight);
    
                // Draw the gif image frame to custom view canvas. 
                movie.draw(canvas, 1, 1);
    
                // This method will invoke onDraw method.
                invalidate();
            }
        }
    
        public int getGifImageDrawableId() {
            return gifImageDrawableId;
        }
    
        public void setGifImageDrawableId(int gifImageDrawableId) {
            this.gifImageDrawableId = gifImageDrawableId;
        }
    
        // Call this method to read the drawable gif image to create movie object.
        public void drawGif()
        {
            Resources resources = ctx.getResources();
    
            inputStream = resources.openRawResource(gifImageDrawableId);
    
            movie = Movie.decodeStream(inputStream);
    
            // Invalidate the view and invoke onDraw method.
            invalidate();
        }
    }

2.3 Main Activity Layout Xml File.

  1. app / res / layout / activity_main.xml
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    
        <Button
            android:id="@+id/showGifOne"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Show Gif One"
            android:textAllCaps="false"
            android:textSize="20dp"/>
    
        <Button
            android:id="@+id/showGifTwo"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Show Gif Two"
            android:textAllCaps="false"
            android:textSize="20dp"/>
    
        <LinearLayout
            android:id="@+id/gifLinearLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
    
        </LinearLayout>
    </LinearLayout>

Reference

  1. Android Move Text With Arrow Key Example
0 0 votes
Article Rating
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x