|-|i

I'm trying to make a column able to keep visible the bottom item when ime gets displayed

I have a text field at bottom of screen, and above is the column, filled with random text to make it scroll.

I tried a bit Modifier.imeNestedScroll(), but I struggle, I'm not even sure it would do the job

Here is my code currently, but it's kinda buggy...

ComposeTestTheme {
    Scaffold(modifier = Modifier.fillMaxSize())
    { innerPadding ->
        Column(
            modifier = Modifier
                .padding(innerPadding)
                .consumeWindowInsets(innerPadding)
                .fillMaxSize()
        )
        {
            LazyColumn(
                modifier = Modifier
                    .weight(1f)
                    .fillMaxWidth()
                    .border(2.dp, Color.Red)
                    .imeNestedScroll()
            )
            {
                items(50) { index ->
                    Text(text = "item: $index")
                }
            }
            TextField(
                value = "",
                onValueChange = {},
                modifier = Modifier
                    .fillMaxWidth()
                    .border(2.dp, Color.Black)
                    .imePadding()
            )
        }
    }
}

Could someone help?

|-|i

I'm trying to make a column able to keep visible the bottom item when ime gets displayed

I have a text field at bottom of screen, and above is the column, filled with random text to make it scroll.

I tried a bit Modifier.imeNestedScroll(), but I struggle, I'm not even sure it would do the job

Here is my code currently, but it's kinda buggy...

ComposeTestTheme {
    Scaffold(modifier = Modifier.fillMaxSize())
    { innerPadding ->
        Column(
            modifier = Modifier
                .padding(innerPadding)
                .consumeWindowInsets(innerPadding)
                .fillMaxSize()
        )
        {
            LazyColumn(
                modifier = Modifier
                    .weight(1f)
                    .fillMaxWidth()
                    .border(2.dp, Color.Red)
                    .imeNestedScroll()
            )
            {
                items(50) { index ->
                    Text(text = "item: $index")
                }
            }
            TextField(
                value = "",
                onValueChange = {},
                modifier = Modifier
                    .fillMaxWidth()
                    .border(2.dp, Color.Black)
                    .imePadding()
            )
        }
    }
}

Could someone help?

• android-jetpack-compose

Share Improve this question Follow asked Jan 17 at 20:13 RaphaelRaphael 4555 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

Done this way:

Scaffold(modifier = Modifier.fillMaxSize())
{ innerPadding ->
    Column(
        modifier = Modifier
            .padding(innerPadding)
            .consumeWindowInsets(innerPadding)
            .fillMaxSize()
    )
    {
        val list = remember { (1..130).map{ it.toString() }.toList() }
        LazyColumn(
            reverseLayout = true,
            modifier = Modifier
                .fillMaxWidth()
                .weight(1f)
                .border(2.dp, Color.Red)
        )
        {
            items(list.size) { message ->
                Text(text = message.toString())
            }
        }

        TextField(
            value = "",
            onValueChange = { },
            modifier = Modifier
                .imePadding()
                .fillMaxWidth()
                .border(2.dp, Color.Black)
        )
    }
}