compose-multiplatform-html-unified-material3/com.huanshankeji.compose.material3/Scaffold

Scaffold

expect fun Scaffold(modifier: Modifier = Modifier, topBar: @Composable () -> Unit = {}, bottomBar: @Composable () -> Unit = {}, snackbarHost: @Composable () -> Unit = {}, floatingActionButton: @Composable () -> Unit = {}, floatingActionButtonPosition: FabPosition = FabPosition.End, content: @Composable (PaddingValues) -> Unit)(source)

Material Design layout.

Scaffold implements the basic Material Design visual layout structure.

This component provides API to put together several Material components to construct your screen, by ensuring proper layout strategy for them and collecting necessary data so these components will work together correctly.

Parameters

modifier

the Modifier to be applied to this scaffold

topBar

top app bar of the screen, typically a TopAppBar

bottomBar

bottom bar of the screen, typically a navigation bar

snackbarHost

component to host Snackbars that are pushed to be shown via SnackbarHostState.showSnackbar, typically a SnackbarHost

floatingActionButton

Main action button of the screen, typically a FloatingActionButton

floatingActionButtonPosition

position of the FAB on the screen. See FabPosition.

content

content of the screen. The lambda receives a PaddingValues that should be applied to the content root via padding to properly offset top and bottom bars. Conventional values are 64 dp for top and bottom bars if they exist and 0 for horizontal padding on Compose UI, and 0 for all sides on JS DOM. According to the corresponding doc for androidx.compose.material3.Scaffold, if the content is scrollable, such values to be applied to "the child of the scroll, and not on the scroll itself".

Scaffold

Parameters

See also