[Feature Request] Bottom Sheets for Material 3 [244189383]

Fixed

Bug

Status Update

No update yet.

Description

de...@gmail.com

created issue #1

Aug 29, 2022 06:10PM

Feature Request to add BottomSheets to Compose for Material 3.
See Bottom sheets - Material Design 3. The Guidelines are also still missing.

Comments

de...@gmail.com <de...@gmail.com> #2Sep 21, 2022 03:19PM

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

commit c60f33e229e31ab328ef6b59dab63b264954831c
Author: Alexandre Elias <aelias@google.com>
Date: Fri Jul 10 16:23:09 2020

Semantics no-op cleanups

Partly in response to lmr's broad code review, I did a pass of
superficial API/implementation cleanup. The main changes are:

- I changed each Boolean SemanticsProperty where false is equivalent to
not being present to take "Unit" instead. This is conceptually
clearer: it avoids questions like "can I cancel out a semantics from a
merged child by setting it to false?" Because "property = Unit" looks
weird, I also changed the style of these to "property()".

- I moved the Semantics id generator closer to where it's used, in
SemanticsModifierCore. I made it internal and an AtomicInt.
(Note that integer ids are heavily used in the Android
AccessibilityNodeInfo APIs so I can't simply remove them entirely.)

- I deleted dead code. Some examples include SemanticsHintOverrides,
a public API not connected to anything, and SemanticsPropertyKey
merge() open method which is never called. (In both cases I have
a different plan in mind for accessibility.)

Fixes: 145951226
Fixes: 145955412
Test: existing tests
Relnote: "Single-value semantics properties now use a calling style.
For example, 'semantics { hidden = true }' is now written as:
'semantics { hidden() }'."

Change-Id: Ic1afd12ea22c926babc9662f1804d80b33aa0cfc

M ui/integration-tests/benchmark/src/androidTest/java/androidx/ui/benchmark/test/LayoutNodeModifierBenchmark.kt
M ui/ui-core/api/0.1.0-dev15.txt
M ui/ui-core/api/current.txt
M ui/ui-core/api/public_plus_experimental_0.1.0-dev15.txt
M ui/ui-core/api/public_plus_experimental_current.txt
M ui/ui-core/api/restricted_0.1.0-dev15.txt
M ui/ui-core/api/restricted_current.txt
M ui/ui-core/src/androidAndroidTest/kotlin/androidx/ui/graphics/vector/VectorTest.kt
M ui/ui-core/src/androidAndroidTest/kotlin/androidx/ui/semantics/SemanticsTests.kt
M ui/ui-core/src/androidMain/kotlin/androidx/ui/core/AndroidActuals.kt
M ui/ui-core/src/androidMain/kotlin/androidx/ui/core/AndroidComposeView.kt
M ui/ui-core/src/androidMain/kotlin/androidx/ui/core/AndroidComposeViewAccessibilityDelegateCompat.kt
M ui/ui-core/src/androidMain/kotlin/androidx/ui/core/AndroidPopup.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/core/Expect.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/core/semantics/SemanticsConfiguration.kt
D ui/ui-core/src/commonMain/kotlin/androidx/ui/core/semantics/SemanticsHintOverrides.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/core/semantics/SemanticsModifier.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/core/semantics/SemanticsNode.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/core/semantics/SemanticsOwner.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/core/semantics/SemanticsWrapper.kt
M ui/ui-core/src/commonMain/kotlin/androidx/ui/semantics/SemanticsProperties.kt
M ui/ui-foundation/api/0.1.0-dev15.txt
M ui/ui-foundation/api/current.txt
M ui/ui-foundation/api/public_plus_experimental_0.1.0-dev15.txt
M ui/ui-foundation/api/public_plus_experimental_current.txt
M ui/ui-foundation/api/restricted_0.1.0-dev15.txt
M ui/ui-foundation/api/restricted_current.txt
M ui/ui-foundation/src/main/java/androidx/ui/foundation/Clickable.kt
M ui/ui-foundation/src/main/java/androidx/ui/foundation/Dialog.kt
M ui/ui-foundation/src/main/java/androidx/ui/foundation/Scroller.kt
M ui/ui-foundation/src/main/java/androidx/ui/foundation/selection/Selectable.kt
M ui/ui-foundation/src/main/java/androidx/ui/foundation/selection/Toggleable.kt
M ui/ui-foundation/src/main/java/androidx/ui/foundation/semantics/FoundationSemanticsProperties.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/ButtonTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/CardTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/CheckboxScreenshotTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/RadioButtonScreenshotTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/ScaffoldTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/SnackbarTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/SurfaceTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/ripple/RippleIndicationTest.kt
M ui/ui-material/src/androidTest/java/androidx/ui/material/textfield/TextFieldScreenshotTest.kt
M ui/ui-material/src/main/java/androidx/ui/material/AppBar.kt
M ui/ui-material/src/main/java/androidx/ui/material/TextFieldImpl.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/AssertsTest.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/CallSemanticsActionTest.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/ErrorMessagesTest.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/FindersTest.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/PrintToStringTest.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/ScrollToTest.kt
M ui/ui-test/src/androidTest/java/androidx/ui/test/TextActionsTest.kt
M ui/ui-test/src/main/java/androidx/ui/test/Actions.kt
M ui/ui-test/src/main/java/androidx/ui/test/Filters.kt
M ui/ui-text/api/0.1.0-dev15.txt
M ui/ui-text/api/current.txt
M ui/ui-text/api/public_plus_experimental_0.1.0-dev15.txt
M ui/ui-text/api/public_plus_experimental_current.txt
M ui/ui-text/api/restricted_0.1.0-dev15.txt
M ui/ui-text/api/restricted_current.txt
M ui/ui-text/src/commonMain/kotlin/androidx/ui/text/CoreTextField.kt
M ui/ui-text/src/commonMain/kotlin/androidx/ui/text/TextSemanticsProperties.kt

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

se...@google.com <se...@google.com> #3Sep 21, 2022 03:35PM

Reassigned to se...@google.com.

Hello, implementation for this is currently slated for this quarter, however we are currently facing some blockers. I'll keep this bug updated as we flesh out a more concrete timeline! As for the guidelines on the M3 site, that's not in our control compose side.

de...@gmail.com <de...@gmail.com> #4Sep 21, 2022 03:39PM

Thank you, the guidelines were only a side note and are not that important.

Message last modified on Oct 13, 2022 09:40PM

se...@google.com <se...@google.com> Oct 18, 2022 06:35PM

Accepted by se...@google.com.

cn...@gmail.com <cn...@gmail.com> #5Nov 2, 2022 11:56AM

I do find it a little odd how M3 is considered stable for compose (

https://material.io/blog/material-3-compose-stable) while this component is completely missing.

li...@gmail.com <li...@gmail.com> #6Dec 22, 2022 10:26AM

any updates?

ca...@gmail.com <ca...@gmail.com> #7Jan 3, 2023 07:29AM

I am using this workaround for now (

https://stackoverflow.com/questions/72518262/how-to-implement-bottomsheet-in-material-3-jetpack-compose-android) but it would be nice with an official implementation.

de...@gmail.com <de...@gmail.com> #8Jan 4, 2023 10:01AM

Is there a rough ETA?

se...@google.com <se...@google.com> #9Jan 4, 2023 05:10PM

We have a modal implementation with proper dialog functionality in review, aiming to land this as alpha by EOM but will try and keep folks posted if that changes.

de...@gmail.com <de...@gmail.com> #10Jan 4, 2023 05:12PM

Do you have a Gerrit link to the review?

se...@google.com <se...@google.com> #11Jan 11, 2023 03:59PM

Can be found at https://android-review.googlesource.com/2350463 🫡

Message last modified on Jan 26, 2023 08:48PM

an...@gmail.com <an...@gmail.com> #12Jan 25, 2023 10:32AM

Any updates when we can expect alpha with this?

b9...@gmail.com <b9...@gmail.com> #13Jan 26, 2023 07:24PM

Comment has been deleted.

Message last modified on Jan 27, 2023 03:24PM

ap...@google.com <ap...@google.com> #14Jan 27, 2023 04:12PM

Project: platform/frameworks/support
Branch: androidx-main

commit 896d4c78e8aff51f39f1edd6883f8ddc3549b1a8
Author: serniebanders <serniebanders@google.com>
Date: Tue Dec 06 14:01:07 2022

[Material3][BottomSheet] M3 Modal Bottom Sheet implementation.

Bug: 244189383
Relnote: Modal bottom sheet implementation for Material 3, including ModalBottomSheet and ModalBottomSheetDefaults. Also introduces SheetState and rememberSheetState which can be used for future sheet components.
Test: Ported relevant tests from M2 Modal bottom sheet and popup.

Change-Id: I0853a6ec6d06166787701db1edb4a09b90dd563e

M compose/material3/material3/api/current.txt
M compose/material3/material3/api/public_plus_experimental_current.txt
M compose/material3/material3/api/restricted_current.txt
M compose/material3/material3/integration-tests/material3-catalog/src/main/java/androidx/compose/material3/catalog/library/model/Components.kt
M compose/material3/material3/integration-tests/material3-catalog/src/main/java/androidx/compose/material3/catalog/library/model/Examples.kt
A compose/material3/material3/samples/src/main/java/androidx/compose/material3/samples/BottomSheetSamples.kt
A compose/material3/material3/src/androidAndroidTest/kotlin/androidx/compose/material3/ModalBottomSheetTest.kt
A compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/ModalBottomSheet.kt
A compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/SheetDefaults.kt
M compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/SwipeableV2.kt
A compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/tokens/SheetBottomTokens.kt

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

se...@google.com <se...@google.com> Jan 27, 2023 08:13PM

Marked as fixed.

b9...@gmail.com <b9...@gmail.com> #15Jan 28, 2023 04:40PM

Can't wait next alpha!

ch...@appswithlove.com <ch...@appswithlove.com> #16Feb 2, 2023 08:49AM

Checked current implementation, it has a bug with nested scrolling, when you use nested scroll (fling) to dismiss bottom sheet it breaks

se...@google.com <se...@google.com> #17Feb 7, 2023 01:04PM

Given that this tracker is closed, do you mind filing a bug for this along with details to reproduce. Thanks!

pr...@google.com <pr...@google.com> #18Feb 8, 2023 06:21PM

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

androidx.compose.material3:material3:1.1.0-alpha06

dp...@phunware.com <dp...@phunware.com> #19Feb 8, 2023 09:58PM

This isn't fully fixed yet though, since we still don't have a standard bottom sheet. That ticket only added the modal version of it. Right?

ma...@gmail.com <ma...@gmail.com> #20Feb 8, 2023 10:48PM

I have a strange behavior where a textfield would not work to write inside it when has a bottom sheet as a parent. I can give more details but basically another textfield remains focused and it looks like both fields are focused (the one outside sheet and the one inside sheet, but when you write only the one outside works).

sk...@gmail.com <sk...@gmail.com> #21Feb 8, 2023 10:56PM

I've just reported this https://issuetracker.google.com/issues/268380384 - it seems to be a related issue.

jo...@google.com <jo...@google.com> #22Feb 9, 2023 09:17AM

#20, if the issue reported by #21 isn't the same as yours, can you file an issue with a repro?

na...@gmail.com <na...@gmail.com> #23Feb 9, 2023 09:25AM

Material 2 has a BottomSheetScaffold component with a sheetPeekHeight property, which allows things like small music controls to remain in view at the bottom of the screen when the sheet is collapsed and for this to expand to a full screen player UI when expanded. I can't seem to find how to do this peek effect using the Material 3 modal bottom sheet. Could I be missing something or should I open a ticket to request something like sheetPeekHeight? I apologise if the question is naïve or better suited to SO.

ma...@gmail.com <ma...@gmail.com> #24Feb 9, 2023 04:56PM

#22 it's exactly the same issue, easy to reproduce.

Get a Column with an OutlinedTextField or any input text field with a Bottom Sheet that contains another input text. You cannot type into the one inside the bottom sheet.

In my opinion the problem is not that the bottom sheet covers the keyboard, indeed it does that, but I was testing from the emulator and I was typing on the physical keyboard, I think it's more like a focus issue but we count on you guys to figure it out.

Message last modified on Feb 9, 2023 04:58PM

jo...@google.com <jo...@google.com> #25Feb 9, 2023 05:07PM

#24, gotcha! Please follow along in the other issue then :)

de...@gmail.com <de...@gmail.com> #26Feb 10, 2023 07:23PM

The BottomSheet still has serious problems with positioning. Depending on the height of the content, the BottomSheet floats in the middle of the screen or something similar, so that a lot of the app is still visible below the BottomSheet.

Is this already known, or should I create a ticket?

se...@google.com <se...@google.com> #27Feb 10, 2023 07:41PM

Yes, see https://issuetracker.google.com/268411386

For other issues please file new bugs so we can more effectively triage than coming back to this tracker.

at...@gmail.com <at...@gmail.com> #28Apr 20, 2023 06:37PM

There are some very serious accessibility issues with Bottom Sheet in 1.1.0-alpha-07. Talkback does not correctly find focus when bottom sheet is open

ja...@gmail.com <ja...@gmail.com> #29May 10, 2023 07:02PM

import androidx.compose.material3.BottomSheetScaffold

This import is not working for me

ja...@gmail.com <ja...@gmail.com> #30May 10, 2023 07:05PM

const val composeMaterial3 = "1.0.1"
const val composeVersion = "1.4.3"

compileOptions {
sourceCompatibility JavaVersion.VERSION_17
targetCompatibility JavaVersion.VERSION_17
}
kotlinOptions {
jvmTarget = '17'
}

Using the above version of Material3. Please share any suggestions.