[Android] 이미지에 색상(tint)을 적용하는 방법

어떤 이미지의 색상을 변경해서 여러가지로 사용하고 싶을 때,

직접 각각의 색상들로 변경해서 여러 개의 drawable 파일로 만들 수도 있지만,

이는 매우 번거롭고, 변경사항에 유연하지 못하다.

 

따라서 tint라는 것을 사용해 여러 색상을 덧씌울 수 있는데, 이에 대해 알아보자.

 

xml에서 tint 적용하기

<ImageView
  android:id="@+id/listViewMode"
  style="@style/icon"
  android:layout_width="36dp"
  android:layout_height="36dp"
  android:src="@drawable/ic_baseline_checklist_rtl_24"
  android:tint="@color/black" />

 

android:tint로 적용할 수 있다.

요즘은 app:tint로 변경하라는 문구가 뜨는데, 아직은 둘 중 뭘로 해도 빌드는 잘 된다.

 

주의할 점은 이 방법으로는 벡터 이미지만 가능하다는 것이다.

 

Java/Kotlin에서 tint적용하기

 

벡터 이미지와 비트맵 이미지에 색상을 입하는 방법이 다르다.

 

먼저 벡터 이미지에 색상을 덧씌워보자.

 

imageView.setColorFilter(resources.getColor(R.color.light_gray))

이런 식으로 setColorFilter를 이용해 틴트를 사용할 수 있다.

 

여기서 주의할 점은, resources.getColor를 통하지 않고, R.color로 직접 접근해 컬러값을 사용해도 

IDE에는 오류가 표시되지 않는데, 실제 결과에는 전혀 이상한 값이 나오게 된다.

 

imageView.setColorFilter(R.color.light_gray)

분명 틴트로 회색을 사용했는데 연보라색 계열의 색이 적용된다.

 

자세한 이유는 알 수 없지만, 위 color코드값이 우연히 보라색 계열의 다른 색상코드값과 일치하게 되어,

전혀 의도하지 않은 컬러값이 덧씌워진 것으로 예상된다.

 

따라서 반드시 resource의 getColor를 이용해 컬러값을 적용해야 한다.

 

Java/Kotlin에서 tint적용하기: Bitmap

public static Drawable getTintedDrawable(@NonNull final Context context,
                                         @DrawableRes int drawableRes, @ColorRes int colorRes) {
    Drawable d = ContextCompat.getDrawable(context, drawableRes);
    d = DrawableCompat.wrap(d);
    DrawableCompat.setTint(d.mutate(), ContextCompat.getColor(context, colorRes));
    return d;
}

비트맵 이미지는 drawable을 추출해서 틴트를 적용한 후,

새로운 Drawable을 만들어내는 방법을 사용해야만 한다.

Drawable drawable= getResources().getDrawable(R.drawable.my_drawable);
int colorRes= getResources().getColor(R.color.black);
imageView.setDrawable(getTinetedDrawable(getContext(), drawable, colorRes));