LevitatedPaneScrim

Functions summary

Unit

The default scrim implementation shown with a levitated pane to block the user interaction from the underlying layout.

Cmn

Functions

LevitatedPaneScrim

@ExperimentalMaterial3AdaptiveApi
@Composable
fun LevitatedPaneScrim(
    modifier: Modifier = Modifier,
    onClick: () -> Unit = LevitatedPaneScrimDefaults.onClickAction,
    color: Color = LevitatedPaneScrimDefaults.Color
): Unit

The default scrim implementation shown with a levitated pane to block the user interaction from the underlying layout. See AdaptStrategy.Levitate for more detailed info.

import androidx.compose.material3.Scaffold
import androidx.compose.material3.adaptive.currentWindowAdaptiveInfoV2
import androidx.compose.material3.adaptive.layout.AdaptStrategy
import androidx.compose.material3.adaptive.layout.LevitatedPaneScrim
import androidx.compose.material3.adaptive.layout.ListDetailPaneScaffold
import androidx.compose.material3.adaptive.layout.SupportingPaneScaffold
import androidx.compose.material3.adaptive.layout.SupportingPaneScaffoldDefaults
import androidx.compose.material3.adaptive.layout.calculatePaneScaffoldDirective
import androidx.compose.material3.adaptive.navigation.ThreePaneScaffoldNavigator
import androidx.compose.material3.adaptive.navigation.rememberListDetailPaneScaffoldNavigator
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.onClick
import androidx.compose.ui.semantics.semantics

val coroutineScope = rememberCoroutineScope()
val scaffoldDirective = calculatePaneScaffoldDirective(currentWindowAdaptiveInfoV2())
var navigator: ThreePaneScaffoldNavigator<T>? = null
val onClick: () -> Unit = { coroutineScope.launch { navigator?.navigateBack() } }
navigator =
    rememberListDetailPaneScaffoldNavigator<T>(
        scaffoldDirective = scaffoldDirective,
        adaptStrategies =
            SupportingPaneScaffoldDefaults.adaptStrategies(
                extraPaneAdaptStrategy =
                    AdaptStrategy.Levitate(
                            alignment = Alignment.Center,
                            scrim = {
                                LevitatedPaneScrim(
                                    Modifier.semantics {
                                        contentDescription = "Scrim"
                                        this.onClick("Dismiss the extra pane") {
                                            onClick()
                                            true
                                        }
                                    },
                                    onClick = onClick,
                                )
                            },
                        )
                        .onlyIfSinglePane(scaffoldDirective)
            ),
    )
return navigator
Parameters
modifier: Modifier = Modifier

the additional modifiers to apply to the scrim; note that we will set up the size, color, and clicking behavior of the scrim via default modifiers, and custom modifiers provided here might interfere with the default behavior.

onClick: () -> Unit = LevitatedPaneScrimDefaults.onClickAction

the on-click listener of the scrim; usually used to dismiss the levitated pane; i.e. remove the pane from the top of the destination history. By default this will be an empty lambda, which simply blocks the user interaction from the underlying layout.

color: Color = LevitatedPaneScrimDefaults.Color

the color of scrim, by default if Color.Unspecified is provided, the pane scaffold implementation will use a translucent black color.