ScreenScaffold

Composable Component

ScreenScaffold is one of the Wear Material3 scaffold components.

Android

@Composable
public fun ScreenScaffold(
    scrollState: ScalingLazyListState,
    edgeButton: @Composable BoxScope.() -> Unit,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    edgeButtonSpacing: Dp = ScreenScaffoldDefaults.EdgeButtonSpacing,
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for `ScalingLazyColumn`, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
edgeButton	Slot for an `EdgeButton` that takes the available space below a scrolling list. It will scale up and fade in when the user scrolls to the end of the list, and scale down and fade out as the user scrolls up.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists. The bottom padding value is always ignored because we instead use `edgeButtonSpacing` to specify the gap between edge button and content - and the `EdgeButton` hugs the bottom of the screen.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
edgeButtonSpacing	The space between `EdgeButton` and the list content
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `edgeButton` and `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists to properly offset the `EdgeButton`.

Android

@Composable
public fun ScreenScaffold(
    scrollState: ScalingLazyListState,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for `ScalingLazyColumn`, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists to properly offset the `EdgeButton`.

Android

@Composable
public fun ScreenScaffold(
    scrollState: TransformingLazyColumnState,
    edgeButton: @Composable BoxScope.() -> Unit,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    edgeButtonSpacing: Dp = ScreenScaffoldDefaults.EdgeButtonSpacing,
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for `TransformingLazyColumn`, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
edgeButton	Slot for an `EdgeButton` that takes the available space below a scrolling list. It will scale up and fade in when the user scrolls to the end of the list, and scale down and fade out as the user scrolls up.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists. The bottom padding value is always ignored because we instead use `edgeButtonSpacing` to specify the gap between edge button and content - and the `EdgeButton` hugs the bottom of the screen.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
edgeButtonSpacing	The space between `EdgeButton` and the list content
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `edgeButton` and `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists to properly offset the `EdgeButton`.

Android

@Composable
public fun ScreenScaffold(
    scrollState: TransformingLazyColumnState,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for `TransformingLazyColumn`, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists.

Android

@Composable
public fun ScreenScaffold(
    scrollState: LazyListState,
    edgeButton: @Composable BoxScope.() -> Unit,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    edgeButtonSpacing: Dp = ScreenScaffoldDefaults.EdgeButtonSpacing,
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for `androidx.compose.foundation.lazy.LazyColumn`, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
edgeButton	Slot for an `EdgeButton` that takes the available space below a scrolling list. It will scale up and fade in when the user scrolls to the end of the list, and scale down and fade out as the user scrolls up.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists. The bottom padding value is always ignored because we instead use `edgeButtonSpacing` to specify the gap between edge button and content - and the `EdgeButton` hugs the bottom of the screen.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
edgeButtonSpacing	The space between `EdgeButton` and the list content
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `edgeButton` and `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists to properly offset the `EdgeButton`.

Android

@Composable
public fun ScreenScaffold(
    scrollState: LazyListState,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for `androidx.compose.foundation.lazy.LazyColumn`, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists.

Android

@Composable
public fun ScreenScaffold(
    scrollState: ScrollState,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = {
        ScrollIndicator(scrollState, modifier = Modifier.align(Alignment.CenterEnd))
    },
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


scrollState	The scroll state for a Column, used to drive screen transitions such as `TimeText` scroll away and showing/hiding `ScrollIndicator`.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists.

Android

@Composable
public fun ScreenScaffold(
    scrollInfoProvider: ScrollInfoProvider,
    edgeButton: @Composable BoxScope.() -> Unit,
    modifier: Modifier = Modifier,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = null,
    edgeButtonSpacing: Dp = ScreenScaffoldDefaults.EdgeButtonSpacing,
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
)

Parameters


scrollInfoProvider	Provider for scroll information used to scroll away screen elements such as `TimeText` and coordinate showing/hiding the `ScrollIndicator`, this needs to be a `ScrollInfoProvider`.
edgeButton	slot for a `EdgeButton` that takes the available space below a scrolling list. It will scale up and fade in when the user scrolls to the end of the list, and scale down and fade out as the user scrolls up.
modifier	The modifier for the screen scaffold.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists. The bottom padding value is always ignored because we instead use `edgeButtonSpacing` to specify the gap between edge button and content - and the `EdgeButton` hugs the bottom of the screen.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
edgeButtonSpacing	The space between `EdgeButton` and the list content. This gap size could not be smaller then `ScreenScaffoldDefaults.EdgeButtonMinSpacing`.
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `edgeButton` and `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists to properly offset the `EdgeButton`.

Android

@Composable
public fun ScreenScaffold(
    modifier: Modifier = Modifier,
    scrollInfoProvider: ScrollInfoProvider? = null,
    contentPadding: PaddingValues = ScreenScaffoldDefaults.contentPadding,
    timeText: (@Composable () -> Unit)? = null,
    scrollIndicator: (@Composable BoxScope.() -> Unit)? = null,
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: @Composable BoxScope.(PaddingValues) -> Unit,
): Unit

Parameters


modifier	The modifier for the screen scaffold.
scrollInfoProvider	Provider for scroll information used to scroll away screen elements such as `TimeText` and coordinate showing/hiding the `ScrollIndicator`.
contentPadding	The padding to apply around the entire content. This contentPadding is then received by the `content` and should be consumed by using `Modifier.padding` or contentPadding parameter of the lazy lists.
timeText	Time text (both time and potentially status message) for this screen, if different to the time text at the `AppScaffold` level. When null, the time text from the `AppScaffold` is displayed for this screen.
scrollIndicator	The `ScrollIndicator` to display on this screen, which is expected to be aligned to Center-End. It is recommended to use the Material3 `ScrollIndicator` which is provided by default. No scroll indicator is displayed if null is passed.
overscrollEffect	the `OverscrollEffect` that will be used to render overscroll for this layout. This overscroll effect will be shared with all components within this ScreenScaffold such as `scrollIndicator` through `LocalOverscrollFactory`. If necessary, this behaviour can be disabled by passing overscrollEffect = null.
content	The body content for this screen. The lambda receives a `PaddingValues` that should be applied to the content root via `Modifier.padding` or contentPadding parameter when used with lists.