[Android] Compose에서 Box 클릭효과 모양 변경하는 방법

Box의 Modifier 속성에 clickable을 추가하면, 기본적으로 사각형의 클릭효과가 적용된다.

 

클릭효과 모양을 설정하는 속성은 다음과 같다.

.clip(원하는 모양)

 

예를 들어 동그라미 효과를 주려면 아래와 같이 하면 된다.

clip(CircleShape)//동그라미로 설정

 

* compose version 1.0.0-beta08 부터 적용가능하다.

* clickable 속성 앞에 지정해 주어야 한다.

 

전체 코드를 보여 마무리하겠다.

Box(
    modifier = Modifier
        .size(33.dp)
        .clip(CircleShape) //동그라미로 설정
        .clickable { onItemClick() }
        .background(Yellow, CircleShape),
    contentAlignment = Center
) {
    Icon(
        painter = painterResource(id = icon),
        contentDescription = "",
        tint = Color.Black,
        modifier = Modifier.size(15.dp)
    )
}