From 26ffee89101f2a660a7dd119e4f439d670655bb8 Mon Sep 17 00:00:00 2001 From: Luis Cortes Date: Tue, 10 Dec 2024 08:37:00 -0500 Subject: [PATCH] Adding support for the Width Modifier in ComposeUiBox (#2495) --- CHANGELOG.md | 2 +- .../app/cash/redwood/layout/composeui/Box.kt | 9 +++++- .../redwood/layout/composeui/ComposeUiBox.kt | 4 ++- ...seUiBoxTest_RTL_testChildExplicitWidth.png | 3 ++ ...omposeUiBoxTest_testChildExplicitWidth.png | 3 ++ .../cash/redwood/layout/AbstractBoxTest.kt | 32 +++++++++++++++++++ .../testChildExplicitWidth.1.png | 3 ++ ...ViewBoxTest_RTL_testChildExplicitWidth.png | 3 ++ ...iew_ViewBoxTest_testChildExplicitWidth.png | 3 ++ 9 files changed, 59 insertions(+), 3 deletions(-) create mode 100644 redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_RTL_testChildExplicitWidth.png create mode 100644 redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_testChildExplicitWidth.png create mode 100644 redwood-layout-uiview/RedwoodLayoutUIViewTests/__Snapshots__/UIViewBoxTestHost/testChildExplicitWidth.1.png create mode 100644 redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_RTL_testChildExplicitWidth.png create mode 100644 redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_testChildExplicitWidth.png diff --git a/CHANGELOG.md b/CHANGELOG.md index 60e88cfeb9..396414425a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,7 +17,7 @@ Changed: Fixed: - Fix inconsistency in margin application between `ComposeUiBox` and `ViewBox`. - Add support for the Height modifier in `ComposeUiBox`. - +- Add support for the Width modifier in `ComposeUiBox`. ## [0.16.0] - 2024-11-19 [0.16.0]: https://github.com/cashapp/redwood/releases/tag/0.16.0 diff --git a/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/Box.kt b/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/Box.kt index 7349ff5e64..df5d88661d 100644 --- a/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/Box.kt +++ b/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/Box.kt @@ -68,7 +68,8 @@ internal data class BoxChildLayoutInfo( val alignment: Alignment, val matchParentWidth: Boolean, val matchParentHeight: Boolean, - val requestedHeight: Dp? + val requestedHeight: Dp?, + val requestedWidth: Dp? ) @PublishedApi @@ -105,7 +106,13 @@ internal data class BoxMeasurePolicy( minWidth = if (boxWidth != Constraints.Infinity) boxWidth else 0, maxWidth = boxWidth, ) + } else if (layoutInfo.requestedWidth != null) { + childConstraints = childConstraints.copy( + minWidth = layoutInfo.requestedWidth.toPx().toInt(), + maxWidth = layoutInfo.requestedWidth.toPx().toInt(), + ) } + if (layoutInfo.matchParentHeight) { childConstraints = childConstraints.copy( minHeight = if (boxHeight != Constraints.Infinity) boxHeight else 0, diff --git a/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/ComposeUiBox.kt b/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/ComposeUiBox.kt index 4c3aaecd18..191e8b6d95 100644 --- a/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/ComposeUiBox.kt +++ b/redwood-layout-composeui/src/commonMain/kotlin/app/cash/redwood/layout/composeui/ComposeUiBox.kt @@ -87,6 +87,7 @@ internal class ComposeUiBox( var matchParentWidth = matchParentWidth var matchParentHeight = matchParentHeight var requestedHeight: Dp? = null + var requestedWidth: Dp? = null forEachScoped { childModifier -> when (childModifier) { @@ -107,7 +108,7 @@ internal class ComposeUiBox( } is Width -> { - // TODO + requestedWidth = childModifier.width.toDp() } is Height -> { @@ -137,6 +138,7 @@ internal class ComposeUiBox( matchParentWidth = matchParentWidth, matchParentHeight = matchParentHeight, requestedHeight = requestedHeight, + requestedWidth = requestedWidth, ) } diff --git a/redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_RTL_testChildExplicitWidth.png b/redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_RTL_testChildExplicitWidth.png new file mode 100644 index 0000000000..d54ce9a669 --- /dev/null +++ b/redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_RTL_testChildExplicitWidth.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:3a553d58662b204b25c163bbfc76152373867326b855edd9053a1856798d4858 +size 10644 diff --git a/redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_testChildExplicitWidth.png b/redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_testChildExplicitWidth.png new file mode 100644 index 0000000000..fcdd400300 --- /dev/null +++ b/redwood-layout-composeui/src/test/snapshots/images/app.cash.redwood.layout.composeui_ComposeUiBoxTest_testChildExplicitWidth.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:960f69a6c71e22288756be21e3918ee055fbcbc212395fc6fe97118f5f993b61 +size 10611 diff --git a/redwood-layout-shared-test/src/commonMain/kotlin/app/cash/redwood/layout/AbstractBoxTest.kt b/redwood-layout-shared-test/src/commonMain/kotlin/app/cash/redwood/layout/AbstractBoxTest.kt index a09fa185f1..78bdddf425 100644 --- a/redwood-layout-shared-test/src/commonMain/kotlin/app/cash/redwood/layout/AbstractBoxTest.kt +++ b/redwood-layout-shared-test/src/commonMain/kotlin/app/cash/redwood/layout/AbstractBoxTest.kt @@ -629,4 +629,36 @@ abstract class AbstractBoxTest { snapshotter.snapshot() } + + @Test + fun testChildExplicitWidth() { + val container = box() + .apply { + width(Constraint.Fill) + height(Constraint.Fill) + horizontalAlignment(CrossAxisAlignment.Center) + verticalAlignment(CrossAxisAlignment.Stretch) + } + val snapshotter = snapshotter(container.value) + + val box = box() + .apply { + modifier = MarginImpl(all = 24.dp) + width(Constraint.Wrap) + height(Constraint.Fill) + horizontalAlignment(CrossAxisAlignment.Center) + verticalAlignment(CrossAxisAlignment.Stretch) + } + .also { container.children.insert(0, it) } + + widgetFactory.color().apply { + modifier = WidthImpl(200.dp) + }.also { box.children.insert(0, it) } + + widgetFactory.text( + text = "foreground", + ).also { box.children.insert(1, it) } + + snapshotter.snapshot() + } } diff --git a/redwood-layout-uiview/RedwoodLayoutUIViewTests/__Snapshots__/UIViewBoxTestHost/testChildExplicitWidth.1.png b/redwood-layout-uiview/RedwoodLayoutUIViewTests/__Snapshots__/UIViewBoxTestHost/testChildExplicitWidth.1.png new file mode 100644 index 0000000000..747ef259c0 --- /dev/null +++ b/redwood-layout-uiview/RedwoodLayoutUIViewTests/__Snapshots__/UIViewBoxTestHost/testChildExplicitWidth.1.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:7f88abd193866eeec73ef831494ba3bc703ca0b87af8a7a9120a36c27cd6ad0d +size 104615 diff --git a/redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_RTL_testChildExplicitWidth.png b/redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_RTL_testChildExplicitWidth.png new file mode 100644 index 0000000000..328f4276dd --- /dev/null +++ b/redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_RTL_testChildExplicitWidth.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:29d13ff676ac18ca451c0cd3eb18ba48e9209adba3243e3417640ab61c778363 +size 13939 diff --git a/redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_testChildExplicitWidth.png b/redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_testChildExplicitWidth.png new file mode 100644 index 0000000000..e3b23d555a --- /dev/null +++ b/redwood-layout-view/src/test/snapshots/images/app.cash.redwood.layout.view_ViewBoxTest_testChildExplicitWidth.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:ee1fd52be5ccb86228b5c488a79f2973d7d12df8951a3b778ffac0484a6d42e1 +size 13906