이렇게 정사각형 모양으로 끼워넣고 싶을 때 !! 어떻게 할까요!?
머리가 나쁘면 몸이 고생한다고..
바보같은 저는 포토샵으로 사진을 하나하나 정사각형으로 자를 생각을 했습니다 ...
하지만 !! 저희에겐 XML 속성이 있습니다 한 번 코드를 살펴보도록 하겠습니다.
일단 그냥 넣으면 이렇게 문제가 생기는 상황 ...
💙xml 파일에 속성 추가 !
android:scaleType="centerCrop"
속성을 추가해주시면 됩니다 !
centerCrop속성은
이미지의 가로/세로의 길이 중 짧은 쪽을 ImageView의 레이아웃에 꽉 차게 크기를 맞춰서 출력해줍니다 !
크기가 정해진 ImageView에는 웬만하면 centerCrop을 쓰면 되겠죠?
💙문제 해결!
예쁘게 잘린 모습 ~ ♡ ٩(´▽`)۶ ♡
디자이너분들이 한땀한땀 디자인 하신 것들을 잘 활용하는 개발자가 됩시다!
💙ImageView의 scaleType속성
이렇게 마무리 하기 아쉬우니 scaleType 속성에 대해 알아보도록 하죠!
옵션값은 총 8개로 나눠집니다.
android:scaleType="center"-> 원본 이미지를 그대로 올리는 방법
- 이미지 원본 크기와 비율을 유지
- 이미지의 중앙을 layout_width, layout_height 안에 출력
- 이 때 layout보다 이미지가 크면 layout의 벗어난 이미지는 출력X
- layout보다 이미지가 작으면 이미지를 center 정렬합니다.
android:scaleType="centerCrop"
-> 본문에서 사용한 방법
- 이미지의 가로/세로의 길이 중 짧은 쪽을 ImageView의 layout에 꽉 차게 크기를 맞춰 출력
- 이 때 원본 이미지 가로/세로의 비율은 유지되고 layout 영역에서 벗어난 이미지는 출력X
android:scaleType="centerInside"- 이미지의 가로/세로의 길이 중 긴 쪽을 ImageView의 layout에 맞춰서 출력
- 원본 이미지의 가로/세로 비율은 유지
- layout에 이미지외 빈공간은 background 속성의 color로 채워짐
- fitCenter와 다른점은 원본 이미지가 ImageView의 layout보다 작다면, 이미지의 크기는 유지됨
(이미지가 뭉개지더라도 규격에 맞춤)
android:scaleType="fitCenter"- 이미지의 가로/세로의 길이 중 긴 쪽을 ImageView의 layout에 맞춰서 출력
- 원본 이미지의 가로/세로 비율은 유지
- layout에 이미지외 빈공간은 background 속성의 color로 채워짐
- centerInside와 다른점은 이미지의 크기가 ImageView의 레이아웃 크기에 따라 변함
android:scaleType="fitStart"- ImageView의 layout의 왼쪽 상단을 기준으로 정렬
- ImageView layout 안에서 이미지의 가로/세로 비율을 유지
android:scaleType="fitEnd"- ImageView layout 안에서 이미지의 가로/세로 비율을 유지하며 출력
- ImageView의 layout의 오른쪽 하단을 기준으로 정렬
android:scaleType="fitXY" - 가로/세로 비율에 상관없이 ImageView의 레이아웃의 각 면에 꽉 차게 출력
android:scaleType="matrix"- 이미지 원본의 크기와 비율을 유지하며 이미지 원본대로 왼쪽 상단을 기준으로 출력
- 이미지가 ImageView의 레이아웃 보다 크다면 나머지 이미지는 출력X
->이미지가 짤릴 가능성이 큼 위의 예제에서는 고윤정 사진의 왼쪽 모서리만 나와서 아예 고윤정의 고자도 안 보임
오늘은 ImageView의 scaleType 속성에 대해 알아봤숩니다 !! 다들 이미지 눌리지 않게 조심 !!!!
I'm coding bakhwee bug🪳