Support Large screen

app-catalog/samples/compose/src/main/java/com/google.android.catalog.app.compose/ComposeSample.kt

@@ -20,6 +20,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import com.google.android.catalog.framework.annotations.Sample
 
@@ -30,7 +31,7 @@ import com.google.android.catalog.framework.annotations.Sample
 )
 @Composable
 fun ComposeSample() {
-    Box(Modifier.fillMaxSize()) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         Text(text = "Hi, I am a compose sample target!")
     }
 }

app-catalog/samples/multiple/src/main/java/com/google.android.catalog.app.multiple/DeprecatedSample.kt

@@ -20,6 +20,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import com.google.android.catalog.framework.annotations.Sample
 
@@ -30,7 +31,7 @@ import com.google.android.catalog.framework.annotations.Sample
 @Sample(name = "Deprecated sample", "Shows how a sample can be deprecated")
 @Composable
 fun DeprecatedSample() {
-    Box(Modifier.fillMaxSize()) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         Text(text = "Hi, you won't see me!")
     }
 }

app-catalog/samples/multiple/src/main/java/com/google.android.catalog.app.multiple/FirstSample.kt

@@ -20,6 +20,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import com.google.android.catalog.framework.annotations.Sample
 
@@ -31,7 +32,7 @@ import com.google.android.catalog.framework.annotations.Sample
 )
 @Composable
 fun FirstSample() {
-    Box(Modifier.fillMaxSize()) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         Text(text = "Hi, I am the first sample!")
     }
 }

app-catalog/samples/multiple/src/main/java/com/google.android.catalog.app.multiple/SameFileSamples.kt

@@ -20,21 +20,22 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import com.google.android.catalog.framework.annotations.Sample
 
 @Sample(name = "Same file sample 1", "Show how a file can contain multiple samples")
 @Composable
 fun SameFileSample1() {
-    Box(Modifier.fillMaxSize()) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         Text(text = "Hi, I am same file sample 1")
     }
 }
 
 @Sample(name = "Same file sample 2", "Show how a file can contain multiple samples")
 @Composable
 fun SameFileSample2() {
-    Box(Modifier.fillMaxSize()) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         Text(text = "Hi, I am same file sample 2")
     }
 }

app-catalog/samples/multiple/src/main/java/com/google.android.catalog.app.multiple/SecondSample.kt

@@ -22,6 +22,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import com.google.android.catalog.framework.annotations.Sample
 
@@ -34,7 +35,7 @@ import com.google.android.catalog.framework.annotations.Sample
 @RequiresApi(Build.VERSION_CODES.S)
 @Composable
 fun SecondSample() {
-    Box(Modifier.fillMaxSize()) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         Text(text = "Hi, I am the Second sample only available in Android 12!")
     }
 }

framework/ui/api/current.api

