Hi guys, Can someone help me on to autoscroll the ...

# compose

[KotlinLeaner]

Hi guys, Can someone help me on to autoscroll the column item. I have Column inside that there are few items. Some of the item are hidden and visible on some condition. There is one Nested Column which is adding item and auto scrolling which is done with the help of this post. Item adding will done through Add Me CTA. Main problem comes here, when I was added more than 10 item and then we click on Show Banner CTA, AnimatedVisibility condition will true and display the view and Nested Column will shifted the few items downward. I don't won't like this, instead I wan't to calculate the whole column height and always show the last item. Same as done through in the answer gif.

[KotlinLeaner]

@Preview(showBackground = true, widthDp = 250, heightDp = 320)
@Composable
fun addItem() {
    val scrollState = rememberScrollState()
    var uiEvent by remember { mutableStateOf(Number.Initial) }
    var itemFalse by remember {mutableStateOf(false)}
    var itemClicked by remember { mutableStateOf(0) }
    val favourites = remember { mutableStateListOf<String>() }
    LaunchedEffect(itemFalse) {
        for (i in 0..8) {
            itemClicked++
            favourites.add("item clicked $itemClicked")
        }
    }
    LaunchedEffect(
        favourites.size,
        uiEvent
    ) {
        scrollState.animateScrollTo(scrollState.maxValue)
    }
    Column {  // 1st Column
        Column(
            modifier = Modifier
                .verticalScroll(scrollState)
                .weight(1f),
            horizontalAlignment = Alignment.CenterHorizontally,
        ) { // 2nd Column
            Text(text = "Hello world", fontSize = 20.sp)
            Text(text = "Hello How are you?", fontSize = 20.sp)
            AnimatedVisibility(visible = uiEvent == Number.One) {
                Text(text = "Write it on your heart that every day is the best day in the year.", fontSize = 20.sp)
            }
            favourites.forEach { text -> // nested Column
                Text(
                    text = text,
                    fontSize = 30.sp,
                    color = Red
                )
            }
        }
        Column { // 3rd Column
            Row {
                Button(onClick = {
                    uiEvent = Number.One
                }) {
                    Text(text = "Show Banner")
                }

                Button(onClick = {
                    itemClicked++
                    favourites.add("item clicked $itemClicked")
                }) {
                    Text(text = "Add Me")
                }
            }
        }
    }
}

enum class Number(val type: Int) {
    Initial(0),
    One(1);
}

[KotlinLeaner]

I am adding youtube video. When we Click on Add Me it added item on Nested Column and autoscroll. When we click on Show Banner, few items of Nested Column will go downwards. I don't want it like that. It always want to make last item visible and auto scroll.

Nested Column means favourites.forEach { text -> this piece of code.