rework Scaffold to avoid Subscompose & fix insets consumption

closes #500
closes #376

Author: hrach

ui/src/androidMain/kotlin/kiwi/orbit/compose/ui/controls/Scaffold.kt

@@ -2,38 +2,43 @@ package kiwi.orbit.compose.ui.controls
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.ExperimentalLayoutApi
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
-import androidx.compose.foundation.layout.asPaddingValues
-import androidx.compose.foundation.layout.calculateEndPadding
-import androidx.compose.foundation.layout.calculateStartPadding
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.ime
-import androidx.compose.foundation.layout.isImeVisible
 import androidx.compose.foundation.layout.systemBars
-import androidx.compose.foundation.layout.union
+import androidx.compose.foundation.layout.windowInsetsBottomHeight
+import androidx.compose.foundation.layout.windowInsetsEndWidth
+import androidx.compose.foundation.layout.windowInsetsPadding
+import androidx.compose.foundation.layout.windowInsetsStartWidth
+import androidx.compose.foundation.layout.windowInsetsTopHeight
 import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.layout.AlignmentLine
 import androidx.compose.ui.layout.HorizontalAlignmentLine
 import androidx.compose.ui.layout.Layout
-import androidx.compose.ui.layout.SubcomposeLayout
 import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.unit.Constraints
 import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.offset
 import kiwi.orbit.compose.ui.OrbitTheme
 import kiwi.orbit.compose.ui.controls.internal.CustomPlaceholder
 import kiwi.orbit.compose.ui.controls.internal.OrbitPreviews
 import kiwi.orbit.compose.ui.controls.internal.Preview
 import kiwi.orbit.compose.ui.foundation.contentColorFor
