Show GIFS animations Images (kotlin and java)

Hello viewer, You can now have our Tutorial Lessons in your android mobile device and read it offline.
Download kotlin Programming APP on PlayStore
Download Website SEO Lessons APP on PlayStore

Show GIFS animations Images (kotlin and java) - Show GIFS animations Images (kotlin and java) - Show GIFS animations Images (kotlin and java) - Show GIFS animations Images (kotlin and java)
Show GIFS animations Images (kotlin and java)

Today we will try to display GIF animations. And we will do this thanks to the Glide library

What is Glide?

To make it short, Glide is a library that allows you to display images like Picasso . But I would say that one of its strengths is that you can display  gif  unlike Picasso.

How to integration Glide Libary

  1. In Android studio, create a new project by going to  File-> New-> New Project                                       
  2. In  Application name  put “GlideExample” and  Company domain “com.coding180.glideexamplegif”
  3. In your build.gradle file copy the following code and synchronize
    compile ' com.github.bumptech.glide: glide: 3.6.0 '
  4. Add INTERNET  permission to your AndroidManifest.xml  file
</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>

Show GIFS animations Images (kotlin and java)

5. Create an activity_main.xml file in  layouts  and copy the following code

<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. Create a MainActivity  class (Java)

Show GIFS animations Images (kotlin and java)

package com.coding180.glidegifimage;

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);
    }

}

6b. Or Create a MainActivity  class (Kotlin)

Show GIFS animations Images (kotlin and java)

package com.coding180.glidegifimage

import android.os.Bundle
import android.support.v7.app.ActionBarActivity
import android.widget.ImageView

import com.bumptech.glide.Glide

class MainActivity : ActionBarActivity() {

    private var image1: ImageView? = null
    private var image2: ImageView? = null
    private var image3: ImageView? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        image1 = findViewById(R.id.imageView1) as ImageView
        image2 = findViewById(R.id.imageView2) as ImageView
        image3 = findViewById(R.id.imageView3) as ImageView

        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!!)
    }

}

Show GIFS animations Images (kotlin and java)

Download source code below.

About The Author

Related posts

Leave a Reply