# LevitatedPaneScrim

Common/All

## Functions summary

|---|---|---|
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `@https://developer.android.com/reference/kotlin/androidx/compose/material3/adaptive/ExperimentalMaterial3AdaptiveApi @https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/compose/material3/adaptive/layout/LevitatedPaneScrim.composable#LevitatedPaneScrim(androidx.compose.ui.Modifier,kotlin.Function0,androidx.compose.ui.graphics.Color)(modifier: https://developer.android.com/reference/kotlin/androidx/compose/ui/Modifier, onClick: () -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html, color: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color)` The default scrim implementation shown with a levitated pane to block the user interaction from the underlying layout. | Cmn |

## Functions

### LevitatedPaneScrim

Cmn Artifact: [androidx.compose.material3.adaptive:adaptive-layout](https://developer.android.com/jetpack/androidx/releases/compose-material3-adaptive) [View Source](https://cs.android.com/search?q=file:androidx/compose/material3/adaptive/layout/LevitatedPaneScrim.kt+function:LevitatedPaneScrim) Added in [1.2.0](https://developer.android.com/jetpack/androidx/releases/compose-material3-adaptive#1.2.0)

```
@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 `https://developer.android.com/reference/kotlin/androidx/compose/material3/adaptive/layout/AdaptStrategy.Levitate` for more detailed info.

```kotlin
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: https://developer.android.com/reference/kotlin/androidx/compose/ui/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: () -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html = 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: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = LevitatedPaneScrimDefaults.Color` | the color of scrim, by default if `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color#Unspecified()` is provided, the pane scaffold implementation will use a translucent black color. |