+import kotlin.math.min
+import kotlin.math.roundToInt
 
 /**
  * Scaffold helps layouting basic screen widgets, such as [TopAppBar], [action] and the [content].
@@ -43,6 +48,8 @@ import kiwi.orbit.compose.ui.foundation.contentColorFor
  *
  * Utilize contentPadding passed to [content] lambda to handle IME, navigation or status bar paddings.
  * If you define your own [actionLayout], do not forget to handle IME and navigation bar insets in it.
+ *
+ * The [contentWindowInsets] allows disabling handling IME insets and keep the Scaffold unaffected.
  */
 @Composable
 public fun Scaffold(
@@ -59,7 +66,7 @@ public fun Scaffold(
     },
     toastHostState: ToastHostState = remember { ToastHostState() },
     toastHost: @Composable (ToastHostState) -> Unit = { ToastHost(it) },
-    contentWindowInsets: WindowInsets = WindowInsets.systemBars.union(WindowInsets.ime),
+    contentWindowInsets: WindowInsets = WindowInsets.ime,
     content: @Composable (contentPadding: PaddingValues) -> Unit,
 ) {
     Surface(
@@ -77,7 +84,6 @@ public fun Scaffold(
     }
 }
 
-@OptIn(ExperimentalLayoutApi::class)
 @Composable
 private fun ScaffoldLayout(
     topBar: @Composable () -> Unit,
@@ -86,62 +92,88 @@ private fun ScaffoldLayout(
     content: @Composable (contentPadding: PaddingValues) -> Unit,
     contentWindowInsets: WindowInsets,
 ) {
-    val imeOpened = WindowInsets.isImeVisible
-    SubcomposeLayout { constraints ->
+    var topContentPadding by remember { mutableStateOf(0.dp) }
+    var startContentPadding by remember { mutableStateOf(0.dp) }
+    var endContentPadding by remember { mutableStateOf(0.dp) }
+    var bottomContentPadding by remember { mutableStateOf(0.dp) }
+    val contentPadding = remember {
+        object : PaddingValues {
+            override fun calculateLeftPadding(layoutDirection: LayoutDirection): Dp =
+                when (layoutDirection) {
+                    LayoutDirection.Ltr -> startContentPadding
+                    LayoutDirection.Rtl -> endContentPadding
+                }
+
+            override fun calculateTopPadding(): Dp = topContentPadding
+            override fun calculateRightPadding(layoutDirection: LayoutDirection): Dp =
+                when (layoutDirection) {
+                    LayoutDirection.Ltr -> endContentPadding
+                    LayoutDirection.Rtl -> startContentPadding
+                }
+
+            override fun calculateBottomPadding(): Dp = bottomContentPadding
+        }
+    }
+
+    Layout(
+        modifier = Modifier.windowInsetsPadding(contentWindowInsets),
+        contents = listOf(
+            { Spacer(Modifier.windowInsetsTopHeight(WindowInsets.systemBars)) },
+            { Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.systemBars)) },
+            { Spacer(Modifier.windowInsetsStartWidth(WindowInsets.systemBars)) },
+            { Spacer(Modifier.windowInsetsEndWidth(WindowInsets.systemBars)) },
+            topBar,
+            toast,
+            action,
+            { content(contentPadding) },
+        ),
+    ) { measurables, constraints ->
         val layoutWidth = constraints.maxWidth
         val layoutHeight = constraints.maxHeight
-        val looseConstraints = constraints.copy(minWidth = 0, minHeight = 0)
+        val looseConstraint = constraints.copy(minWidth = 0, minHeight = 0)
+
+        // Measure insets separately and reuse for computation when needed
+        val insetTop = measurables[0][0].measure(looseConstraint).height
+        val insetBottom = measurables[1][0].measure(looseConstraint).height
+        val insetStart = measurables[2][0].measure(looseConstraint).width
+        val insetEnd = measurables[3][0].measure(looseConstraint).width
+
+        // Measure top bar
+        val topBarPlaceables = measurables[4].map { it.measure(looseConstraint) }
 
-        val topBarPlaceables = subcompose(SlotTopAppBar, topBar).map { it.measure(looseConstraints) }
+        // Calculate the space for action, it is limited to 80% of the available height.
         val topBarHeight = topBarPlaceables.maxOfOrNull { it.height } ?: 0
+        val actionTop = if (topBarHeight != 0) topBarHeight else insetTop
+        val maxActionHeight = ((layoutHeight - actionTop) * 0.8).roundToInt()
+        val actionConstraints = looseConstraint.copy(maxHeight = maxActionHeight)
 
-        val maxActionRatio = 0.8f
-        val maxActionHeight = (layoutHeight - topBarHeight) * maxActionRatio
-        val actionConstraints = looseConstraints.copy(maxHeight = maxActionHeight.toInt())
-        val actionPlaceables = subcompose(SlotAction, action).map { it.measure(actionConstraints) }
+        // Measure action
+        val actionPlaceables = measurables[6].map { it.measure(actionConstraints) }
+
+        // Calculate the space for content and toast.
+        val actionFadeHeight = actionPlaceables.firstOrNull()?.get(ActionFadeLine)
+            ?.takeIf { it >= 0 } ?: 0
         val actionHeight = actionPlaceables.maxOfOrNull { it.height } ?: 0
-        val actionFadeHeight = actionPlaceables.firstOrNull()?.get(ActionFadeLine)?.let { value ->
-            if (value == AlignmentLine.Unspecified) 0 else value
-        } ?: 0
 
-        val contentInsets = contentWindowInsets.asPaddingValues(this)
-        val contentBottom = if (actionHeight > 0) {
-            (actionHeight - actionFadeHeight)
-        } else {
-            if (imeOpened) contentInsets.calculateBottomPadding().roundToPx() else 0
-        }
-        val contentConstraints = looseConstraints.copy(
-            maxHeight = layoutHeight - topBarHeight - contentBottom,
-        )
-        val innerPadding = PaddingValues(
-            top = if (topBarHeight > 0) {
-                0.dp
-            } else {
-                contentInsets.calculateTopPadding()
-            },
-            bottom = if (actionHeight > 0) {
-                actionFadeHeight.toDp()
-            } else {
-                if (imeOpened) {
-                    0.dp
-                } else {
-                    contentInsets.calculateBottomPadding()
-                }
-            },
-            start = contentInsets.calculateStartPadding(layoutDirection),
-            end = contentInsets.calculateEndPadding(layoutDirection),
-        )
-        val contentPlaceables = subcompose(SlotContent) {
-            content(innerPadding)
-        }.map { it.measure(contentConstraints) }
+        // If there is fade, let's do not subtract it, we want content to be shown bellow it.
+        val maxContentHeight = layoutHeight - topBarHeight - actionHeight + actionFadeHeight
+        val contentConstraints = Constraints(maxHeight = maxContentHeight, maxWidth = layoutWidth)
+
+        // Update insets paddings for content before measuring it.
+        topContentPadding = if (topBarHeight == 0) insetTop.toDp() else 0.dp
+        bottomContentPadding = if (actionHeight == 0) insetBottom.toDp() else actionFadeHeight.toDp()
+        startContentPadding = insetStart.toDp()
+        endContentPadding = insetEnd.toDp()
 
-        val toastPlaceables = subcompose(SlotToast, toast).map { it.measure(looseConstraints) }
+        // Measure toast and content.
+        val toastPlaceables = measurables[5].map { it.measure(contentConstraints) }
+        val contentPlaceables = measurables[7].map { it.measure(contentConstraints) }
 
         layout(layoutWidth, layoutHeight) {
-            contentPlaceables.forEach { it.placeRelative(0, topBarHeight) }
-            topBarPlaceables.forEach { it.placeRelative(0, 0) }
-            actionPlaceables.forEach { it.placeRelative(0, layoutHeight - actionHeight) }
-            toastPlaceables.forEach { it.placeRelative(0, topBarHeight) }
+            contentPlaceables.forEach { it.placeRelative(x = 0, y = topBarHeight) }
+            topBarPlaceables.forEach { it.placeRelative(x = 0, y = 0) }
+            actionPlaceables.forEach { it.placeRelative(x = 0, y = layoutHeight - actionHeight) }
+            toastPlaceables.forEach { it.placeRelative(x = 0, y = topBarHeight) }
         }
     }
 }
@@ -154,7 +186,7 @@ private fun ScaffoldLayout(
 public fun ScaffoldAction(
     modifier: Modifier = Modifier,
     backgroundColor: Color = OrbitTheme.colors.surface.main,
-    contentWindowInsets: WindowInsets = WindowInsets.systemBars.union(WindowInsets.ime),
+    contentWindowInsets: WindowInsets = WindowInsets.systemBars,
     fadeHeight: Dp = DefaultActionFadeHeight,
     content: @Composable () -> Unit,
 ) {
@@ -165,13 +197,13 @@ public fun ScaffoldAction(
             endY = with(density) { fadeHeight.toPx() },
         )
     }
-    val inset = contentWindowInsets.asPaddingValues()
     Layout(
         modifier = modifier.background(brush),
         content = {
             Box(Modifier.fillMaxWidth(), propagateMinConstraints = true) {
                 content()
             }
+            Spacer(Modifier.windowInsetsBottomHeight(contentWindowInsets))
         },
     ) { measurables, constraints ->
         val padding = 16.dp.roundToPx()
@@ -188,21 +220,20 @@ public fun ScaffoldAction(
             return@Layout layout(0, 0) {}
         }
 
+        val inset = measurables.last().measure(constraints.copy(minWidth = 0, minHeight = 0))
         val width = constraints.maxWidth
-        val height = top + action.height + padding + inset.calculateBottomPadding().roundToPx()
+        val height = top + action.height + padding + inset.height
 
         layout(width, height, alignmentLines = mapOf(ActionFadeLine to top)) {
             action.place(x = (width - action.width) / 2, y = top)
         }
     }
 }
 
-private val ActionFadeLine = HorizontalAlignmentLine(::minOf)
-
-private const val SlotTopAppBar = 0
-private const val SlotAction = 1
-private const val SlotToast = 2
-private const val SlotContent = 3
+/**
+ * Models the height of the fading gradient - how much should be the content shifted under the action slot.
+ */
+public val ActionFadeLine: HorizontalAlignmentLine = HorizontalAlignmentLine(::min)
 
 /**
  * Action's top gradient currently decreased from 16.dp to minimize contentPadding