HorizontalFloatingToolbar

Kotlin
@OptIn(ExperimentalMaterial3Api::class)


@Composable
fun ExpandableHorizontalFloatingToolbarSample() {
    var expanded by rememberSaveable { mutableStateOf(true) }
    Scaffold(
        content = { innerPadding ->
            Box(Modifier.padding(innerPadding)) {
                // The toolbar should receive focus before the screen content, so place it first.
                // Make sure to set its zIndex so it's above the screen content visually.
                HorizontalFloatingToolbar(
                    modifier =
                        Modifier.align(Alignment.BottomCenter).offset(y = -ScreenOffset).zIndex(1f),
                    expanded = expanded,
                    leadingContent = { LeadingContent() },
                    trailingContent = { TrailingContent() },
                    content = {
                        TooltipBox(
                            positionProvider =
                                TooltipDefaults.rememberTooltipPositionProvider(
                                    TooltipAnchorPosition.Above
                                ),
                            tooltip = {
                                PlainTooltip(
                                    modifier =
                                        Modifier.semantics {
                                            // TODO(b/496338253): Remove this modifier once bug
                                            //  where tooltip text is not announced by a11y screen
                                            //  readers is resolved.
                                            liveRegion = LiveRegionMode.Assertive
                                            paneTitle = "Localized description"
                                        }
                                ) {
                                    Text("Localized description")
                                }
                            },
                            state = rememberTooltipState(),
                        ) {
                            FilledIconButton(
                                modifier = Modifier.width(64.dp),
                                onClick = { /* doSomething() */ },
                            ) {
                                Icon(Icons.Filled.Add, contentDescription = "Localized description")
                            }
                        }
                    },
                )
                LazyColumn(
                    // Apply a floatingToolbarVerticalNestedScroll Modifier toggle the expanded
                    // state of the HorizontalFloatingToolbar.
                    modifier =
                        Modifier.floatingToolbarVerticalNestedScroll(
                            expanded = expanded,
                            onExpand = { expanded = true },
                            onCollapse = { expanded = false },
                        ),
                    state = rememberLazyListState(),
                    contentPadding = innerPadding,
                    verticalArrangement = Arrangement.spacedBy(8.dp),
                ) {
                    val list = (0..75).map { it.toString() }
                    items(count = list.size) {
                        Text(
                            text = list[it],
                            style = MaterialTheme.typography.bodyLarge,
                            modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp),
                        )
                    }
                }
            }
        }
    )
}