박상권의 삽질블로그

[안드로이드/Android]유용한 라이브러리 - Glide-Transformations(이미지 변형) 본문

IT/Android-TIP (한글)

[안드로이드/Android]유용한 라이브러리 - Glide-Transformations(이미지 변형)

박상권 2015. 10. 16. 09:57

안드로이드 개발자들이 모여있는 오픈채팅방에 참여해보세요 .
Q&A 및 팁을 공유하는 방입니다..
오픈채팅방 참여


블로그를 Medium으로 옮겨서 운영하고 있습니다.
앞으로 새로운 글은 모두 미디엄 블로그를 통해서 올릴 예정입니다.
미디엄에서 다양하고 유익한 포스팅을 살펴보세요
미디엄 블로그 보기


이번에 '클린 아키텍처'를 주제로 온라인 강의를 개설하게 되었습니다 🎉
평소 오픈채팅방이나 여러 커뮤니티에서 '클린 아키텍처'와 관련된 질문들이 많았는데요. 이를 해결해줄 수 있는 마땅한 강의가 없었던것 같습니다.
평소 '클린 아키텍처' 에 대한 궁금증이나 관심이 있으셨던 분들이 수강해보시면 도움이 될것 같아요
강의 살펴보기





우리는 이미지를 사용하면서 여러종류로 이미지를 변형하고 싶을때가 있습니다.

- SNS에서 자주이용되는 원형의 프로필이미지

- 색깔을 넣은 컬러 필터 이미지

- 정사각형 모양의 이미지

- 블러로 느낌있는 배경의 이미지

- 등등등




제가 개발해서 운영중인 [셀폰]이라는 앱에도 여러가지형태로 이미지를 변형해서 쓰고있는데요.

그중에서 내 프로필화면에서 쓰인부분을 예시로 보여드리겠습니다.


프로필이미지를 Circle로 만들어주었고

해당 프로필이미지를 블러로 처리하여 배경화면으로 만들어주는 작업을 해주고 있습니다.







이러한것처럼 우리는 여러가지 방법으로 이미지를 변형할 수 있겠지만 이미지로딩 라이브러리를 사용하고 계신다면 해당 라이브러리에서 제공해주는 기능을 이용하면 좋습니다.

물론 해당 각 이미지로딩 라이브러리에 맞는 Transformation 라이브러리도 존재합니다.






Transform 적용 예시











이 라이브러리는 Glide 이미지로딩 라이브러리를 사용하고계신분들에게 유용한 Transformation 라이브러리입니다.

[안드로이드]유용한 라이브러리 - Glide (이미지 로딩 라이브러리)






Picasoo나 Fresco 이미지로딩 라이브러리를 사용하신다면 아래 링크를 통해 Transformation을 이용하실 수 있습니다.

Picasso Transformations

Fresco Processors











Glide Transformations


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




1. gradle 추가


compile 'jp.wasabeef:glide-transformations:1.0.6@aar'






2. bitmapTransform()함수에 transformation 클래스 추가



Glide.with(this).load(R.drawable.ic_selphone)
.bitmapTransform(new CropCircleTransformation(context))
.into(iv_selphone);


끝!

어때요? 참 쉽죠?






bitmapTransform()함수에는 파라미터로 1개의 transformation클래스만이 아니라 여러개의 클래스도 추가해줄수 있습니다.


Glide.with(this).load(R.drawable.ic_selphone)
.bitmapTransform(new BlurTransformation(context, 25, 2), new CropCircleTransformation(context))
.into(iv_selphone);










Transformation 라이브러리에서는 아래와같은 다양한 transformation을 제공합니다.



Crop

CropTransformation, CropCircleTransformation, CropSquareTransformation, RoundedCornersTransformation


Color

ColorFilterTransformation, GrayscaleTransformation


Blur

BlurTransformation


Mask

MaskTransformation


그외 GPUImage를 이용한 GPU Filter도 사용할 수 있습니다.





Comments