Adding border to Image after click-CodePudding

I want to create a Image that add a border to yourself on onClick trigger. Here is my code:

@Composable
fun Dices(@DrawableRes dice: List<Int>, viewModel: DicesViewModel) {
    Column(Modifier.padding(top = 28.dp, start = 10.dp, end = 10.dp, bottom = 26.dp), verticalArrangement = Arrangement.Bottom, horizontalAlignment = Alignment.CenterHorizontally) {
        Row() {
            Image(
  painter = painterResource(id = dice[0]),
  contentDescription = "Dice",
  modifier = Modifier
                .padding(2.dp)
                .size(110.dp)
                .clickable { Modifier.border(2.dp, Color.Black) /* doesnt work */ })
   }
}

I have six more of these Image(), below, but i do not pase it here, because it's the same as here.

There is any way to add border to this?

I want to add a border to Image after click on it

CodePudding user response：

Try this:

  var isSelected by remember{ mutableStateOf(false)}
    
        modifier = Modifier
                        .padding(2.dp)
                        .size(110.dp)
                        .border(if (isSelected) 2.dp else 0.dp, Color.Black)
                        .clickable { isSelected = !isSelected  }