유용한 이미지 라이브러리 - Glide (1)
Android app 개발 시 가장 많은 UI 를 차지하는 것이 이미지를 로딩하여 화면에 보여주는 것이다.
쉽게 생각하면 drawable resouce 나 image path 를 얻어와 bitmap 으로 ImageView 에 보여주면 그만이다.
하지만, 이미지 URL 을 로드해야 한다거나 아주 큰 size 의 image 여러 개를 보여줘야 한다면
하단과 같이 고려해야 할 사항이 너무 많이 생겨 버린다.
(실패처리, 디코딩, 이미지 재활용, OOM, 캐시 및 병렬 처리)
Glide, Picasso, Fresco 등 이런 여러 가지 고민을 해결해 놓은 유용한 이미지 라이브러리들이 많이 있다.
이번 포스팅에서는 이중에서도 Glide 에 대해 알아보자.
Glide?
Google에서 개발해서 밀고 있던 volly 이후에 2014 년에 공개된 이미지 라이브러리.
기존의 Bump 앱이 만들어 사용하던 라이브러리였는데 구글이 Bump 앱을 인수하여 라이브러리를 공개.
이미지를 빠르고 효율적으로 불러올 수 있게 도와주며 사용자가 이용하기 쉽게 만든 라이브러리.
https://github.com/bumptech/glide
Dependency 추가
하단과 같이 app gradle file 에 추가한다.
이미지 로딩
Glide 는 빌더 패턴으로 구형되어 있고, 3 개의 필수 파라미터를 요구한다.
- with() : Context
- load() : 대상 이미지 (URL, Resouce ID, File URI ......)
- into() : 이미지를 보여줄 ImageView
이미지 리사이징
Glide 는 기본적으로 ImageView 의 크기에 맞게 이미지가 다운로드 되고 캐싱된다.
명시적으로 이미지 크기를 변경하려면 override 함수를 사용하면 된다.
◼ Original
◼ Override
이미지 변형
Glide 로 받아온 이미지를 하단과 같은 3 가지 변형 타입으로 변환해 준다.
(커스터마이징도 가능하지만 본문에서는 3 가지의 내장된 변형 타입만 다룬다.)
◼ Original
◼ CenterCrop
이미지가 ImageView 의 사이즈보다 클 때, Imageview 의 크기에 맞춰 이미지 크기를 조정 후 자른다.
ImageView 가 완전히 채워지지만 전체 이미지가 표시되지 않을 수 있다.

◼ FitCenter
이미지가 ImageView 의 사이즈와 다를 때, ImageView 크기와 같거나 작도록 이미지의 크기를 조정한다.
이미지가 완전히 표시되지만 전체 ImageView 를 채우지 않을 수 있다.

◼ CircleCrop
이미지가 원으로 변경된다.
Glide hompage 에서는 FitCenter 와 동일한 방식이라고 되어 있지만 CenterCrop 과 동일한 방식으로 보인다.