@@ -46,7 +46,6 @@ package com.google.android.catalog.framework.ui {
   }
 
   public final class CatalogNavigationKt {
-    method @androidx.compose.runtime.Composable public static void CatalogNavigation(String startDestination, java.util.Set<com.google.android.catalog.framework.base.CatalogSample> samples, com.google.android.catalog.framework.ui.CatalogSettings settings, androidx.fragment.app.FragmentManager fragmentManager);
   }
 
   public sealed interface CatalogOrder {
@@ -99,11 +98,19 @@ package com.google.android.catalog.framework.ui {
 
 package com.google.android.catalog.framework.ui.components {
 
+  public final class AdaptivePaneKt {
+  }
+
   public final class CardItemKt {
   }
 
   public final class CatalogTopAppBarKt {
-    method @androidx.compose.runtime.Composable public static void CatalogTopAppBar(optional com.google.android.catalog.framework.base.CatalogSample? selectedSample, optional kotlin.jvm.functions.Function0<kotlin.Unit> onSearch, optional kotlin.jvm.functions.Function0<kotlin.Unit> onBackClick);
+    method @androidx.compose.runtime.Composable public static void CatalogTopAppBar(optional com.google.android.catalog.framework.base.CatalogSample? selectedSample, optional kotlin.jvm.functions.Function0<kotlin.Unit> onSearch, optional kotlin.jvm.functions.Function0<kotlin.Unit> onExpand, optional kotlin.jvm.functions.Function0<kotlin.Unit> onBackClick);
+  }
+
+  public final class CompositionLocalsKt {
+    method public static error.NonExistentClass! getLocalWindowSize();
+    method @androidx.compose.runtime.Composable public static boolean isExpandedScreen();
   }
 
   public final class FilterTabRowKt {

framework/ui/build.gradle

@@ -96,7 +96,9 @@ dependencies {
     implementation libs.androidx.fragment
     implementation libs.androidx.navigation.compose
     implementation libs.compose.ui.ui
-    implementation libs.compose.material3
+    implementation libs.compose.material.material3
+    implementation libs.compose.material.window3
+    implementation libs.compose.material.iconsext
 
     androidTestImplementation libs.androidx.test.runner
     testImplementation libs.androidx.test.runner

framework/ui/src/main/java/com/google/android/catalog/framework/ui/CatalogActivity.kt

@@ -21,9 +21,13 @@ import androidx.activity.compose.setContent
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
+import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
+import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.fragment.app.FragmentActivity
 import com.google.android.catalog.framework.base.CatalogSample
+import com.google.android.catalog.framework.ui.components.LocalWindowSize
 import com.google.android.catalog.framework.ui.theme.CatalogTheme
 import javax.inject.Inject
 
@@ -62,6 +66,7 @@ open class CatalogActivity : FragmentActivity() {
      */
     open val settings: CatalogSettings = CatalogSettings()
 
+    @OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         // Ensure that the declaring activity theme don't show an actionbar
@@ -75,12 +80,15 @@ open class CatalogActivity : FragmentActivity() {
                     modifier = Modifier.fillMaxSize(),
                     color = MaterialTheme.colorScheme.background
                 ) {
-                    CatalogNavigation(
-                        startDestination = startDestination,
-                        samples = catalogSamples,
-                        settings = settings,
-                        fragmentManager = supportFragmentManager,
-                    )
+                    val sizeClass = calculateWindowSizeClass(this)
+                    CompositionLocalProvider(LocalWindowSize provides sizeClass) {
+                        CatalogNavigation(
+                            startDestination = startDestination,
+                            samples = catalogSamples,
+                            settings = settings,
+                            fragmentManager = supportFragmentManager
+                        )
+                    }
                 }
             }
         }

framework/ui/src/main/java/com/google/android/catalog/framework/ui/CatalogNavigation.kt

@@ -38,30 +38,35 @@ import com.google.android.catalog.framework.ui.components.CatalogTopAppBar
 import com.google.android.catalog.framework.ui.components.FragmentContainer
 
 @Composable
-fun CatalogNavigation(
+internal fun CatalogNavigation(
     startDestination: String,
     samples: Set<CatalogSample>,
     settings: CatalogSettings,
     fragmentManager: FragmentManager
 ) {
     val navController = rememberNavController()
+
     NavHost(
         modifier = Modifier.background(MaterialTheme.colorScheme.background),
         navController = navController,
         startDestination = startDestination
     ) {
         // Add the home destination
         composable(CATALOG_DESTINATION) {
-            CatalogScreen(samples.toList(), settings) {
+            CatalogScreen(samples.toList(), settings, fragmentManager) {
                 navController.navigate(it.route)
             }
         }
 
         // Add all the samples
         samples.forEach { sample ->
-            addTargets(sample, fragmentManager, settings) {
-                navController.popBackStack()
-            }
+            addTargets(
+                sample = sample,
+                fragmentManager = fragmentManager,
+                settings = settings,
+                onExpand = { navController.navigate(it.route) },
+                onBackClick = navController::popBackStack
+            )
         }
     }
 }
@@ -70,20 +75,31 @@ private fun NavGraphBuilder.addTargets(
     sample: CatalogSample,
     fragmentManager: FragmentManager,
     settings: CatalogSettings,
-    onBackClick: () -> Unit
+    onExpand: (CatalogSample) -> Unit,
+    onBackClick: () -> Unit,
 ) {
     when (val target = sample.target) {
         is CatalogTarget.TargetComposable -> {
             composable(sample.route) {
-                SampleScaffold(sample = sample, settings = settings, onBackClick = onBackClick) {
+                SampleScaffold(
+                    sample = sample,
+                    settings = settings,
+                    onExpand = { onExpand(sample) },
+                    onBackClick = onBackClick,
+                ) {
                     target.composable()
                 }
             }
         }
 
         is CatalogTarget.TargetFragment -> {
             composable(sample.route) {
-                SampleScaffold(sample = sample, settings = settings, onBackClick = onBackClick) {
+                SampleScaffold(
+                    sample = sample,
+                    settings = settings,
+                    onExpand = { onExpand(sample) },
+                    onBackClick = onBackClick
+                ) {
                     FragmentContainer(
                         modifier = Modifier.fillMaxSize(),
                         fragmentManager = fragmentManager,
@@ -109,14 +125,17 @@ private fun NavGraphBuilder.addTargets(
 private fun SampleScaffold(
     sample: CatalogSample,
     settings: CatalogSettings,
+    onExpand: () -> Unit,
     onBackClick: () -> Unit,
-    content: @Composable BoxScope.() -> Unit
+    content: @Composable() (BoxScope.() -> Unit)
 ) {
     Scaffold(
         topBar = {
             if (settings.alwaysShowToolbar) {
                 CatalogTopAppBar(
-                    selectedSample = sample, onBackClick = onBackClick
+                    selectedSample = sample,
+                    onExpand = onExpand,
+                    onBackClick = onBackClick
                 )
             }
         },