Adding support for portrait orientation in tutorial selection screen

Extracting three tutorial buttons to separate composable and making its parent depend on the orientation.
If we're in landscape they are positioned horizontally and otherwise vertically.
Note this change still doesn't remove enforcing landscape orientation from AndroidManifest so for now it's still letterboxed in portrait.

Also drive-by fix for inset paddings.

Fixes: 369829466
Bug: 376020472
Test: screenshots
Flag: com.android.systemui.shared.new_touchpad_gestures_tutorial
Change-Id: Ie5417409f896703dd5d60d0357f256701f5f5de4

1 files changed, 84 insertions, 31 deletions

diff --git a/packages/SystemUI/src/com/android/systemui/touchpad/tutorial/ui/composable/TutorialSelectionScreen.kt b/packages/SystemUI/src/com/android/systemui/touchpad/tutorial/ui/composable/TutorialSelectionScreen.kt
index c2093114c98f..d371acf86a28 100644
--- a/packages/SystemUI/src/com/android/systemui/touchpad/tutorial/ui/composable/TutorialSelectionScreen.kt
+++ b/packages/SystemUI/src/com/android/systemui/touchpad/tutorial/ui/composable/TutorialSelectionScreen.kt
@@ -16,15 +16,16 @@
 
 package com.android.systemui.touchpad.tutorial.ui.composable
 
+import android.content.res.Configuration
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.safeDrawingPadding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
@@ -40,6 +41,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.input.pointer.pointerInteropFilter
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.res.vectorResource
 import androidx.compose.ui.unit.dp
