코틀린 버튼 이미지 변경 - koteullin beoteun imiji byeongyeong

이번 글에서는 안드로이드의 기본 위젯인 ImageView와 ImageButton에 대해 알아보겠습니다.

ImageView

이미지 뷰는 사용자에게 이미지를 보여줄 때 사용하는 위젯입니다.

기능은 이름에서 알 수 있듯이 이미지를 표시합니다.

예시 코드는 아래와 같습니다.

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="//schemas.android.com/apk/res/android" xmlns:app="//schemas.android.com/apk/res-auto" xmlns:tools="//schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:gravity="center_vertical" tools:context=".MainActivity"> <ImageView android:layout_width="100dp" android:layout_height="100dp" android:layout_gravity="center" android:scaleType="matrix" android:src="@drawable/mountain"/> </LinearLayout>

scaleType의 속성은 이미지뷰 크기를 고정했을 때 , 이미지 크기에 따라 이미지가 잘리거나, 작게 표시될 수 있는데, 이 경우 사용하는 옵션이다.

scaleType의 옵션은 아래와 같습니다.

속성	내용	이미지
matrix	원본 크기 그대로, 왼쪽 상단 정렬
center	원본 크기 그대로, 가운데 정렬
centerCrop	이미지뷰 비율에 채워서 보여줌
centerInside	이미지가 이미지뷰를 벗어나면 비율에 맞춰 보여줌
fitXY	비율 유지하지 않고 뷰에 딱 맞춰 보여줌
fitStart	이미지뷰크기에 맞게, 왼쪽 상단 정렬
fitCenter	이미지뷰크기에 맞게, 가운데 정렬
fitEnd	이미지뷰크기에 맞게, 왼쪽 하단 정렬

ImageButton

마지막 위젯으로 이미지버튼에 대해 알아보겠습니다.

이미지버튼은 이미지뷰를 상속받아 만들어졌습니다. 위 소스 코드에서 ImageView를 ImageButton으로 바꾸기만 하면 버튼처럼 사용 가능합니다.

코드는 아래와 같습니다.

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="//schemas.android.com/apk/res/android" xmlns:app="//schemas.android.com/apk/res-auto" xmlns:tools="//schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:gravity="center_vertical" tools:context=".MainActivity"> <ImageButton android:layout_width="100dp" android:layout_height="100dp" android:layout_gravity="center" android:scaleType="fitXY" android:src="@drawable/mountain"/> </LinearLayout>

실행하면 아래와 같이 사용할 수 있습니다.

이상으로 기본 위젯들에 대해 알아봤습니다.