How to stick item at bottom in LazyColumn jetpack compose

Question

I want to put items at bottom of LazyColumn. So what is the best recommended way of doing in LazyColumn. Some content I put in item or itemIndexed which is correctly, but unable to know how to stick in bottom of screen?

        LazyColumn(
            contentPadding = PaddingValues(
                horizontal = 16.dp, vertical = 16.dp)
            ),
            verticalArrangement = Arrangement.spacedBy(16.dp),
        ) {
            item { Header() }

            itemsIndexed(storedDevice) { index, item ->
                Label({ index }, item, { list.size })
            }
            
            item { 
                Button() // stick in bottom of screen 
                Button() // stick in bottom of screen 
            }
        } 

Expected Outout

Katinakatine

Answer 1

You can move the Button outside the LazyColumn, using a Column and applying the weight modifier to the LazyColumn.

Something like:

Column() {

    LazyColumn(
        modifier = Modifier.weight(1f),
        contentPadding = PaddingValues(
            horizontal = 16.dp, vertical = 16.dp),
        verticalArrangement = Arrangement.spacedBy(16.dp),
    ) {

        items(itemsList) {
            Text("Item $it")
        }
    }

    //Footer
    Column() {
        Button(onClick={}){ Text("Button") } // stick in bottom of screen
        Button(onClick={}){ Text("Button") } // stick in bottom of screen
    }

}

Flamboyant

This doesn't seem to work if I have a Text with dynamic size. – Aspergillus