IssueTracker

1.1 snapshot: 12421028

If you enable predictive back and use a NavigableListDetailPaneScaffold, dragging the gesture to start it and then moving back to the original position to release and cancel it results in a weird limbo state. The modifiers from the list pane will be used but the content won't, so it doesn't seem to reset to details correctly.

Sample code:

@OptIn(ExperimentalMaterial3AdaptiveApi::class)
@Composable
fun ExampleNldps(modifier: Modifier = Modifier) {
    val scaffoldNavigator = rememberListDetailPaneScaffoldNavigator()
    val detailBgColor = remember { mutableStateOf(Color.LightGreen) }
    val scope = rememberCoroutineScope()

    NavigableListDetailPaneScaffold(
        navigator = scaffoldNavigator,
        modifier = modifier,
        listPane = {
            AnimatedPane(
                Modifier
                    .background(Color.LightRed)
                    .safeContentPadding()) {
                Column {
                    Text("This is the list pane", fontSize = 24.sp)
                    Spacer(Modifier.size(24.dp))

                    if (scaffoldNavigator.scaffoldValue[ListDetailPaneScaffoldRole.Detail] == PaneAdaptedValue.Hidden) {
                        Button(onClick = {
                            scope.launch {
                                scaffoldNavigator.navigateTo(ListDetailPaneScaffoldRole.Detail)
                            }
                        }) {
                            Text("Show detail pane")
                        }
                    }
                }
            }
        },
        detailPane = {
            AnimatedPane(
                Modifier
                    .background(detailBgColor.value)
                    .safeContentPadding()
            ) {
                Column {
                    Text("This is the detail pane", fontSize = 24.sp)
                    Spacer(modifier = Modifier.size(24.dp))
                    Text("Anchors at 0%, 50%, and 100%")
                }
            }
        },
        extraPane = {
            AnimatedPane {
                Text(
                    modifier = Modifier
                        .background(Color.LightBlue)
                        .safeContentPadding(),
                    text = "Extra"
                )
            }
        },
        paneExpansionState = rememberPaneExpansionState(
            keyProvider = scaffoldNavigator.scaffoldValue,
            anchors = listOf(
                PaneExpansionAnchor.Proportion(0.0f),
                PaneExpansionAnchor.Proportion(0.5f),
                PaneExpansionAnchor.Proportion(1.0f),
            )
        ),
        paneExpansionDragHandle = { state ->
            PaneExpansionDragHandle(state = state, color = MaterialTheme.colorScheme.outline)
        }
    )
}

val Color.Companion.LightRed: Color
    get() = Color(red = 1f, green = 0.8f, blue = 0.8f, alpha = 1f)
val Color.Companion.LightGreen: Color
    get() = Color(red = 0.8f, green = 1f, blue = 0.8f, alpha = 1f)
val Color.Companion.LightBlue: Color
    get() = Color(red = 0.8f, green = 0.8f, blue = 1f, alpha = 1f)