이미지 가로세로 비율 유지하기 adjustBounds

이미지 가로세로 비율 유지

문제 상황

Glide를 사용하여 ImageView에 해당 url을 넣어주었는데, 이미지뷰 크기가 url에 해당하는 실제 이미지크기보다 크게 설정되는 상황.

프로젝트를 작업중에 이미지 가로세로 비율을 유지해야하는 경우가 많은데요.

저의 경우에는 최근에 '전면광고' 화면에서 해당 이미지의 가로세로 비율을 유지해야하는 것이 중요한 포인트였습니다.

해당 이미지가 들어가게 될 ImageView xml 코드입니다.

ImageView의 background를 준 이유는 여백을 확인해보기 위함이었습니다.

서버 통신으로 받아온 url을 glide를 사용하여 위 이미지뷰에 넣어주었는데요,

( 사전 동의를 구하고 업로드하는 저희 프로젝트 개발서버 테스트 화면입니다. )

이미지뷰의 background로 주었던 색이 보이게 되는데요,

이로써 이미지뷰의 높이가 실제 이미지보다 더 크게 잡혀있는 것을 확인해보실 수 있습니다.

그리고 '건너뛰기' 의 xml 코드상으로 constraintLayout을 사용하여 이미지뷰의 하단 오른쪽에 위치하게 해주었는데, 이 상황에서는 실제 이미지보다 더 크게잡혀있어서 해당 '건너뛰기' 버튼의 위치도 이상했습니다.

처음에 해결방법으로 생각했던 방법은, Glide의 onResourceReady 함수에서 해당 이미지의 가로와 세로길이를 구하고, ratio를 구해서 imageView의 크기를 설정해주는 것이었습니다.

하지만 초기에 이미 resize 작업을 거친 뒤에 glide를 통해 이미지를 이미지뷰에 넣어주는 작업을 했기 때문에 효율적이지 못하다고 생각했습니다.

그래서 다시 ImageView 속성으로 초점을 돌렸습니다.

역시 ImageView에 위와 같은 문제상황을 단번에 해결할만한 기능이 있었습니다.

해결방법

바로 ImageView의 adjustBounds 속성 입니다.

https://developer.android.com/reference/android/widget/ImageView

위 링크에서 설명하고 있듯이, adjustBounds는 이미지의 가로세로 ratio를 유지하기 위한 옵션입니다. adjustBounds에 true 값을 주니 이미지의 가로세로 비율이 유지되면서,

이미지뷰가 실제 이미지의 크기만큼만 높이를 갖게 되었습니다.

정말 간단하게 해결할 수 있는 문제였지만, 다시한번 ImageView 속성값들에 대해 공부할 수 있었던 계기가 되었습니다.

아래 링크는 구글 플레이스토어에 있는 제가 개발하고 있는 android wenwo app 다운로드링크입니다.

https://play.google.com/store/apps/details?id=com.likealocal.wenwo.dev.wenwo_android

피드백주시면서, 서로 소통할 수 있었으면 좋겠습니다.