Fix gap; padding measurements for containers; empty containers; AGP upgrade

Author: ObsidianX

app/src/main/java/net/obsidianx/chakra/MainActivity.kt

@@ -36,17 +36,6 @@ enum class Page {
     UpdateContents,
 }
 
-@Composable
-fun Test(modifier: Modifier = Modifier) {
-    Flexbox(modifier = modifier
-        .flex {
-            debugTag("in")
-            padding(4.dp)
-        }
-        .border(1.dp, Color.Red)) {
-    }
-}
-
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)

build.gradle

@@ -1,6 +1,6 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 plugins {
-    id 'com.android.application' version '8.0.2' apply false
-    id 'com.android.library' version '8.0.2' apply false
+    id 'com.android.application' version '8.1.0' apply false
+    id 'com.android.library' version '8.1.0' apply false
     id 'org.jetbrains.kotlin.android' version '1.8.10' apply false
-}
+}

library/build.gradle

@@ -67,7 +67,7 @@ publishing {
         release(MavenPublication) {
             groupId = 'com.github.obsidianx'
             artifactId = 'chakra'
-            version = '0.2.6'
+            version = '0.2.7'
 
             afterEvaluate {
                 from components.release

library/src/main/java/net/obsidianx/chakra/Flexbox.kt

@@ -7,9 +7,11 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.UiComposable
 import androidx.compose.ui.layout.MultiMeasureLayout
 import androidx.compose.ui.layout.layout
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.inspectable
 import androidx.compose.ui.unit.Constraints
 import androidx.compose.ui.util.fastForEach
 import androidx.compose.ui.util.fastForEachIndexed
@@ -28,6 +30,7 @@ import net.obsidianx.chakra.layout.asFloatOrZero
 import net.obsidianx.chakra.layout.getConstraints
 import net.obsidianx.chakra.layout.horizontalGap
 import net.obsidianx.chakra.layout.horizontalPadding
+import net.obsidianx.chakra.layout.isContainer
 import net.obsidianx.chakra.layout.isSet
 import net.obsidianx.chakra.layout.measureNode
 import net.obsidianx.chakra.layout.removeAllChildren
@@ -40,9 +43,9 @@ import kotlin.math.max
 import kotlin.math.roundToInt
 
 @Composable
-fun FlexboxScope.Flexbox(
+inline fun FlexboxScope.Flexbox(
     modifier: Modifier = Modifier,
-    content: @Composable FlexboxScope.() -> Unit = {}
+    crossinline content: @Composable FlexboxScope.() -> Unit = {}
 ) {
     Flexbox(
         modifier = modifier,
@@ -52,6 +55,7 @@ fun FlexboxScope.Flexbox(
 
 @SuppressLint("RememberReturnType")
 @Composable
+@UiComposable
 fun Flexbox(
     modifier: Modifier = Modifier,
     parentLayoutState: FlexLayoutState? = null,
@@ -119,7 +123,7 @@ fun Flexbox(
                 val placeable = measurable.measure(constraints)
                 layout(placeable.measuredWidth, placeable.measuredHeight) {
                     log("[Layout] Place [${layoutNode?.layoutWidth}, ${layoutNode?.layoutHeight}]@(${layoutNode?.layoutX}, ${layoutNode?.layoutY})")
-                    placeable.placeRelative(0, 0)
+                    placeable.place(0, 0)
                 }
             },
         content = {
@@ -273,17 +277,16 @@ fun Flexbox(
                 return@mapIndexed measurable.measure(Constraints())
             }
             val childNode = node.getChildAt(index)
-            val isContainer = childNode.childCount > 0
 
             val paddingStart = ceil(childNode.getLayoutPadding(YogaEdge.START))
             val paddingTop = ceil(childNode.getLayoutPadding(YogaEdge.TOP))
             val paddingEnd = ceil(childNode.getLayoutPadding(YogaEdge.END))
             val paddingBottom = ceil(childNode.getLayoutPadding(YogaEdge.BOTTOM))
 
             val verticalPadding =
-                (paddingTop + paddingBottom).takeIf { !isContainer } ?: 0f
+                (paddingTop + paddingBottom).takeIf { !childNode.isContainer } ?: 0f
             val horizontalPadding =
-                (paddingStart + paddingEnd).takeIf { !isContainer } ?: 0f
+                (paddingStart + paddingEnd).takeIf { !childNode.isContainer } ?: 0f
 
             val childWidth =
                 (childNode.layoutWidth - horizontalPadding)
@@ -312,12 +315,11 @@ fun Flexbox(
                     return@fastForEachIndexed
                 }
                 val childNode = node.getChildAt(index)
-                val isContainer = childNode.childCount > 0
 
                 val paddingStart =
-                    childNode.getLayoutPadding(YogaEdge.START).takeIf { !isContainer } ?: 0f
+                    childNode.getLayoutPadding(YogaEdge.START).takeIf { !childNode.isContainer } ?: 0f
                 val paddingTop =
-                    childNode.getLayoutPadding(YogaEdge.TOP).takeIf { !isContainer } ?: 0f
+                    childNode.getLayoutPadding(YogaEdge.TOP).takeIf { !childNode.isContainer } ?: 0f
 
                 val nodeX =
                     (childNode.layoutX + paddingStart).coerceAtLeast(layoutPadStart).roundToInt()

library/src/main/java/net/obsidianx/chakra/layout/YogaExtensions.kt

@@ -8,6 +8,7 @@ import com.facebook.yoga.YogaGutter
 import com.facebook.yoga.YogaNode
 import com.facebook.yoga.YogaUnit
 import com.facebook.yoga.YogaValue
+import net.obsidianx.chakra.types.FlexNodeData
 
 internal val YogaValue.isSet
     get() = unit == YogaUnit.PERCENT || unit == YogaUnit.POINT
@@ -88,3 +89,6 @@ internal val YogaNode.horizontalGap: Float
 internal val YogaNode.verticalGap: Float
     get() = getGap(YogaGutter.ALL).takeUnless { it.isNaN() }
         ?: getGap(YogaGutter.ROW).takeUnless { it.isNaN() } ?: 0f
+
+internal val YogaNode.isContainer: Boolean
+    get() = (data as? FlexNodeData)?.isContainer == true

library/src/main/java/net/obsidianx/chakra/modifiers/FlexModifiers.kt

@@ -54,10 +54,23 @@ fun FlexboxStyleScope.gap(all: Dp? = null, horizontal: Dp? = null, vertical: Dp?
     if (listOf(all, horizontal, vertical).count { it != null } > 1) {
         throw IllegalArgumentException("Only set one kind of gap in FlexboxStyleScope.gap")
     }
-    val gutter = when {
-        vertical != null -> FlexGutter.Row
-        horizontal != null -> FlexGutter.Column
-        else -> FlexGutter.All
+    val gutter: FlexGutter
+    val value: Float
+    when {
+        vertical != null -> {
+            gutter = FlexGutter.Row
+            value = vertical.value
+        }
+
+        horizontal != null -> {
+            gutter = FlexGutter.Column
+            value = horizontal.value
+        }
+
+        else -> {
+            gutter = FlexGutter.All
+            value = all?.value ?: 0f
+        }
     }
-    nodeData.style.gap = FlexGap(gutter, (all?.value ?: 0f) * density.density)
+    nodeData.style.gap = FlexGap(gutter, value * density.density)
 }

library/src/main/java/net/obsidianx/chakra/modifiers/FlexboxModifier.kt

@@ -35,6 +35,6 @@ fun Modifier.flex(block: FlexboxStyleScope.() -> Unit = {}) =
         )
     }
 
-internal fun Modifier.flexContainer() = flex {
+fun Modifier.flexContainer() = flex {
     nodeData.isContainer = true
 }