Android 에서 원형, 사각형 이미지 로딩할 때는 Glide
네트워크로 이미지 받아올 때, 어떻게 하세요?
저는 구글이 인수한 BumpTech의 Glide를
쓰는데요. 사용하기도 매우 편리하구요.
속도도 상대적으로 여타 이미지라이브러리보다 빠르다고 합니다.
오늘은 이 Glide를 정리해 보겠습니다.
1. 라이브러리 설정
항상 시작은 라이브러리 디펜던시 설정부터죠.
glide검색해서 bumptech에서 만든 글라이드 선택해주고 가겠습니다~.
혹은 직접 build.gradle에 compile 'com.github.bumptech.glide:glide:3.7.0'을 직접 넣어주셔도 됩니다~.
2. 먼저 xml부터 준비하기
Java파일에서 Glide로딩해서 쓰기전에,
xml로 레이아웃부터 준비해놓고 갈께요.
상단에 버튼이 있고, 그 밑에 이미지가 로딩되서 보이도록 하겠습니다.
3. Java파일에서 이미지로드
버튼 클릭하면 Glide가 이미지를 로딩하는 코드이구요.
Glide사용법은 너무나도 간단합니다.
>> Glide.with(Context).load(url).into(imageView)
요 한줄이면 이미지 로딩되는데요.
with에 컨텍스트, load에 URL, into에 로딩할 이미지뷰를 넣어주면 됩니다.
나머지는 부가적인데,
centerCrop()은 말 그대로 이미지가 center로 와서 크롭되도록 하는 것이구요.
crossFade()는 이미지가 로딩될 때 페이드효과가 나도록 하는 것입니다.
Glide가 업데이트 되면서 사용방법이 조금 바뀌었습니다.
.apply(new RequestOptions().centerCrop())
.transition(new DrawableTransitionOptions().crossFade())
이와같이 추가해야 centerCrop이나 crossFade옵션을 사용할 수 있습니다.
업데이트 합니다.
기존Glide에서는 위의 이미지와 같이 사용하였으나,
버전업된 Gilde에서는 아래와 같이 사용해야 합니다.
4-1. Circle형 이미지로 출력위한 준비사항
wasabeef라고 검색해서 나오는 것중 glide-transformations를 선택하시면 됩니다.
그런데 , 이번에는 build.gradle에서 compile 'jp.wasabeef:glide-transformations:2.0.1' 을 직접 넣어주시는 게 좋습니다.
더 최신버전을 사용할 수 있기때문인데요. 몇몇 라이브러리는 이런경우가 있더라구요.
dependecies검색에서는 아직 1.0.6이군요.
4-2. Java파일 수정
원래썻던 코드에
.bitmapTransform(new CropCircleTransformation(Context))
이렇게만 추가해주시면 원형형태로 이미지가 로딩됩니다.
추가적으로 제가 쓴 override라는 것은
리소스의 이미지를 강제적으로 작게 줄여서 보여주려고 할때 사용합니다.
이렇게 하면 아래와 같은 결과물을 볼 수 있습니다.
여러가지 장점이 있는 Glide지만, 한가지 단점이 있습니다.
아직은 vector로 된 resource를 로딩할 수 없다는 점 인데요.
이 점은 추후에 개선되면 좋겠네요.
개선되는데로 블로그 글을 업데이트 하도록 하겠습니다.