Jetpack Compose Icon 이미지 검은색 문제

 

icon 벡터 이미지가 필요하기에 추가해 주었다.

잘 나온다.

 

하지만 실제 Icon에 적용시키면 다음과 같은 문제가 발생한다.

검은색으로 나오는 문제

코드 부분에는 정상적으로 나오는 것으로 보인다.

 

해결법은 간단하다.

Icon(
    painter = painter,
    contentDescription = contentDescription,
    tint = Color.Unspecified // 해당 속성값을 추가시켜주면 된다.
    modifier = Modifier
        .padding(start = 8.dp)
        .offset(y = (20).dp)
        .zIndex(1f)
)

아이콘에 색상을 지정하지 않는다는 설정으로 아이콘의 원래 색상이 유지된다.

 

 

Icon 코드를 살펴보면

@Composable
fun Icon(
    painter: Painter,
    contentDescription: String?,
    modifier: Modifier = Modifier,
    tint: Color = LocalContentColor.current
)

tint 속성에는 디폴트 값이 설정되어 있다.

참고로 LocalContentColor의 값은 Color.Black으로 설정되어 있다. 따라서 아이콘이 검은색으로 나오는 문제가 발생했었던 것이다.

 

 

생각보다 별거 아닌 문제였기에 쉽게 해결할 수 있었다.