1717package com.example.compose.snippets.adaptivelayouts
1818
1919import android.os.Parcelable
20+ import androidx.activity.compose.BackHandler
2021import androidx.compose.foundation.background
2122import androidx.compose.foundation.clickable
2223import androidx.compose.foundation.layout.Column
@@ -32,31 +33,30 @@ import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi
3233import androidx.compose.material3.adaptive.layout.AnimatedPane
3334import androidx.compose.material3.adaptive.layout.ListDetailPaneScaffold
3435import androidx.compose.material3.adaptive.layout.ListDetailPaneScaffoldRole
35- import androidx.compose.material3.adaptive.navigation.BackNavigationBehavior
36- import androidx.compose.material3.adaptive.navigation.NavigableListDetailPaneScaffold
37- import androidx.compose.material3.adaptive.navigation.ThreePaneScaffoldPredictiveBackHandler
3836import androidx.compose.material3.adaptive.navigation.rememberListDetailPaneScaffoldNavigator
3937import androidx.compose.runtime.Composable
40- import androidx.compose.runtime.rememberCoroutineScope
4138import androidx.compose.ui.Modifier
4239import androidx.compose.ui.graphics.Color
4340import androidx.compose.ui.tooling.preview.Preview
4441import androidx.compose.ui.unit.dp
4542import androidx.compose.ui.unit.sp
46- import kotlinx.coroutines.launch
4743import kotlinx.parcelize.Parcelize
4844
4945@OptIn(ExperimentalMaterial3AdaptiveApi ::class )
5046@Composable
51- fun SampleNavigableListDetailPaneScaffoldParts () {
47+ fun SampleListDetailPaneScaffoldParts () {
5248 // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part02]
53- val scaffoldNavigator = rememberListDetailPaneScaffoldNavigator<MyItem >()
54- val scope = rememberCoroutineScope()
49+ val navigator = rememberListDetailPaneScaffoldNavigator<MyItem >()
50+
51+ BackHandler (navigator.canNavigateBack()) {
52+ navigator.navigateBack()
53+ }
5554 // [END android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part02]
5655
5756 // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part03]
58- NavigableListDetailPaneScaffold (
59- navigator = scaffoldNavigator,
57+ ListDetailPaneScaffold (
58+ directive = navigator.scaffoldDirective,
59+ value = navigator.scaffoldValue,
6060 // [START_EXCLUDE]
6161 listPane = {},
6262 detailPane = {},
@@ -65,21 +65,16 @@ fun SampleNavigableListDetailPaneScaffoldParts() {
6565 // [END android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part03]
6666
6767 // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part04]
68- NavigableListDetailPaneScaffold (
69- navigator = scaffoldNavigator,
68+ ListDetailPaneScaffold (
69+ directive = navigator.scaffoldDirective,
70+ value = navigator.scaffoldValue,
7071 listPane = {
7172 AnimatedPane {
7273 MyList (
7374 onItemClick = { item ->
7475 // Navigate to the detail pane with the passed item
75- scope.launch {
76- scaffoldNavigator
77- .navigateTo(
78- ListDetailPaneScaffoldRole .Detail ,
79- item
80- )
81- }
82- },
76+ navigator.navigateTo(ListDetailPaneScaffoldRole .Detail , item)
77+ }
8378 )
8479 }
8580 },
@@ -90,14 +85,16 @@ fun SampleNavigableListDetailPaneScaffoldParts() {
9085 // [END android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part04]
9186
9287 // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_part05]
93- NavigableListDetailPaneScaffold (
94- navigator = scaffoldNavigator,
88+ ListDetailPaneScaffold (
89+ directive = navigator.scaffoldDirective,
90+ value = navigator.scaffoldValue,
91+ listPane =
9592 // [START_EXCLUDE]
96- listPane = {},
93+ {},
9794 // [END_EXCLUDE]
9895 detailPane = {
9996 AnimatedPane {
100- scaffoldNavigator .currentDestination?.contentKey ?.let {
97+ navigator .currentDestination?.content ?.let {
10198 MyDetails (it)
10299 }
103100 }
@@ -109,80 +106,37 @@ fun SampleNavigableListDetailPaneScaffoldParts() {
109106@OptIn(ExperimentalMaterial3AdaptiveApi ::class )
110107@Preview
111108@Composable
112- fun SampleNavigableListDetailPaneScaffoldFull () {
113- // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_full]
114- val scaffoldNavigator = rememberListDetailPaneScaffoldNavigator<MyItem >()
115- val scope = rememberCoroutineScope()
109+ fun SampleListDetailPaneScaffoldFull () {
110+ // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_full]
111+ val navigator = rememberListDetailPaneScaffoldNavigator<MyItem >()
116112
117- NavigableListDetailPaneScaffold (
118- navigator = scaffoldNavigator,
119- listPane = {
120- AnimatedPane {
121- MyList (
122- onItemClick = { item ->
123- // Navigate to the detail pane with the passed item
124- scope.launch {
125- scaffoldNavigator.navigateTo(
126- ListDetailPaneScaffoldRole .Detail ,
127- item
128- )
129- }
130- },
131- )
132- }
133- },
134- detailPane = {
135- AnimatedPane {
136- // Show the detail pane content if selected item is available
137- scaffoldNavigator.currentDestination?.contentKey?.let {
138- MyDetails (it)
139- }
140- }
141- },
142- )
143- // [END android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_full]
144- }
145-
146- @OptIn(ExperimentalMaterial3AdaptiveApi ::class )
147- @Composable
148- fun SampleListDetailPaneScaffoldWithPredictiveBackFull () {
149- // [START android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_with_pb_full]
150- val scaffoldNavigator = rememberListDetailPaneScaffoldNavigator<MyItem >()
151- val scope = rememberCoroutineScope()
152-
153- ThreePaneScaffoldPredictiveBackHandler (
154- navigator = scaffoldNavigator,
155- backBehavior = BackNavigationBehavior .PopUntilContentChange
156- )
113+ BackHandler (navigator.canNavigateBack()) {
114+ navigator.navigateBack()
115+ }
157116
158117 ListDetailPaneScaffold (
159- directive = scaffoldNavigator .scaffoldDirective,
160- scaffoldState = scaffoldNavigator.scaffoldState ,
118+ directive = navigator .scaffoldDirective,
119+ value = navigator.scaffoldValue ,
161120 listPane = {
162121 AnimatedPane {
163122 MyList (
164123 onItemClick = { item ->
165124 // Navigate to the detail pane with the passed item
166- scope.launch {
167- scaffoldNavigator.navigateTo(
168- ListDetailPaneScaffoldRole .Detail ,
169- item
170- )
171- }
125+ navigator.navigateTo(ListDetailPaneScaffoldRole .Detail , item)
172126 },
173127 )
174128 }
175129 },
176130 detailPane = {
177131 AnimatedPane {
178132 // Show the detail pane content if selected item is available
179- scaffoldNavigator .currentDestination?.contentKey ?.let {
133+ navigator .currentDestination?.content ?.let {
180134 MyDetails (it)
181135 }
182136 }
183137 },
184138 )
185- // [END android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_with_pb_full ]
139+ // [END android_compose_adaptivelayouts_sample_list_detail_pane_scaffold_full ]
186140}
187141
188142@Composable
0 commit comments