M3 ModalBottomSheet - The keyboard does not open when clicking on a text field in the modal [272483584]

Fixed

Bug

Status Update

No update yet.

Description

b....@gmail.com

created issue #1

Mar 9, 2023 04:53PM

Jetpack Compose version: 1.3.3

Material 3 version : 1.1.0-alpha08

Jetpack Compose component used: ModalBottomSheet

Android Studio Build: #AI-221.6008.13.2211.9619390

Kotlin version: 1.8.0

Issue : If we add a text field in a modal. When clicking on the text field of the modal. The keyboard does not open. Once you close the modal, the keyboard opens.

Simple code :


val scope = rememberCoroutineScope()
val sheetState = rememberModalBottomSheetState()
Button(onClick = {
    scope.launch {
        sheetState.show()
    }
}) {
    Text("Open it")
}
if (sheetState.isVisible) {
    ModalBottomSheet(
        sheetState = sheetState,
        onDismissRequest = {
            scope.launch {
                sheetState.hide()
            }
        },
    ) {
        TextField(
            value = "",
            onValueChange = { },
        )
    }
}

Comments

dy...@gmail.com <dy...@gmail.com> #2Mar 9, 2023 06:27PM

I'm not sure what you mean by onSizeChanged. Which size? Children of the scroller?

In this case, how do you expect onSizeChanged modifier behave differently from onPositioned other than performance?

ta...@gmail.com <ta...@gmail.com> #3Mar 10, 2023 12:00PM

Sorry, the scroller thing was just an example of when a onPositioned would be call a lot without the size changing.

In this case, how do you expect onSizeChanged modifier behave differently from onPositioned other than performance?

I imagine it would act similarly, but only for the size, and not position.

se...@google.com <se...@google.com> #4Mar 10, 2023 04:48PM

Oh, I see, thanks for explaining.

I imagine notification only about size change can have some performance wins against position + size notification..

Cc-ing Andrey and reassigning to George, they both have some insights I'm sure. It would be handy to have `Modifier.onSizeChanged`, especially it it will be faster

se...@google.com <se...@google.com> Mar 13, 2023 12:39PM

Accepted by se...@google.com.

lx...@gmail.com <lx...@gmail.com> #5Mar 16, 2023 09:55AM

You can do this yourself with this:

fun Modifier.onSizeChanged(block: (size: IntPxSize) -> Unit): Modifier = object : LayoutModifier2 {
   private var previousSize: IntPxSize = PxSize.Zero

   override Density.modifySize(
     constraints: Constraints,
     layoutDirection: LayoutDirection,
     childSize: IntPxSize
   ) {
     if (childSize != previousSize) {
       previousSize = childSize
       block(childSize)
     }
     return childSize
   }
}

Would you like something that only cares about the content size or is this what you would like added to the library?

mr...@gmail.com <mr...@gmail.com> #6Apr 13, 2023 06:19PM

Yep, that's exactly what I'd like in the library.

I can also see the benefit of having another modifier to know the content size within the parent too.

se...@google.com <se...@google.com> #7Apr 19, 2023 04:55PM

Just tried the code above but modifySize doesn't seem to be in LayoutModifier2 (it is in the deprecated LayoutModifier though)

ap...@google.com <ap...@google.com> #8Apr 20, 2023 03:00PM

Chris, I'd like to make a sample for using OnSizeChanged. Can you give me a short example of how it would be used?

se...@google.com <se...@google.com> Apr 20, 2023 03:01PM

Marked as fixed.

za...@gmail.com <za...@gmail.com> #9Apr 22, 2023 02:28PM

Here's an example: https://github.com/chrisbanes/tivi/blob/cb/discover-compose/ui-discover/src/main/java/app/tivi/home/discover/Discover.kt#L243

Basically I need to know the height of the app bar, to be able to push down content (y-axis) to be visually below.

se...@google.com <se...@google.com> #10Apr 24, 2023 05:51PM

Nice! I've put in a simplified version of that.

za...@gmail.com <za...@gmail.com> #11Apr 24, 2023 06:26PM

Project: platform/frameworks/support
Branch: androidx-master-dev

commit 9209f5d65524cf83c0860459955bd83c5615a817
Author: George Mount <mount@google.com>
Date: Tue Sep 01 14:55:57 2020

Add onSizeChanged() and OnRemeasuredModifier

Added a new modifier to make it faster to notify only when a
layout's content size changes. This avoids the down-hierarchy
notifications required when using onPositioned.

Relnote: "Added OnRemeasuredModifier and onSizeChanged() to
receive a callback when content layout has been remeasured and
the size has changed, respectively."

Fixes: 154108792
Bug: 162351735

Test: OnSizeChangedTest
Change-Id: I657cf033de811e9279a2b2079933ca0bd89e5e60

M compose/ui/ui/api/current.txt
M compose/ui/ui/api/public_plus_experimental_current.txt
M compose/ui/ui/api/restricted_current.txt
A compose/ui/ui/samples/src/main/java/androidx/compose/ui/samples/OnSizeChangedSamples.kt
M compose/ui/ui/src/androidAndroidTest/kotlin/androidx/compose/ui/input/pointer/PointerInputEventProcessorTest.kt
A compose/ui/ui/src/androidAndroidTest/kotlin/androidx/compose/ui/layout/OnSizeChangedTest.kt
M compose/ui/ui/src/androidMain/kotlin/androidx/compose/ui/platform/AndroidComposeView.kt
A compose/ui/ui/src/commonMain/kotlin/androidx/compose/ui/OnRemeasuredModifier.kt
M compose/ui/ui/src/commonMain/kotlin/androidx/compose/ui/node/LayoutNode.kt

https://android-review.googlesource.com/1418715

za...@gmail.com <za...@gmail.com> #12May 13, 2023 12:31AM

It seems to be fully fixed in 1.2.0-alpha01.

ju...@google.com <ju...@google.com> #13May 24, 2023 07:37PM

The following release(s) address this bug.It is possible this bug has only been partially addressed:

androidx.compose.material3:material3-android:1.2.0-alpha02

ty...@udisc.com <ty...@udisc.com> #14Jun 25, 2023 03:01PM

Is this fix going to be back ported to 1.1? Seems like 1.2 alpha 2 does fix the issue but also introduces other issues such as the sheets not respecting system bars, some issue with insets always being zero unless you enable "edge to edge" mode.

va...@gmail.com <va...@gmail.com> #15Jan 18, 2024 03:41PM

there are couple of concerns related to the behavior of the BottomSheet in Jetpack Compose and its subsequent versions:

Overlapping with System Navigation Button:
Version 1.1.0 effectively resolves the issue of the BottomSheet overlapping with the system navigation button.
However, in versions above 1.1.0, including 1.2 alpha2, the BottomSheet reintroduces the problem of overlapping with the system navigation button.

TextField Click Behavior and Keyboard Activation:
The keyboard activation works fine in higher versions (1.2 alpha-2). However, the primary concern remains with the overlapping issue in these higher versions, which requires attention.

Seeking a comprehensive fix that addresses the overlapping with the system navigation button in higher versions, while acknowledging the keyboard activation improvement. Your attention to this matter would be highly appreciated.