@@ -60,6 +62,7 @@ fun TutorialSelectionScreen(
         modifier =
             Modifier.background(color = MaterialTheme.colorScheme.surfaceContainer)
                 .fillMaxSize()
+                .safeDrawingPadding()
                 .pointerInteropFilter(
                     onTouchEvent = { event ->
                         // Because of window flag we're intercepting 3 and 4-finger swipes.
@@ -69,12 +72,26 @@ fun TutorialSelectionScreen(
                     }
                 ),
     ) {
-        TutorialSelectionButtons(
-            onBackTutorialClicked = onBackTutorialClicked,
-            onHomeTutorialClicked = onHomeTutorialClicked,
-            onRecentAppsTutorialClicked = onRecentAppsTutorialClicked,
-            modifier = Modifier.padding(60.dp),
-        )
+        val configuration = LocalConfiguration.current
+        when (configuration.orientation) {
+            Configuration.ORIENTATION_LANDSCAPE -> {
+                HorizontalSelectionButtons(
+                    onBackTutorialClicked = onBackTutorialClicked,
+                    onHomeTutorialClicked = onHomeTutorialClicked,
+                    onRecentAppsTutorialClicked = onRecentAppsTutorialClicked,
+                    modifier = Modifier.weight(1f).padding(60.dp),
+                )
+            }
+            else -> {
+                VerticalSelectionButtons(
+                    onBackTutorialClicked = onBackTutorialClicked,
+                    onHomeTutorialClicked = onHomeTutorialClicked,
+                    onRecentAppsTutorialClicked = onRecentAppsTutorialClicked,
+                    modifier = Modifier.weight(1f).padding(60.dp),
+                )
+            }
+        }
+        // because other composables have weight 1, Done button will be positioned first
         DoneButton(
             onDoneButtonClicked = onDoneButtonClicked,
             modifier = Modifier.padding(horizontal = 60.dp),
@@ -83,7 +100,7 @@ fun TutorialSelectionScreen(
 }
 
 @Composable
-private fun TutorialSelectionButtons(
+private fun HorizontalSelectionButtons(
     onBackTutorialClicked: () -> Unit,
     onHomeTutorialClicked: () -> Unit,
     onRecentAppsTutorialClicked: () -> Unit,
@@ -94,34 +111,70 @@ private fun TutorialSelectionButtons(
         verticalAlignment = Alignment.CenterVertically,
         modifier = modifier,
     ) {
-        TutorialButton(
-            text = stringResource(R.string.touchpad_tutorial_home_gesture_button),
-            icon = ImageVector.vectorResource(id = R.drawable.touchpad_tutorial_home_icon),
-            iconColor = MaterialTheme.colorScheme.onPrimary,
-            onClick = onHomeTutorialClicked,
-            backgroundColor = MaterialTheme.colorScheme.primary,
-            modifier = Modifier.weight(1f),
+        ThreeTutorialButtons(
+            onBackTutorialClicked,
+            onHomeTutorialClicked,
+            onRecentAppsTutorialClicked,
+            modifier = Modifier.weight(1f).fillMaxSize(),
         )
-        TutorialButton(
-            text = stringResource(R.string.touchpad_tutorial_back_gesture_button),
-            icon = Icons.AutoMirrored.Outlined.ArrowBack,
-            iconColor = MaterialTheme.colorScheme.onTertiary,
-            onClick = onBackTutorialClicked,
-            backgroundColor = MaterialTheme.colorScheme.tertiary,
-            modifier = Modifier.weight(1f),
-        )
-        TutorialButton(
-            text = stringResource(R.string.touchpad_tutorial_recent_apps_gesture_button),
-            icon = ImageVector.vectorResource(id = R.drawable.touchpad_tutorial_recents_icon),
-            iconColor = MaterialTheme.colorScheme.onSecondary,
-            onClick = onRecentAppsTutorialClicked,
-            backgroundColor = MaterialTheme.colorScheme.secondary,
-            modifier = Modifier.weight(1f),
+    }
+}
+
+@Composable
+private fun VerticalSelectionButtons(
+    onBackTutorialClicked: () -> Unit,
+    onHomeTutorialClicked: () -> Unit,
+    onRecentAppsTutorialClicked: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        verticalArrangement = Arrangement.spacedBy(20.dp),
+        horizontalAlignment = Alignment.CenterHorizontally,
+        modifier = modifier,
+    ) {
+        ThreeTutorialButtons(
+            onBackTutorialClicked,
+            onHomeTutorialClicked,
+            onRecentAppsTutorialClicked,
+            modifier = Modifier.weight(1f).fillMaxSize(),
         )
     }
 }
 
 @Composable
+private fun ThreeTutorialButtons(
+    onBackTutorialClicked: () -> Unit,
+    onHomeTutorialClicked: () -> Unit,
+    onRecentAppsTutorialClicked: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    TutorialButton(
+        text = stringResource(R.string.touchpad_tutorial_home_gesture_button),
+        icon = ImageVector.vectorResource(id = R.drawable.touchpad_tutorial_home_icon),
+        iconColor = MaterialTheme.colorScheme.onPrimary,
+        onClick = onHomeTutorialClicked,
+        backgroundColor = MaterialTheme.colorScheme.primary,
+        modifier = modifier,
+    )
+    TutorialButton(
+        text = stringResource(R.string.touchpad_tutorial_back_gesture_button),
+        icon = Icons.AutoMirrored.Outlined.ArrowBack,
+        iconColor = MaterialTheme.colorScheme.onTertiary,
+        onClick = onBackTutorialClicked,
+        backgroundColor = MaterialTheme.colorScheme.tertiary,
+        modifier = modifier,
+    )
+    TutorialButton(
+        text = stringResource(R.string.touchpad_tutorial_recent_apps_gesture_button),
+        icon = ImageVector.vectorResource(id = R.drawable.touchpad_tutorial_recents_icon),
+        iconColor = MaterialTheme.colorScheme.onSecondary,
+        onClick = onRecentAppsTutorialClicked,
+        backgroundColor = MaterialTheme.colorScheme.secondary,
+        modifier = modifier,
+    )
+}
+
+@Composable
 private fun TutorialButton(
     text: String,
     icon: ImageVector,
@@ -134,7 +187,7 @@ private fun TutorialButton(
         onClick = onClick,
         shape = RoundedCornerShape(16.dp),
         colors = ButtonDefaults.buttonColors(containerColor = backgroundColor),
-        modifier = modifier.aspectRatio(0.66f),
+        modifier = modifier,
     ) {
         Column(
             verticalArrangement = Arrangement.Center,