[Android Studio] 이미지 로딩 라이브러리 Glide 사용하기

 

 

Glide 란 ?

• 2014년 구글에서 공개한 이미지 로딩 라이브러리
• 가장 성능이 좋은 이미지 로딩 라이브러리로 알려짐 (UIL, Picasso, Fresco 中)
• 썸네일 보기, GIF 로딩, 동영상 스틸 보기 기능까지 지원함
• 반복 스크롤 시 메모리를 많이 쓰는 만큼 빠른 속도와 안정성 보장
• 공식 Gihub 페이지 : https://github.com/bumptech/glide

GitHub - bumptech/glide: An image loading and caching library for Android focused on smooth scrolling

 

 

 

---

 

이미지 라이브러리 사용 이유

요약하면, 이미지 로딩을 구현할 때는 HTTP 통신을 안정되게 구현하고, 비트맵으로 디코딩하면서 메모리가 넘치거나 새지 않도록 주의해야 한다. 네트워크 호출과 디코딩은 단순히 백그라운드 스레드에서 동작하는 것만으로는 충분하지 않고 더 적극적으로 병렬성을 활용해야 한다. 화면 회전, 전환, 스크롤 때 반복적인 요청이 가지 않도록 이미지를 캐시하고, 불필요해진 요청은 빠른 시점에 취소해서 더 나은 UI 반응을 제공하면서 자원을 절약해야 한다. 이 과제들을 모두 해결하려다 보면 처리 흐름은 복잡해지고, 비슷한 코드가 반복되기 쉽다.
출처 : NAVER D2 블로그

 

따라서 여러 오픈 소스 이미지 로딩 라이브러리를 활용해

캐시, 동시 실행, 취소 등 을 간편하게 처리할 수 있도록 도와준다! 

 

 

 

---

 

Glide 사용하기

(1) Gradle 의존성 추가

dependencies {
  implementation 'com.github.bumptech.glide:glide:4.12.0'
  annotationProcessor 'com.github.bumptech.glide:compiler:4.12.0'
}

 

인터넷 통신으로 이미지 URL 을 받아온다면,

AndroidManifest.xml 파일에 인터넷 권한을 추가한다.

<uses-permission android:name="android.permission.INTERNET" />

 

 

(2) 이미지 띄울 ImageView 만들기

<ImageView
        android:id="@+id/playerImageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"/>

 

 

(3) Glide 사용하기

import com.bumptech.glide.Glide

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        Glide.with(this)
            .load("이미지 URL")
            .override(250,250)
            .into(findViewById(R.id.playerImageView))
    }
}

 

 

---

 

Glide 함수 종류

(1) load()

• 이미지 정보를 가진 객체를 파라미터로 받음
• Bitmap, Drawable, String, Uri, File, Raw 등

 

✨ GIF (움짤) 파일 업로드하기

1. Raw 폴더 생성
File -> New -> Android Resource Directory -> Resource type : raw 선택 후 생성

2. GIF 파일 해당 폴더에 저장

3. Glide 사용
load(R.raw.player)

 

(2) override(width, height)

• 지정한 이미지 크기만큼만 불러오기
• 이미지 로딩 속도 최적화할 수 있음

 

(3) placeholder()

• 이미지 로딩 중에 보여줄 이미지 지정하기
• ResourceId, Drawable 등

 

(4) error()

• 이미지 로딩 실패 시에 보여줄 이미지 지정하기

 

(5) thumbnail()

• 원본 이미지를 썸네일로 사용
• 지정한 % 비율만큼 미리 이미지 가져옴
• 0.1f 지정 시, 실제 이미지 크기 중 10%만 먼저 흐릿하게 보여줌

 

(6) asGif()

• GIF 이미지 URL 로딩 가능하도록 함

 

 

---

 

 

 [번외] Glide 이미지 변형은 어떻게 하나요 ?

💡 Gilde Transformation 라이브러리를 활용하자!

• 블러, 이미지 크롭, 필터 적용 등 다양한 이미지 변형 기능 제공
• 사용 방법은 아래 공식 홈페이지 참조

https://github.com/wasabeef/glide-transformations

GitHub - wasabeef/glide-transformations: An Android transformation library providing a variety of image transformations for Glid

 

 

 

 

© 참고

Glide 라이브러리 공식 홈페이지 https://github.com/bumptech/glide

Glide 라이브러리에 대한 자세한 설명 https://gun0912.tistory.com/17

Naver 개발 블로그 - Android의 이미지 로딩 라이브러리 https://d2.naver.com/helloworld/429368