List-Detail Layouts

Material 3 Adaptive and List-Detail Layouts

Branching on the size class yourself works, but Material 3 15,533 's adaptive library (androidx.compose.material3.adaptive, 1.3.0, August 2026) ships the common layouts: ListDetailPaneScaffold for a list beside its detail and SupportingPaneScaffold for content with a side panel. (The separate material3-adaptive-navigation-suite artifact switches between a bottom bar, a rail and a drawer.) BookNest adds three artifacts from its version catalog:

app/build.gradle.kts: the adaptive libraries (excerpt)Groovy
    implementation(libs.adaptive)
    implementation(libs.adaptive.layout)
    implementation(libs.adaptive.navigation)

A ListDetailPaneScaffold decides from the window how many panes fit. Its navigator records which pane was opened with which content key; on a phone, navigating to the detail replaces the list, and Back returns to it. On a wide window both panes show and navigation only changes the detail. NavigableListDetailPaneScaffold wires the navigator to the system Back gesture, including predictive back.