move imePadding to outer Box — fix input floating into chat area

The root cause: imePadding on the bottom dock Column inflated it
by the full keyboard height, pushing it up into the chat content.

Fix: imePadding on the outer Box that contains everything. Now
the entire layout shrinks when keyboard opens — chat area gets
shorter, dock stays at the (new) bottom edge. No overlap.
This commit is contained in:
Bruno Deanoz 2026-06-22 01:13:40 +02:00
parent 27deaca2e4
commit 77976ea974

View file

@ -535,7 +535,7 @@ fun ChatScreen(
gesturesEnabled = true // Allows swiping from the screen's left edge to open the drawer gesturesEnabled = true // Allows swiping from the screen's left edge to open the drawer
) { ) {
MeshBackground { MeshBackground {
Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) { Box(Modifier.fillMaxSize().imePadding(), contentAlignment = Alignment.Center) {
// 1. Scrollable Chat Content // 1. Scrollable Chat Content
// Stretches to the full screen, allowing bubbles to scroll cleanly behind the floating bottom dock. // Stretches to the full screen, allowing bubbles to scroll cleanly behind the floating bottom dock.
// Centered layout with responsive width capping on tablets. // Centered layout with responsive width capping on tablets.
@ -707,24 +707,21 @@ fun ChatScreen(
Column( Column(
modifier = Modifier modifier = Modifier
.align(Alignment.BottomCenter) .align(Alignment.BottomCenter)
.then( .background(
if (imeVisible) { if (imeVisible) {
Modifier.background(scrimColor) Brush.verticalGradient(listOf(scrimColor, scrimColor))
} else { } else {
Modifier.background( Brush.verticalGradient(
Brush.verticalGradient( colorStops = arrayOf(
colorStops = arrayOf( 0f to Color.Transparent,
0f to Color.Transparent, 0.35f to scrimColor.copy(alpha = 0.6f),
0.35f to scrimColor.copy(alpha = 0.6f), 0.7f to scrimColor.copy(alpha = 0.92f),
0.7f to scrimColor.copy(alpha = 0.92f), 1f to scrimColor,
1f to scrimColor, ),
),
)
) )
} }
) )
.navigationBarsPadding() .navigationBarsPadding()
.imePadding()
.then(if (isTablet) Modifier.widthIn(max = 720.dp) else Modifier) .then(if (isTablet) Modifier.widthIn(max = 720.dp) else Modifier)
) { ) {
if (!imeVisible) { if (!imeVisible) {