@Composable
fun pickColor(): Color {
    val colors = listOf(
        Color.Black,
        Color.Gray,
        Color.Magenta,
        Color.Yellow,
        Color.LightGray,
        Color.Cyan,
        Color.Blue,
        Color.DarkGray
    )

//    val index = Random.nextInt(0,colors.count() - 1)
    var index by remember{mutableStateOf(0)}

    return if (index < colors.count()) {val temp = colors[index]; index++; temp}
    else {index=0;colors[index]}
}

var count = remember{mutableStateOf(0)}
val size = 400.dp
    Column(horizontalAlignment = Alignment.CenterHorizontally, modifier = Modifier.fillMaxSize()) {
        Box(modifier = Modifier.size(size).background(Color.Red), contentAlignment = Alignment.Center){
            var childSize = size - 20.dp
            for (i in 0 until count.value){
                Box(modifier = Modifier.size(childSize).background(pickColor()))
                childSize -= 20.dp
            }
        }
        OutlinedTextField(value = "${count.value}", onValueChange = {})
        Row {
            Button(onClick = { count.value++ }, modifier= Modifier.padding(8.dp)) {
                Row{
                    Icon(imageVector = Icons.Rounded.Add, contentDescription = "Increase")
                    Text("Increase")
                }
            }
            Button(onClick = { count.value = if (count.value <= 0) 0 else count.value-1 }, Modifier.padding(8.dp)) {
                Row{
                    Icon(painter = painterResource(id = R.drawable.ic_baseline_remove_24), contentDescription = "Delete")
                    Text("Decrease")
                }


            }
        }

    }