glide를 사용하여 GIF 로딩 화면 구현하기

glide를 사용하여 로딩화면에 .GIF 확장자 파일이 나타나는 예제를 구현해보자.

앞에 포스팅한 로딩화면 구현하기보다 간단하고 편하다.

- 이전 포스팅

https://taek2.tistory.com/19?category=901018 

 

 

라이브러리 설치

- build.gradle (Module:~~)

: dependecies 안에 작성

...

implementation('com.github.bumptech.glide:glide:4.12.0')
annotationProcessor('com.github.bumptech.glide:compiler:4.12.0')

 

 

 

레이아웃 구현

- popup_loading.xml (생성)

: 이미지뷰의 가로와 세로는 gif 파일의 크기에 맞춰서 알아서 조정하기 (딱 맞게 조절이 안되던데 하는방법 알려주실분...)

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/img_gif"
        android:layout_width="120dp"
        android:layout_height="91dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

- activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/btn_loading"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="load"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

 

 

AndroidManifest 와 gif 파일 저장

- AndroidManifest.xml

: 액티비티를 popup으로 띄우기

<application
	...

	<activity
		android:name=".LoadingPopup"
		android:theme="@android:style/Theme.DeviceDefault.Light.Dialog.NoActionBar" />
</application>

 

- res > raw > loading.gif 파일 저장

: res디렉터리 안에 raw 디렉터리 생성 후 로딩화면에 나타낼 .gif 파일 넣기

 

액티비티 구현

- LoadingPopup.java

package com.example.example_loading_gif;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;

import androidx.annotation.Nullable;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;

public class LoadingPopup extends Activity {

    private ImageView img_gif;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.popup_loading);

        this.initialSet();

        Glide.with(this)
                .asGif()
                .load(R.raw.loading)
                .diskCacheStrategy(DiskCacheStrategy.RESOURCE) 
                .into(img_gif);

    }

    public void initialSet() {
        img_gif = (ImageView) findViewById(R.id.img_gif);
    }

    @Override
    public void onBackPressed() {
        super.onBackPressed();
        finish();
    }
}

 

 

- MainActivity.java

package com.example.example_loading_gif;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

    private Button button;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        button = (Button) findViewById(R.id.btn_loading);

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent intent = new Intent(getApplicationContext(), LoadingPopup.class);
                startActivity(intent);
            }
        });

    }
}

 

 

 

 

 

끝