From 15d8db6412369ffcd9014cb587a02dcbf0d5bf9e Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sat, 7 Oct 2023 16:27:44 +0100 Subject: [PATCH 01/13] Rename PositionInside -> PositionAlignment --- .../promoter/ui/PromoterVisualisation.kt | 16 ++++++++-------- .../experimental/promoter/ui/TargetUiState.kt | 4 ++-- .../puzzle15/ui/Puzzle15Visualisation.kt | 4 ++-- .../experimental/puzzle15/ui/TargetUiState.kt | 4 ++-- .../testdrive/ui/rotation/TargetUiState.kt | 4 ++-- .../rotation/TestDriveRotationVisualisation.kt | 10 +++++----- .../testdrive/ui/simple/TargetUiState.kt | 4 ++-- .../ui/simple/TestDriveSimpleVisualisation.kt | 10 +++++----- .../backstack/ui/stack3d/BackStack3D.kt | 8 ++++---- .../backstack/ui/stack3d/TargetUiState.kt | 4 ++-- .../interactions/ui/state/MutableUiStateTest.kt | 14 +++++++------- .../interactions/ui/state/TestMutableUiState.kt | 4 ++-- .../interactions/ui/state/TestTargetUiState.kt | 4 ++-- .../appyx/interactions/core/AppyxComponent.kt | 6 +++--- .../{PositionInside.kt => PositionAlignment.kt} | 6 +++--- .../navigation/composable/AppyxComponent.kt | 6 +++--- .../IncompleteDragVisualisation.kt | 10 +++++----- .../appyx/demos/incompletedrag/TargetUiState.kt | 4 ++-- .../appyx/demos/sample1/Sample1Visualisation.kt | 10 +++++----- .../bumble/appyx/demos/sample1/TargetUiState.kt | 4 ++-- .../appyx/demos/sample2/Sample2Visualisation.kt | 10 +++++----- .../bumble/appyx/demos/sample2/TargetUiState.kt | 4 ++-- .../appyx/demos/sample3/Sample3Visualisation.kt | 10 +++++----- .../bumble/appyx/demos/sample3/TargetUiState.kt | 4 ++-- 24 files changed, 82 insertions(+), 82 deletions(-) rename appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/{PositionInside.kt => PositionAlignment.kt} (98%) diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt index b49f4ee84..c18202742 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt @@ -15,7 +15,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.RotationY import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.Center -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import kotlin.math.min @@ -72,7 +72,7 @@ class PromoterVisualisation( @Suppress("LongMethod") private fun createTargetUiStates(radius: Float) { created = TargetUiState( - position = PositionInside.Target(alignment = Center), + position = PositionAlignment.Target(alignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -85,7 +85,7 @@ class PromoterVisualisation( ) stage1 = TargetUiState( - position = PositionInside.Target(alignment = Center), + position = PositionAlignment.Target(alignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -98,7 +98,7 @@ class PromoterVisualisation( ) stage2 = TargetUiState( - position = PositionInside.Target(alignment = Center), + position = PositionAlignment.Target(alignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -111,7 +111,7 @@ class PromoterVisualisation( ) stage3 = TargetUiState( - position = PositionInside.Target(alignment = Center), + position = PositionAlignment.Target(alignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -124,7 +124,7 @@ class PromoterVisualisation( ) stage4 = TargetUiState( - position = PositionInside.Target(alignment = Center), + position = PositionAlignment.Target(alignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -137,7 +137,7 @@ class PromoterVisualisation( ) stage5 = TargetUiState( - position = PositionInside.Target(alignment = Center), + position = PositionAlignment.Target(alignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = 0f, @@ -150,7 +150,7 @@ class PromoterVisualisation( ) destroyed = TargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( alignment = Center, offset = DpOffset(500.dp, (-200).dp) ), diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt index e89b7a616..a2c35fd10 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt @@ -4,12 +4,12 @@ import com.bumble.appyx.interactions.core.ui.property.impl.AngularPosition import com.bumble.appyx.interactions.core.ui.property.impl.RotationY import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val angularPosition: AngularPosition.Target, val scale: Scale.Target, val rotationY: RotationY.Target, diff --git a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt index 66b3984ba..c3c6b792d 100644 --- a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt +++ b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt @@ -15,7 +15,7 @@ import com.bumble.appyx.interactions.core.ui.gesture.GestureFactory import com.bumble.appyx.interactions.core.ui.gesture.dragDirection4 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.fractionAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -35,7 +35,7 @@ class Puzzle15Visualisation( MatchedTargetUiState( element = tileElements, targetUiState = TargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( alignment = fractionAlignment( horizontalBiasFraction = (index % CELLS_COUNT).toFloat() / (CELLS_COUNT - 1), verticalBiasFraction = (index / CELLS_COUNT).toFloat() / (CELLS_COUNT - 1) diff --git a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt index 28b099d08..f48fe6522 100644 --- a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt +++ b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt @@ -1,9 +1,9 @@ package com.bumble.appyx.components.experimental.puzzle15.ui -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target = PositionInside.Target() + val position: PositionAlignment.Target = PositionAlignment.Target() ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt index 9f2a59b36..7aededa03 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt @@ -2,13 +2,13 @@ package com.bumble.appyx.components.internal.testdrive.ui.rotation import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val rotationZ: RotationZ.Target, val backgroundColor: BackgroundColor.Target, ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt index d15cf486f..26f51730a 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt @@ -15,7 +15,7 @@ import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -46,25 +46,25 @@ class TestDriveRotationVisualisation( } private val topLeftCorner = TargetUiState( - position = PositionInside.Target(InsideAlignment.TopStart), + position = PositionAlignment.Target(InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(md_red_500) ) private val topRightCorner = TargetUiState( - position = PositionInside.Target(InsideAlignment.TopEnd), + position = PositionAlignment.Target(InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(md_light_green_500) ) private val bottomRightCorner = TargetUiState( - position = PositionInside.Target(InsideAlignment.CenterEnd), + position = PositionAlignment.Target(InsideAlignment.CenterEnd), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(md_yellow_500) ) private val bottomLeftCorner = TargetUiState( - position = PositionInside.Target(InsideAlignment.CenterStart), + position = PositionAlignment.Target(InsideAlignment.CenterStart), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(md_light_blue_500) ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt index 08a14ed94..e227edee0 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt @@ -1,12 +1,12 @@ package com.bumble.appyx.components.internal.testdrive.ui.simple import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val backgroundColor: BackgroundColor.Target, ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt index e79c4040b..eb3b2e8d9 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt @@ -29,7 +29,7 @@ import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -60,22 +60,22 @@ class TestDriveSimpleVisualisation( } private val topLeftCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.TopStart), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(md_red_500) ) private val topRightCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.TopEnd), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(md_light_green_500) ) private val bottomRightCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.CenterEnd), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.CenterEnd), backgroundColor = BackgroundColor.Target(md_yellow_500) ) private val bottomLeftCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.CenterStart), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.CenterStart), backgroundColor = BackgroundColor.Target(md_light_blue_500) ) } diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt index 6b1c46f2c..253968f5d 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt @@ -19,7 +19,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopCenter -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -35,7 +35,7 @@ class BackStack3D( private val topMost: TargetUiState = TargetUiState( - position = PositionInside.Target(TopCenter, DpOffset(0f.dp, (itemsInStack * 16).dp)), + position = PositionAlignment.Target(TopCenter, DpOffset(0f.dp, (itemsInStack * 16).dp)), scale = Scale.Target(1f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(1f), zIndex = ZIndex.Target(itemsInStack.toFloat()), @@ -52,7 +52,7 @@ class BackStack3D( private fun stacked(stackIndex: Int): TargetUiState = TargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( TopCenter, DpOffset(0f.dp, (itemsInStack - stackIndex) * 16.dp) ), @@ -62,7 +62,7 @@ class BackStack3D( ) private fun incoming(height: Dp): TargetUiState = TargetUiState( - position = PositionInside.Target(TopCenter, DpOffset(0f.dp, height)), + position = PositionAlignment.Target(TopCenter, DpOffset(0f.dp, height)), scale = Scale.Target(1f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(0f), zIndex = ZIndex.Target(itemsInStack + 1f), diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt index 27c0b5b07..1bc0e3277 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt @@ -3,13 +3,13 @@ package com.bumble.appyx.components.backstack.ui.stack3d import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val scale: Scale.Target, val alpha: Alpha.Target, val zIndex: ZIndex.Target diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt index 94cfcaf73..5bef591ae 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt @@ -19,7 +19,7 @@ import com.bumble.appyx.interactions.core.ui.LocalBoxScope import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import junit.framework.TestCase.assertFalse import junit.framework.TestCase.assertTrue import kotlinx.coroutines.CoroutineScope @@ -39,7 +39,7 @@ class MutableUiStateTest { private lateinit var coroutineScope: CoroutineScope private fun setupTestMutableUiState( - target: PositionInside.Target = PositionInside.Target( + target: PositionAlignment.Target = PositionAlignment.Target( alignment = BiasAlignment.InsideAlignment.TopStart ), clipToBounds: Boolean = false, @@ -59,7 +59,7 @@ class MutableUiStateTest { testMutableUiState = remember { TestMutableUiState( uiContext = uiContext, - position = PositionInside( + position = PositionAlignment( coroutineScope = coroutineScope, target = target, ) @@ -97,7 +97,7 @@ class MutableUiStateTest { // moving the child to the top-right corner + offset its size -> pushes it off screen testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( alignment = BiasAlignment.InsideAlignment.TopEnd, offset = DpOffset(x = childSize, y = 0.dp) ) @@ -123,7 +123,7 @@ class MutableUiStateTest { // moving the child to the top-right corner + offset less than its size -> make it just visible testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( alignment = BiasAlignment.InsideAlignment.TopEnd, offset = DpOffset(x = offset, y = 0.dp) ) @@ -152,7 +152,7 @@ class MutableUiStateTest { // moving the child with offset that equals parent's size -> pushes it off parent's bounds testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( offset = DpOffset(x = parentSize, y = 0.dp) ) ) @@ -181,7 +181,7 @@ class MutableUiStateTest { val offset = parentSize - 1.dp testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionInside.Target( + position = PositionAlignment.Target( offset = DpOffset(x = offset, y = 0.dp) ) ) diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt index eee9ec743..9eb443923 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt @@ -4,7 +4,7 @@ import androidx.compose.animation.core.SpringSpec import androidx.compose.animation.core.spring import androidx.compose.ui.Modifier import com.bumble.appyx.interactions.core.ui.context.UiContext -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.BaseMutableUiState import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.async @@ -13,7 +13,7 @@ import kotlinx.coroutines.launch class TestMutableUiState( uiContext: UiContext, - val position: PositionInside, + val position: PositionAlignment, ) : BaseMutableUiState( uiContext = uiContext, motionProperties = listOf(position), diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt index 6caaeefbe..4903e0942 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt @@ -1,5 +1,5 @@ package com.bumble.appyx.interactions.ui.state -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment -class TestTargetUiState(val position: PositionInside.Target) +class TestTargetUiState(val position: PositionAlignment.Target) diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt index d02cff261..c02a485aa 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt @@ -40,7 +40,7 @@ import com.bumble.appyx.interactions.core.ui.LocalMotionProperties import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.output.ElementUiModel -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside import com.bumble.appyx.interactions.core.ui.property.motionPropertyRenderValue @@ -182,11 +182,11 @@ fun elementOffset( containerSize: IntSize, ): IntOffset { - val positionInside = motionPropertyRenderValue() + val positionAlignment = motionPropertyRenderValue() val positionOutside = motionPropertyRenderValue() val layoutDirection = LocalLayoutDirection.current - val positionInsideOffset = positionInside?.let { + val positionInsideOffset = positionAlignment?.let { it.alignment.align(elementSize, containerSize, layoutDirection) } ?: IntOffset.Zero diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionInside.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt similarity index 98% rename from appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionInside.kt rename to appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt index 13119ce97..c5a874fac 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionInside.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt @@ -18,14 +18,14 @@ import com.bumble.appyx.interactions.core.ui.property.Interpolatable import com.bumble.appyx.interactions.core.ui.property.MotionProperty import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside.Value +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment.Value import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.flow.MutableStateFlow import kotlinx.coroutines.flow.StateFlow import kotlin.math.roundToInt @Suppress("MagicNumber") -class PositionInside( +class PositionAlignment( coroutineScope: CoroutineScope, val target: Target, displacement: StateFlow = MutableStateFlow(Value.Zero), @@ -36,7 +36,7 @@ class PositionInside( easing = target.easing, visibilityThreshold = visibilityThreshold, displacement = displacement -), Interpolatable { +), Interpolatable { data class Value( val alignment: InsideAlignment = TopStart, diff --git a/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt b/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt index 1e6a150ac..49e388e57 100644 --- a/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt +++ b/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt @@ -40,7 +40,7 @@ import com.bumble.appyx.interactions.core.ui.LocalMotionProperties import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.output.ElementUiModel -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside import com.bumble.appyx.interactions.core.ui.property.motionPropertyRenderValue import com.bumble.appyx.navigation.integration.LocalScreenSize @@ -215,11 +215,11 @@ class ChildrenTransitionScope( containerSize: IntSize ): IntOffset { - val positionInside = motionPropertyRenderValue() + val positionAlignment = motionPropertyRenderValue() val positionOutside = motionPropertyRenderValue() val layoutDirection = LocalLayoutDirection.current - val positionInsideOffset = positionInside?.let { + val positionInsideOffset = positionAlignment?.let { it.alignment.align(elementSize, containerSize, layoutDirection) } ?: IntOffset.Zero diff --git a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt index 98cb5eabe..6f659963c 100644 --- a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt +++ b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt @@ -28,7 +28,7 @@ import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -60,25 +60,25 @@ class IncompleteDragVisualisation( } private val topLeftCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.TopStart), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.TopEnd), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomEnd, bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionInside.Target(BiasAlignment.InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomStart, bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt index 31e9e8bf0..71e9b5d1d 100644 --- a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt @@ -3,13 +3,13 @@ package com.bumble.appyx.demos.incompletedrag import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val rotationZ: RotationZ.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt index 9acc104c0..dabbfc5d3 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt @@ -27,7 +27,7 @@ import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -59,22 +59,22 @@ class Sample1Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.TopStart), + position = PositionAlignment.Target(alignment = InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.TopEnd), + position = PositionAlignment.Target(alignment = InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(alignment = InsideAlignment.BottomStart, bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt index 237f8b06f..8805d25cd 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt @@ -2,13 +2,13 @@ package com.bumble.appyx.demos.sample1 import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt index 49905edd2..ace0090ed 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt @@ -28,7 +28,7 @@ import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -60,25 +60,25 @@ class Sample2Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.TopStart), + position = PositionAlignment.Target(alignment = InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.TopEnd), + position = PositionAlignment.Target(alignment = InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(alignment = InsideAlignment.BottomStart, bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt index 05950f34b..f44920f75 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt @@ -3,13 +3,13 @@ package com.bumble.appyx.demos.sample2 import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val rotationZ: RotationZ.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt index c7e221ab2..78b958c33 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt @@ -27,7 +27,7 @@ import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -59,22 +59,22 @@ class Sample3Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.TopStart), + position = PositionAlignment.Target(alignment = InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(color_primary) ) private val uiStateB = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.TopEnd), + position = PositionAlignment.Target(alignment = InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(color_dark) ) private val uiStateC = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val uiStateD = TargetUiState( - position = PositionInside.Target(alignment = InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(alignment = InsideAlignment.BottomStart, bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt index f7082b19f..a8e2f174d 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt @@ -2,13 +2,13 @@ package com.bumble.appyx.demos.sample3 import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionInside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionInside.Target, + val position: PositionAlignment.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, ) From b296394cc8e830ba4039c68c860eed7a4aae2ca0 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sat, 7 Oct 2023 16:30:04 +0100 Subject: [PATCH 02/13] Extract PositionOffset from PositionAlignment --- .../property/impl/position/PositionOffset.kt | 112 ++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt new file mode 100644 index 000000000..0d8b8cda5 --- /dev/null +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt @@ -0,0 +1,112 @@ +package com.bumble.appyx.interactions.core.ui.property.impl.position + +import androidx.compose.animation.core.Animatable +import androidx.compose.animation.core.AnimationVector2D +import androidx.compose.animation.core.AnimationVector4D +import androidx.compose.animation.core.Easing +import androidx.compose.animation.core.TwoWayConverter +import androidx.compose.foundation.layout.offset +import androidx.compose.runtime.collectAsState +import androidx.compose.ui.Modifier +import androidx.compose.ui.composed +import androidx.compose.ui.unit.DpOffset +import androidx.compose.ui.unit.IntOffset +import androidx.compose.ui.unit.dp +import com.bumble.appyx.interactions.core.ui.LocalBoxScope +import com.bumble.appyx.interactions.core.ui.math.lerpDpOffset +import com.bumble.appyx.interactions.core.ui.property.Interpolatable +import com.bumble.appyx.interactions.core.ui.property.MotionProperty +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset.Value +import kotlinx.coroutines.CoroutineScope +import kotlinx.coroutines.flow.MutableStateFlow +import kotlinx.coroutines.flow.StateFlow +import kotlin.math.roundToInt + +@Suppress("MagicNumber") +class PositionOffset( + coroutineScope: CoroutineScope, + val target: Target, + displacement: StateFlow = MutableStateFlow(Value.Zero), + visibilityThreshold: Value = Value(DpOffset(1.dp, 1.dp)), +) : MotionProperty( + coroutineScope = coroutineScope, + animatable = Animatable(target.value, Value.VectorConverter), + easing = target.easing, + visibilityThreshold = visibilityThreshold, + displacement = displacement +), Interpolatable { + + data class Value( + val offset: DpOffset + ) { + companion object { + val VectorConverter: TwoWayConverter = + TwoWayConverter( + convertToVector = { + AnimationVector2D( + v1 = it.offset.x.value, + v2 = it.offset.y.value, + ) + }, + convertFromVector = { + Value( + offset = DpOffset(it.v1.dp, it.v2.dp) + ) + } + ) + + val Zero = Value( + offset = DpOffset.Zero + ) + } + } + + class Target( + val value: Value, + val easing: Easing? = null, + ) : MotionProperty.Target { + + constructor( + offset: DpOffset = DpOffset.Zero + ) : this( + value = Value( + offset = offset + ) + ) + } + + override fun calculateRenderValue(base: Value, displacement: Value): Value = + Value( + offset = base.offset - displacement.offset + ) + + override val modifier: Modifier + get() = Modifier.composed { + val value = renderValueFlow.collectAsState() + val boxScope = requireNotNull(LocalBoxScope.current) + with(boxScope) { + this@composed + .offset { + IntOffset( + x = (value.value.offset.x.value * density).roundToInt(), + y = (value.value.offset.y.value * density).roundToInt(), + ) + } + } + + } + + override suspend fun lerpTo(start: Target, end: Target, fraction: Float) { + val progress = easingTransform(end.easing, fraction) + + snapTo( + Value( + offset = lerpDpOffset( + start = start.value.offset, + end = end.value.offset, + progress = progress + ) + ) + ) + } +} From aa63ffdd05b70d4038fad86a1f328624bd0c8996 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sat, 7 Oct 2023 16:38:10 +0100 Subject: [PATCH 03/13] Update field name references --- .../promoter/ui/PromoterVisualisation.kt | 14 +-- .../puzzle15/ui/Puzzle15Visualisation.kt | 2 +- .../internal/testdrive/TestDriveExperiment.kt | 2 +- .../ui/state/MutableUiStateTest.kt | 6 +- .../appyx/interactions/core/AppyxComponent.kt | 2 +- .../impl/position/PositionAlignment.kt | 94 ++++++++++--------- .../navigation/composable/AppyxComponent.kt | 2 +- .../demos/sample1/Sample1Visualisation.kt | 8 +- .../demos/sample2/Sample2Visualisation.kt | 8 +- .../com/bumble/appyx/demos/sample3/Sample3.kt | 2 +- .../demos/sample3/Sample3Visualisation.kt | 8 +- 11 files changed, 77 insertions(+), 71 deletions(-) diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt index c18202742..8573230f1 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt @@ -72,7 +72,7 @@ class PromoterVisualisation( @Suppress("LongMethod") private fun createTargetUiStates(radius: Float) { created = TargetUiState( - position = PositionAlignment.Target(alignment = Center), + position = PositionAlignment.Target(insideAlignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -85,7 +85,7 @@ class PromoterVisualisation( ) stage1 = TargetUiState( - position = PositionAlignment.Target(alignment = Center), + position = PositionAlignment.Target(insideAlignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -98,7 +98,7 @@ class PromoterVisualisation( ) stage2 = TargetUiState( - position = PositionAlignment.Target(alignment = Center), + position = PositionAlignment.Target(insideAlignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -111,7 +111,7 @@ class PromoterVisualisation( ) stage3 = TargetUiState( - position = PositionAlignment.Target(alignment = Center), + position = PositionAlignment.Target(insideAlignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -124,7 +124,7 @@ class PromoterVisualisation( ) stage4 = TargetUiState( - position = PositionAlignment.Target(alignment = Center), + position = PositionAlignment.Target(insideAlignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -137,7 +137,7 @@ class PromoterVisualisation( ) stage5 = TargetUiState( - position = PositionAlignment.Target(alignment = Center), + position = PositionAlignment.Target(insideAlignment = Center), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = 0f, @@ -151,7 +151,7 @@ class PromoterVisualisation( destroyed = TargetUiState( position = PositionAlignment.Target( - alignment = Center, + insideAlignment = Center, offset = DpOffset(500.dp, (-200).dp) ), angularPosition = AngularPosition.Target( diff --git a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt index c3c6b792d..f2dc180cc 100644 --- a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt +++ b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt @@ -36,7 +36,7 @@ class Puzzle15Visualisation( element = tileElements, targetUiState = TargetUiState( position = PositionAlignment.Target( - alignment = fractionAlignment( + insideAlignment = fractionAlignment( horizontalBiasFraction = (index % CELLS_COUNT).toFloat() / (CELLS_COUNT - 1), verticalBiasFraction = (index / CELLS_COUNT).toFloat() / (CELLS_COUNT - 1) ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt index 0d049d9b1..f0377720b 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt @@ -161,7 +161,7 @@ fun TestDriveUi( Box( modifier = Modifier .size(60.dp) - .align(targetUiState.position.value.alignment) + .align(targetUiState.position.value.insideAlignment) .offset( targetUiState.position.value.offset.x, targetUiState.position.value.offset.y diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt index 5bef591ae..01510b741 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt @@ -40,7 +40,7 @@ class MutableUiStateTest { private fun setupTestMutableUiState( target: PositionAlignment.Target = PositionAlignment.Target( - alignment = BiasAlignment.InsideAlignment.TopStart + insideAlignment = BiasAlignment.InsideAlignment.TopStart ), clipToBounds: Boolean = false, containerModifier: Modifier = Modifier @@ -98,7 +98,7 @@ class MutableUiStateTest { testMutableUiState.snapTo( target = TestTargetUiState( position = PositionAlignment.Target( - alignment = BiasAlignment.InsideAlignment.TopEnd, + insideAlignment = BiasAlignment.InsideAlignment.TopEnd, offset = DpOffset(x = childSize, y = 0.dp) ) ) @@ -124,7 +124,7 @@ class MutableUiStateTest { testMutableUiState.snapTo( target = TestTargetUiState( position = PositionAlignment.Target( - alignment = BiasAlignment.InsideAlignment.TopEnd, + insideAlignment = BiasAlignment.InsideAlignment.TopEnd, offset = DpOffset(x = offset, y = 0.dp) ) ) diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt index c02a485aa..aa481ec1a 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt @@ -187,7 +187,7 @@ fun elementOffset( val layoutDirection = LocalLayoutDirection.current val positionInsideOffset = positionAlignment?.let { - it.alignment.align(elementSize, containerSize, layoutDirection) + it.insideAlignment.align(elementSize, containerSize, layoutDirection) } ?: IntOffset.Zero val positionOutsideOffset = positionOutside?.let { diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt index c5a874fac..4471e554c 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt @@ -6,11 +6,13 @@ import androidx.compose.animation.core.Easing import androidx.compose.animation.core.TwoWayConverter import androidx.compose.foundation.layout.offset import androidx.compose.runtime.collectAsState +import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.composed import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.IntOffset -import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.IntSize +import androidx.compose.ui.unit.LayoutDirection import com.bumble.appyx.interactions.core.ui.LocalBoxScope import com.bumble.appyx.interactions.core.ui.math.lerpDpOffset import com.bumble.appyx.interactions.core.ui.math.lerpFloat @@ -18,6 +20,7 @@ import com.bumble.appyx.interactions.core.ui.property.Interpolatable import com.bumble.appyx.interactions.core.ui.property.MotionProperty import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment.Value import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.flow.MutableStateFlow @@ -29,7 +32,10 @@ class PositionAlignment( coroutineScope: CoroutineScope, val target: Target, displacement: StateFlow = MutableStateFlow(Value.Zero), - visibilityThreshold: Value = Value(InsideAlignment(0.001f, 0.001f), DpOffset(1.dp, 1.dp)), + visibilityThreshold: Value = Value( + InsideAlignment(0.001f, 0.001f), + OutsideAlignment(0.001f, 0.001f), + ), ) : MotionProperty( coroutineScope = coroutineScope, animatable = Animatable(target.value, Value.VectorConverter), @@ -39,31 +45,39 @@ class PositionAlignment( ), Interpolatable { data class Value( - val alignment: InsideAlignment = TopStart, - val offset: DpOffset - ) { + val insideAlignment: InsideAlignment = TopStart, + val outsideAlignment: OutsideAlignment = OutsideAlignment.InContainer, + ) : Alignment { + + override fun align( + size: IntSize, + space: IntSize, + layoutDirection: LayoutDirection + ): IntOffset = + insideAlignment.align(size, space, layoutDirection) + + outsideAlignment.align(size, space, layoutDirection) + companion object { val VectorConverter: TwoWayConverter = TwoWayConverter( convertToVector = { AnimationVector4D( - v1 = it.offset.x.value, - v2 = it.offset.y.value, - v3 = it.alignment.horizontalBias, - v4 = it.alignment.verticalBias, + v1 = it.insideAlignment.horizontalBias, + v2 = it.insideAlignment.verticalBias, + v3 = it.outsideAlignment.horizontalBias, + v4 = it.outsideAlignment.verticalBias, ) }, convertFromVector = { Value( - alignment = InsideAlignment(it.v3, it.v4), - offset = DpOffset(it.v1.dp, it.v2.dp) + insideAlignment = InsideAlignment(it.v1, it.v2), + outsideAlignment = OutsideAlignment(it.v3, it.v4), ) } ) val Zero = Value( - alignment = InsideAlignment(0f, 0f), - offset = DpOffset.Zero + insideAlignment = InsideAlignment(0f, 0f), ) } } @@ -74,41 +88,44 @@ class PositionAlignment( ) : MotionProperty.Target { constructor( - offset: DpOffset = DpOffset.Zero + outsideAlignment: OutsideAlignment ) : this( value = Value( - alignment = TopStart, - offset = offset + insideAlignment = TopStart, + outsideAlignment = outsideAlignment, ) ) constructor( - alignment: InsideAlignment + insideAlignment: InsideAlignment ) : this( value = Value( - alignment = alignment, - offset = DpOffset.Zero + insideAlignment = insideAlignment, + outsideAlignment = OutsideAlignment.InContainer, ) ) constructor( - alignment: InsideAlignment, - offset: DpOffset, + insideAlignment: InsideAlignment, + outsideAlignment: OutsideAlignment ) : this( value = Value( - alignment = alignment, - offset = offset + insideAlignment = insideAlignment, + outsideAlignment = outsideAlignment, ) ) } override fun calculateRenderValue(base: Value, displacement: Value): Value = Value( - alignment = InsideAlignment( - horizontalBias = base.alignment.horizontalBias - displacement.alignment.horizontalBias, - verticalBias = base.alignment.verticalBias - displacement.alignment.verticalBias, + insideAlignment = InsideAlignment( + horizontalBias = base.insideAlignment.horizontalBias - displacement.insideAlignment.horizontalBias, + verticalBias = base.insideAlignment.verticalBias - displacement.insideAlignment.verticalBias, + ), + outsideAlignment = OutsideAlignment( + horizontalBias = base.outsideAlignment.horizontalBias - displacement.outsideAlignment.horizontalBias, + verticalBias = base.outsideAlignment.verticalBias - displacement.outsideAlignment.verticalBias, ), - offset = base.offset - displacement.offset ) override val modifier: Modifier @@ -117,13 +134,7 @@ class PositionAlignment( val boxScope = requireNotNull(LocalBoxScope.current) with(boxScope) { this@composed - .offset { - IntOffset( - x = (value.value.offset.x.value * density).roundToInt(), - y = (value.value.offset.y.value * density).roundToInt(), - ) - } - .align(value.value.alignment) + .align(value.value) } } @@ -133,23 +144,18 @@ class PositionAlignment( snapTo( Value( - alignment = InsideAlignment( + insideAlignment = InsideAlignment( horizontalBias = lerpFloat( - start = start.value.alignment.horizontalBias, - end = end.value.alignment.horizontalBias, + start = start.value.insideAlignment.horizontalBias, + end = end.value.insideAlignment.horizontalBias, progress = progress ), verticalBias = lerpFloat( - start = start.value.alignment.verticalBias, - end = end.value.alignment.verticalBias, + start = start.value.insideAlignment.verticalBias, + end = end.value.insideAlignment.verticalBias, progress = progress ), ), - offset = lerpDpOffset( - start = start.value.offset, - end = end.value.offset, - progress = progress - ) ) ) } diff --git a/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt b/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt index 49e388e57..3e771f613 100644 --- a/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt +++ b/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt @@ -220,7 +220,7 @@ class ChildrenTransitionScope( val layoutDirection = LocalLayoutDirection.current val positionInsideOffset = positionAlignment?.let { - it.alignment.align(elementSize, containerSize, layoutDirection) + it.insideAlignment.align(elementSize, containerSize, layoutDirection) } ?: IntOffset.Zero val positionOutsideOffset = positionOutside?.let { diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt index dabbfc5d3..e1831b997 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt @@ -59,22 +59,22 @@ class Sample1Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.TopStart), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.TopEnd), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt index ace0090ed..66216dcf0 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt @@ -60,25 +60,25 @@ class Sample2Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.TopStart), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.TopEnd), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt index 543514ed7..8a17cc0ad 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt @@ -165,7 +165,7 @@ fun Target( modifier = with(boxScope) { modifier .size(60.dp) - .align(targetUiState.position.value.alignment) + .align(targetUiState.position.value.insideAlignment) .offset( targetUiState.position.value.offset.x, targetUiState.position.value.offset.y diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt index 78b958c33..e8e10f287 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt @@ -59,22 +59,22 @@ class Sample3Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.TopStart), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(color_primary) ) private val uiStateB = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.TopEnd), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(color_dark) ) private val uiStateC = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.BottomEnd, bottomOffset), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val uiStateD = TargetUiState( - position = PositionAlignment.Target(alignment = InsideAlignment.BottomStart, bottomOffset), + position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } From 568dd070c2db516d07aa7027ac839334c32ee51c Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sat, 7 Oct 2023 17:45:41 +0100 Subject: [PATCH 04/13] Replace usages of PositionOutside to PositionAlignment --- .../cards/ui/CardsVisualisation.kt | 6 +- .../experimental/cards/ui/TargetUiState.kt | 5 +- .../components/modal/ui/ModalVisualisation.kt | 10 +- .../components/modal/ui/TargetUiState.kt | 6 +- .../promoter/ui/PromoterVisualisation.kt | 11 +- .../experimental/promoter/ui/TargetUiState.kt | 2 + .../internal/testdrive/TestDriveExperiment.kt | 8 +- .../backstack/ui/parallax/TargetUiState.kt | 6 +- .../backstack/ui/slider/BackStackSlider.kt | 6 +- .../backstack/ui/slider/TargetUiState.kt | 19 ++- .../backstack/ui/stack3d/BackStack3D.kt | 19 +-- .../backstack/ui/stack3d/TargetUiState.kt | 2 + .../spotlight/ui/slider/SpotlightSlider.kt | 8 +- .../spotlight/ui/slider/TargetUiState.kt | 19 ++- .../sliderrotation/SpotlightSliderRotation.kt | 8 +- .../ui/sliderrotation/TargetUiState.kt | 14 +- .../ui/sliderscale/SpotlightSliderScale.kt | 8 +- .../spotlight/ui/sliderscale/TargetUiState.kt | 46 +++--- .../spotlight/ui/stack3d/SpotlightStack3D.kt | 13 +- .../spotlight/ui/stack3d/TargetUiState.kt | 79 ++++----- .../appyx/interactions/core/AppyxComponent.kt | 13 +- .../impl/position/PositionAlignment.kt | 24 ++- .../property/impl/position/PositionOutside.kt | 156 ------------------ .../navigation/composable/AppyxComponent.kt | 17 +- .../interactions/widgets/ui/TargetUiState.kt | 8 +- .../interactions/widgets/ui/WidgetsStack3D.kt | 4 +- .../SpotlightObserveTransitionsExampleNode.kt | 7 +- .../DragPredictionVisualisation.kt | 10 +- .../demos/dragprediction/TargetUiState.kt | 4 +- .../ObserveMotionPropertiesSample.kt | 4 +- 30 files changed, 207 insertions(+), 335 deletions(-) delete mode 100644 appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOutside.kt diff --git a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt index 7e4dfe0ab..22491d9bf 100644 --- a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt +++ b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt @@ -18,7 +18,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -45,7 +45,7 @@ class CardsVisualisation( ) private val votePass = TargetUiState( - position = PositionOutside.Target( + position = PositionAlignment.Target( BiasAlignment.OutsideAlignment(-voteCardPositionMultiplier, 0) ), scale = Scale.Target(1f), @@ -54,7 +54,7 @@ class CardsVisualisation( ) private val voteLike = TargetUiState( - position = PositionOutside.Target( + position = PositionAlignment.Target( BiasAlignment.OutsideAlignment(voteCardPositionMultiplier, 0) ), scale = Scale.Target(1f), diff --git a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt index b6ee4bd0b..74ab11411 100644 --- a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt +++ b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt @@ -1,17 +1,16 @@ package com.bumble.appyx.components.experimental.cards.ui -import androidx.compose.ui.unit.DpOffset import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( val scale: Scale.Target = Scale.Target(1f), - val position: PositionOutside.Target = PositionOutside.Target(DpOffset.Zero), + val position: PositionAlignment.Target = PositionAlignment.Target(), val rotationZ: RotationZ.Target = RotationZ.Target(0f), val zIndex: ZIndex.Target = ZIndex.Target(0f), ) diff --git a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt index 2854d8216..f8926adca 100644 --- a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt +++ b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt @@ -13,7 +13,7 @@ import com.bumble.appyx.interactions.core.ui.gesture.Gesture import com.bumble.appyx.interactions.core.ui.gesture.GestureFactory import com.bumble.appyx.interactions.core.ui.gesture.dragVerticalDirection import com.bumble.appyx.interactions.core.ui.property.impl.Height -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer @@ -30,27 +30,27 @@ class ModalVisualisation( private val createdState: TargetUiState = TargetUiState( height = Height.Target(0f), - position = PositionOutside.Target(InContainer), + position = PositionAlignment.Target(InContainer), corner = RoundedCorners.Target(8), ) private val modalState: TargetUiState = TargetUiState( height = Height.Target(0.5f), - position = PositionOutside.Target(OutsideAlignment(0f, 0.5f)), + position = PositionAlignment.Target(OutsideAlignment(0f, 0.5f)), corner = RoundedCorners.Target(8), ) private val fullScreenState: TargetUiState = TargetUiState( height = Height.Target(1f), - position = PositionOutside.Target(InContainer), + position = PositionAlignment.Target(InContainer), corner = RoundedCorners.Target(0), ) private val destroyedState: TargetUiState = TargetUiState( height = Height.Target(1f), - position = PositionOutside.Target(OutsideAlignment(0f, 1.5f)), + position = PositionAlignment.Target(OutsideAlignment(0f, 1.5f)), corner = RoundedCorners.Target(0), ) diff --git a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt index 52106df73..fc7fa1867 100644 --- a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt +++ b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt @@ -2,14 +2,14 @@ package com.bumble.appyx.components.modal.ui import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Height -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( val height: Height.Target, - val position: PositionOutside.Target, + val position: PositionAlignment.Target, val corner: RoundedCorners.Target, ) { @@ -19,7 +19,7 @@ class TargetUiState( MutableUiState( uiContext = uiContext, height = Height(uiContext.coroutineScope, height), - position = PositionOutside(uiContext.coroutineScope, position), + position = PositionAlignment(uiContext.coroutineScope, position), corner = RoundedCorners(uiContext.coroutineScope, corner), ) } diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt index 8573230f1..527c2aada 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt @@ -16,6 +16,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.Center import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import kotlin.math.min @@ -73,6 +74,7 @@ class PromoterVisualisation( private fun createTargetUiStates(radius: Float) { created = TargetUiState( position = PositionAlignment.Target(insideAlignment = Center), + positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -86,6 +88,7 @@ class PromoterVisualisation( stage1 = TargetUiState( position = PositionAlignment.Target(insideAlignment = Center), + positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -99,6 +102,7 @@ class PromoterVisualisation( stage2 = TargetUiState( position = PositionAlignment.Target(insideAlignment = Center), + positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -112,6 +116,7 @@ class PromoterVisualisation( stage3 = TargetUiState( position = PositionAlignment.Target(insideAlignment = Center), + positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -125,6 +130,7 @@ class PromoterVisualisation( stage4 = TargetUiState( position = PositionAlignment.Target(insideAlignment = Center), + positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = radius, @@ -138,6 +144,7 @@ class PromoterVisualisation( stage5 = TargetUiState( position = PositionAlignment.Target(insideAlignment = Center), + positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( radius = 0f, @@ -151,7 +158,9 @@ class PromoterVisualisation( destroyed = TargetUiState( position = PositionAlignment.Target( - insideAlignment = Center, + insideAlignment = Center + ), + positionOffset = PositionOffset.Target( offset = DpOffset(500.dp, (-200).dp) ), angularPosition = AngularPosition.Target( diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt index a2c35fd10..aa24fc751 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt @@ -5,11 +5,13 @@ import com.bumble.appyx.interactions.core.ui.property.impl.RotationY import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( val position: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val angularPosition: AngularPosition.Target, val scale: Scale.Target, val rotationY: RotationY.Target, diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt index f0377720b..b61d4f812 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt @@ -2,11 +2,13 @@ package com.bumble.appyx.components.internal.testdrive import androidx.compose.animation.core.Spring import androidx.compose.animation.core.spring +import androidx.compose.foundation.background import androidx.compose.foundation.border import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.aspectRatio import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.offset import androidx.compose.foundation.layout.padding @@ -161,11 +163,7 @@ fun TestDriveUi( Box( modifier = Modifier .size(60.dp) - .align(targetUiState.position.value.insideAlignment) - .offset( - targetUiState.position.value.offset.x, - targetUiState.position.value.offset.y - ) + .align(targetUiState.position.value) .border(2.dp, targetUiState.backgroundColor.value) .semantics { contentDescription = TEST_DRIVE_EXPERIMENT_TEST_HELPER diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt index e5f1fb5fd..9ae8fe616 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt @@ -4,13 +4,13 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.ColorOverlay import com.bumble.appyx.interactions.core.ui.property.impl.Shadow import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused", "MemberVisibilityCanBePrivate", "MagicNumber") @MutableUiStateSpecs class TargetUiState( - val position: PositionOutside.Target = PositionOutside.Target(OutsideAlignment(0f, 0f)), + val position: PositionAlignment.Target = PositionAlignment.Target(OutsideAlignment(0f, 0f)), val shadow: Shadow.Target, val colorOverlay: ColorOverlay.Target, val alpha: Alpha.Target, @@ -22,7 +22,7 @@ class TargetUiState( shadow: Shadow.Target = Shadow.Target(0f), alpha: Alpha.Target = Alpha.Target(1f), ) : this( - position = PositionOutside.Target( + position = PositionAlignment.Target( OutsideAlignment( horizontalBias = offsetMultiplier.coerceIn(-0.5f, 1.5f), verticalBias = 0f diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/BackStackSlider.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/BackStackSlider.kt index 8f3a6362f..1c8d139f9 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/BackStackSlider.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/BackStackSlider.kt @@ -4,7 +4,7 @@ import com.bumble.appyx.components.backstack.BackStackModel import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -16,13 +16,13 @@ class BackStackSlider( private val visible: TargetUiState = TargetUiState( - position = PositionOutside.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), alpha = Alpha.Target(1f), ) private val fadeOut: TargetUiState = TargetUiState( - position = PositionOutside.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), alpha = Alpha.Target(1f), ) diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/TargetUiState.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/TargetUiState.kt index ca60e7dad..b6479be28 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/TargetUiState.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/slider/TargetUiState.kt @@ -1,19 +1,20 @@ package com.bumble.appyx.components.backstack.ui.slider -import androidx.compose.ui.unit.DpOffset import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideRight +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( - val position: PositionOutside.Target, + val positionAlignment: PositionAlignment.Target, val alpha: Alpha.Target, ) { fun toOutsideLeft(multiplier: Float) = TargetUiState( - position = PositionOutside.Target( - alignment = BiasAlignment.OutsideAlignment( + positionAlignment = PositionAlignment.Target( + outsideAlignment = BiasAlignment.OutsideAlignment( horizontalBias = multiplier, verticalBias = 0f ) @@ -22,12 +23,16 @@ class TargetUiState( ) fun toOutsideRight() = TargetUiState( - position = PositionOutside.Target(alignment = BiasAlignment.OutsideAlignment.OutsideRight), + positionAlignment = PositionAlignment.Target( + outsideAlignment = OutsideRight + ), alpha = alpha ) fun toNoOffset() = TargetUiState( - position = PositionOutside.Target(DpOffset.Zero), + positionAlignment = PositionAlignment.Target( + outsideAlignment = InContainer + ), alpha = alpha ) } diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt index 253968f5d..0cfc47f44 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt @@ -20,6 +20,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopCenter import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -30,12 +31,11 @@ class BackStack3D( ) : BaseVisualisation, MutableUiState, TargetUiState>( uiContext = uiContext, ) { - private var width: Dp = 0.dp - private var height: Dp = 0.dp private val topMost: TargetUiState = TargetUiState( - position = PositionAlignment.Target(TopCenter, DpOffset(0f.dp, (itemsInStack * 16).dp)), + position = PositionAlignment.Target(TopCenter), + offset = PositionOffset.Target(DpOffset(0f.dp, (itemsInStack * 16).dp)), scale = Scale.Target(1f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(1f), zIndex = ZIndex.Target(itemsInStack.toFloat()), @@ -45,24 +45,21 @@ class BackStack3D( override fun updateBounds(transitionBounds: TransitionBounds) { super.updateBounds(transitionBounds) - width = transitionBounds.widthDp - height = transitionBounds.heightDp - incoming = incoming(height) + incoming = incoming(transitionBounds.heightDp) } private fun stacked(stackIndex: Int): TargetUiState = TargetUiState( - position = PositionAlignment.Target( - TopCenter, - DpOffset(0f.dp, (itemsInStack - stackIndex) * 16.dp) - ), + position = PositionAlignment.Target(TopCenter), + offset = PositionOffset.Target(DpOffset(0f.dp, (itemsInStack - stackIndex) * 16.dp)), scale = Scale.Target(1f - stackIndex * 0.05f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(if (stackIndex < itemsInStack) 1f else 0f), zIndex = ZIndex.Target(-stackIndex.toFloat()), ) private fun incoming(height: Dp): TargetUiState = TargetUiState( - position = PositionAlignment.Target(TopCenter, DpOffset(0f.dp, height)), + position = PositionAlignment.Target(TopCenter, ), + offset = PositionOffset.Target(DpOffset(0f.dp, height)), scale = Scale.Target(1f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(0f), zIndex = ZIndex.Target(itemsInStack + 1f), diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt index 1bc0e3277..424bae3ae 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt @@ -4,12 +4,14 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( val position: PositionAlignment.Target, + val offset: PositionOffset.Target, val scale: Scale.Target, val alpha: Alpha.Target, val zIndex: ZIndex.Target diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt index 5069ee575..d7c968b17 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt @@ -22,7 +22,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideBottom import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideTop -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -43,19 +43,19 @@ class SpotlightSlider( ) private val created: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideTop), + position = PositionAlignment.Target(OutsideTop), scale = Scale.Target(0f), alpha = Alpha.Target(1f), ) private val standard: TargetUiState = TargetUiState( - position = PositionOutside.Target(InContainer), + position = PositionAlignment.Target(InContainer), scale = Scale.Target(1f), alpha = Alpha.Target(1f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideBottom), + position = PositionAlignment.Target(OutsideBottom), scale = Scale.Target(0f), alpha = Alpha.Target(0f), ) diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt index b90ada2cc..7ced9d95f 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt @@ -2,7 +2,7 @@ package com.bumble.appyx.components.spotlight.ui.slider import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Alpha -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @@ -12,7 +12,7 @@ import kotlinx.coroutines.flow.StateFlow @MutableUiStateSpecs class TargetUiState( private val positionInList: Int = 0, - val position: PositionOutside.Target, + val position: PositionAlignment.Target, val scale: Scale.Target, val alpha: Alpha.Target, ) { @@ -24,9 +24,9 @@ class TargetUiState( positionInList: Int ) : this( positionInList = positionInList, - position = PositionOutside.Target( + position = PositionAlignment.Target( base.position.value.copy( - OutsideAlignment(horizontalBias = positionInList.toFloat(), verticalBias = 0f) + outsideAlignment = OutsideAlignment(horizontalBias = positionInList.toFloat(), verticalBias = 0f) ) ), scale = base.scale, @@ -44,12 +44,15 @@ class TargetUiState( ): MutableUiState = MutableUiState( uiContext = uiContext, - position = PositionOutside( + position = PositionAlignment( coroutineScope = uiContext.coroutineScope, target = position, - displacement = scrollX.mapState(uiContext.coroutineScope) { - PositionOutside.Value( - alignment = OutsideAlignment(horizontalBias = it, verticalBias = 0f) + displacement = scrollX.mapState(uiContext.coroutineScope) { scrollX -> + PositionAlignment.Value( + outsideAlignment = OutsideAlignment( + horizontalBias = scrollX, + verticalBias = 0f + ) ) }, ), diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt index a767ca28e..ca5299cb3 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt @@ -9,7 +9,7 @@ import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.GenericFloatProperty import com.bumble.appyx.interactions.core.ui.property.impl.GenericFloatProperty.Target -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationY import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer @@ -35,21 +35,21 @@ class SpotlightSliderRotation( ) private val created: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideTop), + position = PositionAlignment.Target(OutsideTop), scale = Scale.Target(0f), rotationY = RotationY.Target(0f), alpha = Alpha.Target(1f), ) private val standard: TargetUiState = TargetUiState( - position = PositionOutside.Target(InContainer), + position = PositionAlignment.Target(InContainer), scale = Scale.Target(1f), rotationY = RotationY.Target(0f), alpha = Alpha.Target(1f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideBottom), + position = PositionAlignment.Target(OutsideBottom), scale = Scale.Target(0f), rotationY = RotationY.Target(0f), alpha = Alpha.Target(0f), diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt index dd6fa0e51..09a785aeb 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt @@ -8,7 +8,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.RotationY import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs import com.bumble.appyx.mapState import kotlinx.coroutines.flow.StateFlow @@ -17,7 +17,7 @@ import kotlinx.coroutines.flow.StateFlow @MutableUiStateSpecs class TargetUiState( private val positionInList: Int = 0, - val position: PositionOutside.Target, + val position: PositionAlignment.Target, val scale: Scale.Target, val rotationY: RotationY.Target, val alpha: Alpha.Target, @@ -30,9 +30,9 @@ class TargetUiState( positionInList: Int ) : this( positionInList = positionInList, - position = PositionOutside.Target( + position = PositionAlignment.Target( base.position.value.copy( - BiasAlignment.OutsideAlignment( + outsideAlignment = BiasAlignment.OutsideAlignment( horizontalBias = positionInList.toFloat(), verticalBias = 0f ) @@ -54,12 +54,12 @@ class TargetUiState( ): MutableUiState { return MutableUiState( uiContext = uiContext, - position = PositionOutside( + position = PositionAlignment( coroutineScope = uiContext.coroutineScope, target = position, displacement = scrollX.mapState(uiContext.coroutineScope) { - PositionOutside.Value( - alignment = BiasAlignment.OutsideAlignment( + PositionAlignment.Value( + outsideAlignment = BiasAlignment.OutsideAlignment( horizontalBias = it, verticalBias = 0f ) diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt index c991674ce..faf64af3b 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt @@ -12,7 +12,7 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideBottom import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideTop -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -31,17 +31,17 @@ class SpotlightSliderScale( ) private val created: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideTop), + position = PositionAlignment.Target(OutsideTop), scale = Scale.Target(0f), ) private val standard: TargetUiState = TargetUiState( - position = PositionOutside.Target(InContainer), + position = PositionAlignment.Target(InContainer), scale = Scale.Target(1f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideBottom), + position = PositionAlignment.Target(OutsideBottom), scale = Scale.Target(0f), ) diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt index 19bb8dcca..35da4a6b6 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt @@ -3,7 +3,7 @@ package com.bumble.appyx.components.spotlight.ui.sliderscale import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs import com.bumble.appyx.mapState import kotlinx.coroutines.flow.StateFlow @@ -13,7 +13,7 @@ import kotlin.math.abs @MutableUiStateSpecs class TargetUiState( private val positionInList: Int = 0, - val position: PositionOutside.Target, + val position: PositionAlignment.Target, val scale: Scale.Target, ) { /** @@ -24,9 +24,9 @@ class TargetUiState( positionInList: Int ) : this( positionInList = positionInList, - position = PositionOutside.Target( + position = PositionAlignment.Target( base.position.value.copy( - BiasAlignment.OutsideAlignment( + outsideAlignment = BiasAlignment.OutsideAlignment( horizontalBias = positionInList.toFloat(), verticalBias = 0f ) @@ -43,26 +43,24 @@ class TargetUiState( fun toMutableState( uiContext: UiContext, scrollX: StateFlow - ): MutableUiState { - return MutableUiState( - uiContext = uiContext, - position = PositionOutside( - coroutineScope = uiContext.coroutineScope, - target = position, - displacement = scrollX.mapState(uiContext.coroutineScope) { - PositionOutside.Value( - alignment = BiasAlignment.OutsideAlignment( - horizontalBias = it, - verticalBias = 0f - ) + ): MutableUiState = MutableUiState( + uiContext = uiContext, + position = PositionAlignment( + coroutineScope = uiContext.coroutineScope, + target = position, + displacement = scrollX.mapState(uiContext.coroutineScope) { + PositionAlignment.Value( + outsideAlignment = BiasAlignment.OutsideAlignment( + horizontalBias = it, + verticalBias = 0f ) - }, - ), - scale = Scale(uiContext.coroutineScope, scale, - displacement = scrollX.mapState(uiContext.coroutineScope) { - (abs(positionInList - it) - 0.15f).coerceIn(0f, 0.25f) - } - ) + ) + }, + ), + scale = Scale(uiContext.coroutineScope, scale, + displacement = scrollX.mapState(uiContext.coroutineScope) { + (abs(positionInList - it) - 0.15f).coerceIn(0f, 0.25f) + } ) - } + ) } diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/SpotlightStack3D.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/SpotlightStack3D.kt index 96c1309e5..eeb9cd24b 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/SpotlightStack3D.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/SpotlightStack3D.kt @@ -1,6 +1,7 @@ package com.bumble.appyx.components.spotlight.ui.stack3d import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.dp import com.bumble.appyx.components.spotlight.SpotlightModel.State import com.bumble.appyx.components.spotlight.SpotlightModel.State.ElementState.CREATED @@ -15,7 +16,8 @@ import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideBottom import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.OutsideTop -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.mapState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -42,21 +44,24 @@ class SpotlightStack3D( ) private val created: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideTop), + positionAlignment = PositionAlignment.Target(OutsideTop), + positionOffset = PositionOffset.Target(DpOffset.Zero), scale = Scale.Target(2.5f), alpha = Alpha.Target(0f), zIndex = ZIndex.Target(0f), ) private val standard: TargetUiState = TargetUiState( - position = PositionOutside.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), + positionOffset = PositionOffset.Target(DpOffset.Zero), scale = Scale.Target(1f), alpha = Alpha.Target(1f), zIndex = ZIndex.Target(0f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionOutside.Target(OutsideBottom), + positionAlignment = PositionAlignment.Target(OutsideBottom), + positionOffset = PositionOffset.Target(DpOffset.Zero), scale = Scale.Target(0.25f), alpha = Alpha.Target(0f), zIndex = ZIndex.Target(0f), diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/TargetUiState.kt index 6648a1fdb..7e5b6f145 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/stack3d/TargetUiState.kt @@ -9,7 +9,8 @@ import com.bumble.appyx.interactions.core.ui.math.smoothstep import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs import com.bumble.appyx.mapState import kotlinx.coroutines.flow.StateFlow @@ -18,7 +19,8 @@ import kotlinx.coroutines.flow.StateFlow @MutableUiStateSpecs class TargetUiState( val positionInList: Int = 0, - val position: PositionOutside.Target, + val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val scale: Scale.Target, val alpha: Alpha.Target, val zIndex: ZIndex.Target, @@ -28,7 +30,8 @@ class TargetUiState( positionInList: Int, ) : this( positionInList = positionInList, - position = base.position, + positionAlignment = base.positionAlignment, + positionOffset = base.positionOffset, scale = base.scale, alpha = base.alpha, zIndex = base.zIndex, @@ -39,39 +42,41 @@ class TargetUiState( scrollX: StateFlow, itemHeight: Dp, itemsInStack: Int = 3, - ): MutableUiState { - return MutableUiState( - uiContext = uiContext, - position = PositionOutside( - coroutineScope = uiContext.coroutineScope, - target = position, - displacement = scrollX.mapState(uiContext.coroutineScope) { - val factor = 0.075f + smoothstep(0f, 1f, it) - PositionOutside.Value( - offset = DpOffset( - x = 0.dp, - y = (-factor * it * itemHeight.value / (1f - 0.1f * it)).dp, - ) + ): MutableUiState = MutableUiState( + uiContext = uiContext, + positionAlignment = PositionAlignment( + coroutineScope = uiContext.coroutineScope, + target = positionAlignment, + ), + positionOffset = PositionOffset( + coroutineScope = uiContext.coroutineScope, + target = positionOffset, + displacement = scrollX.mapState(uiContext.coroutineScope) { + val factor = 0.075f + smoothstep(0f, 1f, it) + PositionOffset.Value( + offset = DpOffset( + x = 0.dp, + y = (-factor * it * itemHeight.value / (1f - 0.1f * it)).dp, ) - } - ), - scale = Scale( - coroutineScope = uiContext.coroutineScope, - target = scale, - displacement = scrollX.mapState(uiContext.coroutineScope) { -0.1f * it }, - ), - alpha = Alpha( - coroutineScope = uiContext.coroutineScope, - target = alpha, - displacement = scrollX.mapState(uiContext.coroutineScope) { - clamp(it, 0f, 1f) + clamp(-it - itemsInStack, 0f, 1f) - }, - ), - zIndex = ZIndex( - coroutineScope = uiContext.coroutineScope, - target = zIndex, - displacement = scrollX.mapState(uiContext.coroutineScope) { -it } - ), - ) - } + ) + } + ), + scale = Scale( + coroutineScope = uiContext.coroutineScope, + target = scale, + displacement = scrollX.mapState(uiContext.coroutineScope) { -0.1f * it }, + ), + alpha = Alpha( + coroutineScope = uiContext.coroutineScope, + target = alpha, + displacement = scrollX.mapState(uiContext.coroutineScope) { + clamp(it, 0f, 1f) + clamp(-it - itemsInStack, 0f, 1f) + }, + ), + zIndex = ZIndex( + coroutineScope = uiContext.coroutineScope, + target = zIndex, + displacement = scrollX.mapState(uiContext.coroutineScope) { -it } + ), + ) } diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt index aa481ec1a..cbae84b24 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/AppyxComponent.kt @@ -41,7 +41,6 @@ import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.output.ElementUiModel import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside import com.bumble.appyx.interactions.core.ui.property.motionPropertyRenderValue private val defaultExtraTouch = 48f.dp @@ -181,18 +180,12 @@ fun elementOffset( elementSize: IntSize, containerSize: IntSize, ): IntOffset { - val positionAlignment = motionPropertyRenderValue() - val positionOutside = motionPropertyRenderValue() val layoutDirection = LocalLayoutDirection.current - val positionInsideOffset = positionAlignment?.let { - it.insideAlignment.align(elementSize, containerSize, layoutDirection) - } ?: IntOffset.Zero - - val positionOutsideOffset = positionOutside?.let { - it.alignment.align(elementSize, containerSize, layoutDirection) + val alignmentOffset = positionAlignment?.let { + it.align(elementSize, containerSize, layoutDirection) } ?: IntOffset.Zero - return positionInsideOffset + positionOutsideOffset + return alignmentOffset } diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt index 4471e554c..ba6245559 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionAlignment.kt @@ -21,6 +21,7 @@ import com.bumble.appyx.interactions.core.ui.property.MotionProperty import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment.Value import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.flow.MutableStateFlow @@ -46,7 +47,7 @@ class PositionAlignment( data class Value( val insideAlignment: InsideAlignment = TopStart, - val outsideAlignment: OutsideAlignment = OutsideAlignment.InContainer, + val outsideAlignment: OutsideAlignment = InContainer, ) : Alignment { override fun align( @@ -87,6 +88,13 @@ class PositionAlignment( val easing: Easing? = null, ) : MotionProperty.Target { + constructor() : this( + value = Value( + insideAlignment = TopStart, + outsideAlignment = InContainer, + ) + ) + constructor( outsideAlignment: OutsideAlignment ) : this( @@ -101,7 +109,7 @@ class PositionAlignment( ) : this( value = Value( insideAlignment = insideAlignment, - outsideAlignment = OutsideAlignment.InContainer, + outsideAlignment = InContainer, ) ) @@ -156,6 +164,18 @@ class PositionAlignment( progress = progress ), ), + outsideAlignment = OutsideAlignment( + horizontalBias = lerpFloat( + start = start.value.outsideAlignment.horizontalBias, + end = end.value.outsideAlignment.horizontalBias, + progress = progress + ), + verticalBias = lerpFloat( + start = start.value.outsideAlignment.verticalBias, + end = end.value.outsideAlignment.verticalBias, + progress = progress + ), + ), ) ) } diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOutside.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOutside.kt deleted file mode 100644 index 4eded965b..000000000 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOutside.kt +++ /dev/null @@ -1,156 +0,0 @@ -package com.bumble.appyx.interactions.core.ui.property.impl.position - -import androidx.compose.animation.core.Animatable -import androidx.compose.animation.core.AnimationVector4D -import androidx.compose.animation.core.Easing -import androidx.compose.animation.core.TwoWayConverter -import androidx.compose.foundation.layout.offset -import androidx.compose.runtime.collectAsState -import androidx.compose.ui.Modifier -import androidx.compose.ui.composed -import androidx.compose.ui.unit.DpOffset -import androidx.compose.ui.unit.IntOffset -import androidx.compose.ui.unit.dp -import com.bumble.appyx.interactions.core.ui.LocalBoxScope -import com.bumble.appyx.interactions.core.ui.math.lerpDpOffset -import com.bumble.appyx.interactions.core.ui.math.lerpFloat -import com.bumble.appyx.interactions.core.ui.property.Interpolatable -import com.bumble.appyx.interactions.core.ui.property.MotionProperty -import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside.Value -import kotlinx.coroutines.CoroutineScope -import kotlinx.coroutines.flow.MutableStateFlow -import kotlinx.coroutines.flow.StateFlow -import kotlin.math.roundToInt - -@Suppress("MagicNumber") -class PositionOutside( - coroutineScope: CoroutineScope, - val target: Target, - displacement: StateFlow = MutableStateFlow(Value.Zero), - visibilityThreshold: Value = Value(OutsideAlignment(0.001f, 0.001f), DpOffset(1.dp, 1.dp)), -) : MotionProperty( - coroutineScope = coroutineScope, - animatable = Animatable(target.value, Value.VectorConverter), - easing = target.easing, - visibilityThreshold = visibilityThreshold, - displacement = displacement -), Interpolatable { - - data class Value( - val alignment: OutsideAlignment = OutsideAlignment(0f, 0f), - val offset: DpOffset = DpOffset.Zero - ) { - companion object { - val VectorConverter: TwoWayConverter = - TwoWayConverter( - convertToVector = { - AnimationVector4D( - v1 = it.offset.x.value, - v2 = it.offset.y.value, - v3 = it.alignment.horizontalBias, - v4 = it.alignment.verticalBias, - ) - }, - convertFromVector = { - Value( - alignment = OutsideAlignment(it.v3, it.v4), - offset = DpOffset(it.v1.dp, it.v2.dp) - ) - } - ) - - val Zero = Value( - alignment = OutsideAlignment(0f, 0f), - offset = DpOffset.Zero - ) - } - } - - class Target( - val value: Value, - val easing: Easing? = null, - ) : MotionProperty.Target { - - constructor( - offset: DpOffset - ) : this( - value = Value( - alignment = OutsideAlignment(0f, 0f), - offset = offset - ) - ) - - constructor( - alignment: OutsideAlignment - ) : this( - value = Value( - alignment = alignment, - offset = DpOffset.Zero - ) - ) - - constructor( - alignment: OutsideAlignment, - offset: DpOffset, - ) : this( - value = Value( - alignment = alignment, - offset = offset - ) - ) - } - - override fun calculateRenderValue(base: Value, displacement: Value): Value = - Value( - alignment = OutsideAlignment( - horizontalBias = base.alignment.horizontalBias - displacement.alignment.horizontalBias, - verticalBias = base.alignment.verticalBias - displacement.alignment.verticalBias, - ), - offset = base.offset - displacement.offset - ) - - override val modifier: Modifier - get() = Modifier.composed { - val value = renderValueFlow.collectAsState() - val boxScope = requireNotNull(LocalBoxScope.current) - - with(boxScope) { - this@composed - .offset { - IntOffset( - x = (value.value.offset.x.value * density).roundToInt(), - y = (value.value.offset.y.value * density).roundToInt(), - ) - } - .align(value.value.alignment) - } - - } - - override suspend fun lerpTo(start: Target, end: Target, fraction: Float) { - val progress = easingTransform(end.easing, fraction) - - snapTo( - Value( - alignment = OutsideAlignment( - horizontalBias = lerpFloat( - start = start.value.alignment.horizontalBias, - end = end.value.alignment.horizontalBias, - progress = progress - ), - verticalBias = lerpFloat( - start = start.value.alignment.verticalBias, - end = end.value.alignment.verticalBias, - progress = progress - ), - ), - offset = lerpDpOffset( - start = start.value.offset, - end = end.value.offset, - progress = progress - ) - ) - ) - } -} diff --git a/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt b/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt index 3e771f613..92d4df522 100644 --- a/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt +++ b/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/composable/AppyxComponent.kt @@ -41,7 +41,6 @@ import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.output.ElementUiModel import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside import com.bumble.appyx.interactions.core.ui.property.motionPropertyRenderValue import com.bumble.appyx.navigation.integration.LocalScreenSize import com.bumble.appyx.navigation.node.ParentNode @@ -210,23 +209,17 @@ class ChildrenTransitionScope( } @Composable - private fun elementOffset( + fun elementOffset( elementSize: IntSize, - containerSize: IntSize + containerSize: IntSize, ): IntOffset { - val positionAlignment = motionPropertyRenderValue() - val positionOutside = motionPropertyRenderValue() val layoutDirection = LocalLayoutDirection.current - val positionInsideOffset = positionAlignment?.let { - it.insideAlignment.align(elementSize, containerSize, layoutDirection) - } ?: IntOffset.Zero - - val positionOutsideOffset = positionOutside?.let { - it.alignment.align(elementSize, containerSize, layoutDirection) + val alignmentOffset = positionAlignment?.let { + it.align(elementSize, containerSize, layoutDirection) } ?: IntOffset.Zero - return positionInsideOffset + positionOutsideOffset + return alignmentOffset } } diff --git a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt index 68a7c9676..f9362064b 100644 --- a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt +++ b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt @@ -8,7 +8,7 @@ import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.math.clamp import com.bumble.appyx.interactions.core.ui.math.smoothstep import com.bumble.appyx.interactions.core.ui.property.impl.Alpha -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationX import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex @@ -20,7 +20,7 @@ import kotlinx.coroutines.flow.StateFlow class TargetUiState( val positionInList: Int = 0, val rotationX: RotationX.Target, - val position: PositionOutside.Target, + val position: PositionAlignment.Target, val scale: Scale.Target, val alpha: Alpha.Target, val zIndex: ZIndex.Target, @@ -54,12 +54,12 @@ class TargetUiState( }, origin = TransformOrigin(0.075f, 0f), ), - position = PositionOutside( + position = PositionAlignment( coroutineScope = uiContext.coroutineScope, target = position, displacement = scrollX.mapState(uiContext.coroutineScope) { val factor = 0.075f + smoothstep(0f, 1f, it) - PositionOutside.Value( + PositionAlignment.Value( offset = DpOffset( x = (-0.125f * it * itemWidth.value).dp, y = (-factor * it * itemHeight.value / (1f - 0.1f * it)).dp, diff --git a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt index f74653c2e..ce78e3e7f 100644 --- a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt +++ b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt @@ -8,7 +8,7 @@ import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.GenericFloatProperty -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationX import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex @@ -66,7 +66,7 @@ class WidgetsStack3D( private companion object { val default: TargetUiState = TargetUiState( rotationX = RotationX.Target(0f), - position = PositionOutside.Target(DpOffset.Zero), + position = PositionAlignment.Target(DpOffset.Zero), scale = Scale.Target(1f), alpha = Alpha.Target(1f), zIndex = ZIndex.Target(0f), diff --git a/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt b/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt index 95aefa6b4..aa1d97910 100644 --- a/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt +++ b/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt @@ -30,7 +30,7 @@ import com.bumble.appyx.components.spotlight.operation.updateElements import com.bumble.appyx.components.spotlight.ui.slider.SpotlightSlider import com.bumble.appyx.components.spotlight.ui.sliderrotation.SpotlightSliderRotation import com.bumble.appyx.interactions.core.ui.property.impl.RotationY -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.motionPropertyRenderValue import com.bumble.appyx.navigation.colors import com.bumble.appyx.navigation.composable.AppyxComponent @@ -85,11 +85,10 @@ class SpotlightObserveTransitionsExampleNode( Column(modifier = Modifier.align(Alignment.Center)) { - val alignment = - motionPropertyRenderValue()?.alignment + val alignment = motionPropertyRenderValue() if (alignment != null) { Text( - text = "Offset: ${(alignment.horizontalBias * 100).toTwoPointPrecisionString()}%", + text = "Offset: ${(alignment.outsideAlignment.horizontalBias * 100).toTwoPointPrecisionString()}%", fontSize = 20.sp, color = Color.Black, fontWeight = FontWeight.Bold diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt index 4048314ee..1b218c1cd 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt @@ -25,7 +25,7 @@ import com.bumble.appyx.interactions.core.ui.gesture.GestureFactory import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState @@ -63,21 +63,21 @@ class DragPredictionVisualisation( // Top-left corner, A private val uiStateA = TargetUiState( - position = PositionOutside.Target(DpOffset(0.dp, 0.dp)), + position = PositionAlignment.Target(DpOffset(0.dp, 0.dp)), scale = Scale.Target(1f), backgroundColor = BackgroundColor.Target(color_primary) ) // Top-right corner, B private val uiStateB = TargetUiState( - position = PositionOutside.Target(DpOffset(180.dp, 30.dp)), + position = PositionAlignment.Target(DpOffset(180.dp, 30.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), backgroundColor = BackgroundColor.Target(color_dark) ) // Bottom-right corner, C private val uiStateC = TargetUiState( - position = PositionOutside.Target(DpOffset(180.dp, 180.dp)), + position = PositionAlignment.Target(DpOffset(180.dp, 180.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), rotationZ = RotationZ.Target(90f), backgroundColor = BackgroundColor.Target(color_secondary) @@ -85,7 +85,7 @@ class DragPredictionVisualisation( // Bottom-left corner, D private val uiStateD = TargetUiState( - position = PositionOutside.Target(DpOffset(30.dp, 180.dp)), + position = PositionAlignment.Target(DpOffset(30.dp, 180.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_tertiary) diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt index 6625b7ae5..01b6867e7 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt @@ -1,7 +1,7 @@ package com.bumble.appyx.demos.dragprediction import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.Scale @@ -10,7 +10,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionOutside.Target, + val position: PositionAlignment.Target, val scale: Scale.Target, val rotationZ: RotationZ.Target = RotationZ.Target(0f), val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), diff --git a/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt b/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt index 9c6f517dc..cc526878c 100644 --- a/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt +++ b/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt @@ -28,7 +28,7 @@ import com.bumble.appyx.demos.common.InteractionTarget import com.bumble.appyx.demos.common.colors import com.bumble.appyx.interactions.core.ui.output.ElementUiModel import com.bumble.appyx.interactions.core.ui.property.impl.RotationY -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOutside +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.motionPropertyRenderValue import kotlin.math.roundToInt @@ -106,7 +106,7 @@ fun ModalUi( color = Color.White ) val alignment = - motionPropertyRenderValue()?.alignment + motionPropertyRenderValue()?.alignment if (alignment != null) { Text( text = "Offset: ${roundFloatToTwoDecimals(alignment.horizontalBias * 100)}%", From 575905751426bb3007ad78a4292e7f5c5711129b Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sat, 7 Oct 2023 18:13:56 +0100 Subject: [PATCH 05/13] Fix and unify field naming --- .../cards/ui/CardsVisualisation.kt | 4 ++-- .../experimental/cards/ui/TargetUiState.kt | 2 +- .../components/modal/ui/ModalVisualisation.kt | 8 ++++---- .../components/modal/ui/TargetUiState.kt | 4 ++-- .../promoter/ui/PromoterVisualisation.kt | 14 ++++++------- .../experimental/promoter/ui/TargetUiState.kt | 2 +- .../puzzle15/ui/Puzzle15Visualisation.kt | 2 +- .../experimental/puzzle15/ui/TargetUiState.kt | 2 +- .../internal/testdrive/TestDriveExperiment.kt | 5 +---- .../testdrive/ui/rotation/TargetUiState.kt | 2 +- .../TestDriveRotationVisualisation.kt | 8 ++++---- .../testdrive/ui/simple/TargetUiState.kt | 2 +- .../ui/simple/TestDriveSimpleVisualisation.kt | 8 ++++---- .../backstack/ui/parallax/TargetUiState.kt | 5 +++-- .../backstack/ui/stack3d/BackStack3D.kt | 12 +++++------ .../backstack/ui/stack3d/TargetUiState.kt | 4 ++-- .../spotlight/ui/slider/SpotlightSlider.kt | 6 +++--- .../spotlight/ui/slider/TargetUiState.kt | 15 ++++++++------ .../sliderrotation/SpotlightSliderRotation.kt | 6 +++--- .../ui/sliderrotation/TargetUiState.kt | 10 +++++----- .../ui/sliderscale/SpotlightSliderScale.kt | 6 +++--- .../spotlight/ui/sliderscale/TargetUiState.kt | 10 +++++----- .../ui/state/MutableUiStateTest.kt | 10 +++++----- .../ui/state/TestMutableUiState.kt | 14 ++++++------- .../ui/state/TestTargetUiState.kt | 4 +++- .../property/impl/position/PositionOffset.kt | 1 - .../interactions/widgets/ui/TargetUiState.kt | 12 +++++------ .../interactions/widgets/ui/WidgetsStack3D.kt | 20 ++++--------------- .../demos/dragprediction/DragPrediction.kt | 4 ++-- .../DragPredictionVisualisation.kt | 12 +++++------ .../demos/dragprediction/TargetUiState.kt | 2 +- .../IncompleteDragVisualisation.kt | 8 ++++---- .../demos/incompletedrag/TargetUiState.kt | 2 +- .../demos/sample1/Sample1Visualisation.kt | 8 ++++---- .../appyx/demos/sample1/TargetUiState.kt | 2 +- .../demos/sample2/Sample2Visualisation.kt | 8 ++++---- .../appyx/demos/sample2/TargetUiState.kt | 2 +- .../com/bumble/appyx/demos/sample3/Sample3.kt | 6 +++--- .../demos/sample3/Sample3Visualisation.kt | 8 ++++---- .../appyx/demos/sample3/TargetUiState.kt | 2 +- 40 files changed, 126 insertions(+), 136 deletions(-) diff --git a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt index 22491d9bf..41b2971c3 100644 --- a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt +++ b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/CardsVisualisation.kt @@ -45,7 +45,7 @@ class CardsVisualisation( ) private val votePass = TargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( BiasAlignment.OutsideAlignment(-voteCardPositionMultiplier, 0) ), scale = Scale.Target(1f), @@ -54,7 +54,7 @@ class CardsVisualisation( ) private val voteLike = TargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( BiasAlignment.OutsideAlignment(voteCardPositionMultiplier, 0) ), scale = Scale.Target(1f), diff --git a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt index 74ab11411..ae37f327b 100644 --- a/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt +++ b/appyx-components/experimental/cards/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/cards/ui/TargetUiState.kt @@ -10,7 +10,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( val scale: Scale.Target = Scale.Target(1f), - val position: PositionAlignment.Target = PositionAlignment.Target(), + val positionAlignment: PositionAlignment.Target = PositionAlignment.Target(), val rotationZ: RotationZ.Target = RotationZ.Target(0f), val zIndex: ZIndex.Target = ZIndex.Target(0f), ) diff --git a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt index f8926adca..b8aa331bd 100644 --- a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt +++ b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/ModalVisualisation.kt @@ -30,27 +30,27 @@ class ModalVisualisation( private val createdState: TargetUiState = TargetUiState( height = Height.Target(0f), - position = PositionAlignment.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), corner = RoundedCorners.Target(8), ) private val modalState: TargetUiState = TargetUiState( height = Height.Target(0.5f), - position = PositionAlignment.Target(OutsideAlignment(0f, 0.5f)), + positionAlignment = PositionAlignment.Target(OutsideAlignment(0f, 0.5f)), corner = RoundedCorners.Target(8), ) private val fullScreenState: TargetUiState = TargetUiState( height = Height.Target(1f), - position = PositionAlignment.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), corner = RoundedCorners.Target(0), ) private val destroyedState: TargetUiState = TargetUiState( height = Height.Target(1f), - position = PositionAlignment.Target(OutsideAlignment(0f, 1.5f)), + positionAlignment = PositionAlignment.Target(OutsideAlignment(0f, 1.5f)), corner = RoundedCorners.Target(0), ) diff --git a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt index fc7fa1867..8eb48df61 100644 --- a/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt +++ b/appyx-components/experimental/modal/common/src/commonMain/kotlin/com/bumble/appyx/components/modal/ui/TargetUiState.kt @@ -9,7 +9,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( val height: Height.Target, - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val corner: RoundedCorners.Target, ) { @@ -19,7 +19,7 @@ class TargetUiState( MutableUiState( uiContext = uiContext, height = Height(uiContext.coroutineScope, height), - position = PositionAlignment(uiContext.coroutineScope, position), + positionAlignment = PositionAlignment(uiContext.coroutineScope, positionAlignment), corner = RoundedCorners(uiContext.coroutineScope, corner), ) } diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt index 527c2aada..a57f582df 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/PromoterVisualisation.kt @@ -73,7 +73,7 @@ class PromoterVisualisation( @Suppress("LongMethod") private fun createTargetUiStates(radius: Float) { created = TargetUiState( - position = PositionAlignment.Target(insideAlignment = Center), + positionAlignment = PositionAlignment.Target(insideAlignment = Center), positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( @@ -87,7 +87,7 @@ class PromoterVisualisation( ) stage1 = TargetUiState( - position = PositionAlignment.Target(insideAlignment = Center), + positionAlignment = PositionAlignment.Target(insideAlignment = Center), positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( @@ -101,7 +101,7 @@ class PromoterVisualisation( ) stage2 = TargetUiState( - position = PositionAlignment.Target(insideAlignment = Center), + positionAlignment = PositionAlignment.Target(insideAlignment = Center), positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( @@ -115,7 +115,7 @@ class PromoterVisualisation( ) stage3 = TargetUiState( - position = PositionAlignment.Target(insideAlignment = Center), + positionAlignment = PositionAlignment.Target(insideAlignment = Center), positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( @@ -129,7 +129,7 @@ class PromoterVisualisation( ) stage4 = TargetUiState( - position = PositionAlignment.Target(insideAlignment = Center), + positionAlignment = PositionAlignment.Target(insideAlignment = Center), positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( @@ -143,7 +143,7 @@ class PromoterVisualisation( ) stage5 = TargetUiState( - position = PositionAlignment.Target(insideAlignment = Center), + positionAlignment = PositionAlignment.Target(insideAlignment = Center), positionOffset = PositionOffset.Target(), angularPosition = AngularPosition.Target( AngularPosition.Value( @@ -157,7 +157,7 @@ class PromoterVisualisation( ) destroyed = TargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( insideAlignment = Center ), positionOffset = PositionOffset.Target( diff --git a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt index aa24fc751..ef101fa25 100644 --- a/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt +++ b/appyx-components/experimental/promoter/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/promoter/ui/TargetUiState.kt @@ -10,7 +10,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val positionOffset: PositionOffset.Target, val angularPosition: AngularPosition.Target, val scale: Scale.Target, diff --git a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt index f2dc180cc..5db9d1fdd 100644 --- a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt +++ b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/Puzzle15Visualisation.kt @@ -35,7 +35,7 @@ class Puzzle15Visualisation( MatchedTargetUiState( element = tileElements, targetUiState = TargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( insideAlignment = fractionAlignment( horizontalBiasFraction = (index % CELLS_COUNT).toFloat() / (CELLS_COUNT - 1), verticalBiasFraction = (index / CELLS_COUNT).toFloat() / (CELLS_COUNT - 1) diff --git a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt index f48fe6522..619f8da6a 100644 --- a/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt +++ b/appyx-components/experimental/puzzle15/common/src/commonMain/kotlin/com/bumble/appyx/components/experimental/puzzle15/ui/TargetUiState.kt @@ -5,5 +5,5 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target = PositionAlignment.Target() + val positionAlignment: PositionAlignment.Target = PositionAlignment.Target() ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt index b61d4f812..b70c4c139 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/TestDriveExperiment.kt @@ -2,15 +2,12 @@ package com.bumble.appyx.components.internal.testdrive import androidx.compose.animation.core.Spring import androidx.compose.animation.core.spring -import androidx.compose.foundation.background import androidx.compose.foundation.border import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.aspectRatio import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.offset import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.material.Button @@ -163,7 +160,7 @@ fun TestDriveUi( Box( modifier = Modifier .size(60.dp) - .align(targetUiState.position.value) + .align(targetUiState.positionAlignment.value) .border(2.dp, targetUiState.backgroundColor.value) .semantics { contentDescription = TEST_DRIVE_EXPERIMENT_TEST_HELPER diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt index 7aededa03..307febd78 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TargetUiState.kt @@ -8,7 +8,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val rotationZ: RotationZ.Target, val backgroundColor: BackgroundColor.Target, ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt index 26f51730a..bda5c9c86 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/rotation/TestDriveRotationVisualisation.kt @@ -46,25 +46,25 @@ class TestDriveRotationVisualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(md_red_500) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(md_light_green_500) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(InsideAlignment.CenterEnd), + positionAlignment = PositionAlignment.Target(InsideAlignment.CenterEnd), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(md_yellow_500) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(InsideAlignment.CenterStart), + positionAlignment = PositionAlignment.Target(InsideAlignment.CenterStart), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(md_light_blue_500) ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt index e227edee0..e922c29e2 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TargetUiState.kt @@ -7,6 +7,6 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val backgroundColor: BackgroundColor.Target, ) diff --git a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt index eb3b2e8d9..3d619438a 100644 --- a/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt +++ b/appyx-components/internal/test-drive/common/src/commonMain/kotlin/com/bumble/appyx/components/internal/testdrive/ui/simple/TestDriveSimpleVisualisation.kt @@ -60,22 +60,22 @@ class TestDriveSimpleVisualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(md_red_500) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(md_light_green_500) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.CenterEnd), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.CenterEnd), backgroundColor = BackgroundColor.Target(md_yellow_500) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.CenterStart), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.CenterStart), backgroundColor = BackgroundColor.Target(md_light_blue_500) ) } diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt index 9ae8fe616..8d1ac4860 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/parallax/TargetUiState.kt @@ -4,13 +4,14 @@ import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.ColorOverlay import com.bumble.appyx.interactions.core.ui.property.impl.Shadow import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment.Companion.InContainer import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused", "MemberVisibilityCanBePrivate", "MagicNumber") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target = PositionAlignment.Target(OutsideAlignment(0f, 0f)), + val positionAlignment: PositionAlignment.Target = PositionAlignment.Target(InContainer), val shadow: Shadow.Target, val colorOverlay: ColorOverlay.Target, val alpha: Alpha.Target, @@ -22,7 +23,7 @@ class TargetUiState( shadow: Shadow.Target = Shadow.Target(0f), alpha: Alpha.Target = Alpha.Target(1f), ) : this( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( OutsideAlignment( horizontalBias = offsetMultiplier.coerceIn(-0.5f, 1.5f), verticalBias = 0f diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt index 0cfc47f44..87022f52d 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/BackStack3D.kt @@ -34,8 +34,8 @@ class BackStack3D( private val topMost: TargetUiState = TargetUiState( - position = PositionAlignment.Target(TopCenter), - offset = PositionOffset.Target(DpOffset(0f.dp, (itemsInStack * 16).dp)), + positionAlignment = PositionAlignment.Target(TopCenter), + positionOffset = PositionOffset.Target(DpOffset(0f.dp, (itemsInStack * 16).dp)), scale = Scale.Target(1f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(1f), zIndex = ZIndex.Target(itemsInStack.toFloat()), @@ -50,16 +50,16 @@ class BackStack3D( private fun stacked(stackIndex: Int): TargetUiState = TargetUiState( - position = PositionAlignment.Target(TopCenter), - offset = PositionOffset.Target(DpOffset(0f.dp, (itemsInStack - stackIndex) * 16.dp)), + positionAlignment = PositionAlignment.Target(TopCenter), + positionOffset = PositionOffset.Target(DpOffset(0f.dp, (itemsInStack - stackIndex) * 16.dp)), scale = Scale.Target(1f - stackIndex * 0.05f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(if (stackIndex < itemsInStack) 1f else 0f), zIndex = ZIndex.Target(-stackIndex.toFloat()), ) private fun incoming(height: Dp): TargetUiState = TargetUiState( - position = PositionAlignment.Target(TopCenter, ), - offset = PositionOffset.Target(DpOffset(0f.dp, height)), + positionAlignment = PositionAlignment.Target(TopCenter, ), + positionOffset = PositionOffset.Target(DpOffset(0f.dp, height)), scale = Scale.Target(1f, origin = TransformOrigin(0.5f, 0.0f)), alpha = Alpha.Target(0f), zIndex = ZIndex.Target(itemsInStack + 1f), diff --git a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt index 424bae3ae..49ea5e535 100644 --- a/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt +++ b/appyx-components/stable/backstack/common/src/commonMain/kotlin/com/bumble/appyx/components/backstack/ui/stack3d/TargetUiState.kt @@ -10,8 +10,8 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, - val offset: PositionOffset.Target, + val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val scale: Scale.Target, val alpha: Alpha.Target, val zIndex: ZIndex.Target diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt index d7c968b17..9a81161d7 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/SpotlightSlider.kt @@ -43,19 +43,19 @@ class SpotlightSlider( ) private val created: TargetUiState = TargetUiState( - position = PositionAlignment.Target(OutsideTop), + positionAlignment = PositionAlignment.Target(OutsideTop), scale = Scale.Target(0f), alpha = Alpha.Target(1f), ) private val standard: TargetUiState = TargetUiState( - position = PositionAlignment.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), scale = Scale.Target(1f), alpha = Alpha.Target(1f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionAlignment.Target(OutsideBottom), + positionAlignment = PositionAlignment.Target(OutsideBottom), scale = Scale.Target(0f), alpha = Alpha.Target(0f), ) diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt index 7ced9d95f..87b3ca653 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt @@ -12,7 +12,7 @@ import kotlinx.coroutines.flow.StateFlow @MutableUiStateSpecs class TargetUiState( private val positionInList: Int = 0, - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val scale: Scale.Target, val alpha: Alpha.Target, ) { @@ -24,9 +24,12 @@ class TargetUiState( positionInList: Int ) : this( positionInList = positionInList, - position = PositionAlignment.Target( - base.position.value.copy( - outsideAlignment = OutsideAlignment(horizontalBias = positionInList.toFloat(), verticalBias = 0f) + positionAlignment = PositionAlignment.Target( + base.positionAlignment.value.copy( + outsideAlignment = OutsideAlignment( + horizontalBias = positionInList.toFloat(), + verticalBias = 0f + ) ) ), scale = base.scale, @@ -44,9 +47,9 @@ class TargetUiState( ): MutableUiState = MutableUiState( uiContext = uiContext, - position = PositionAlignment( + positionAlignment = PositionAlignment( coroutineScope = uiContext.coroutineScope, - target = position, + target = positionAlignment, displacement = scrollX.mapState(uiContext.coroutineScope) { scrollX -> PositionAlignment.Value( outsideAlignment = OutsideAlignment( diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt index ca5299cb3..d2818a21f 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/SpotlightSliderRotation.kt @@ -35,21 +35,21 @@ class SpotlightSliderRotation( ) private val created: TargetUiState = TargetUiState( - position = PositionAlignment.Target(OutsideTop), + positionAlignment = PositionAlignment.Target(OutsideTop), scale = Scale.Target(0f), rotationY = RotationY.Target(0f), alpha = Alpha.Target(1f), ) private val standard: TargetUiState = TargetUiState( - position = PositionAlignment.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), scale = Scale.Target(1f), rotationY = RotationY.Target(0f), alpha = Alpha.Target(1f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionAlignment.Target(OutsideBottom), + positionAlignment = PositionAlignment.Target(OutsideBottom), scale = Scale.Target(0f), rotationY = RotationY.Target(0f), alpha = Alpha.Target(0f), diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt index 09a785aeb..e9d359530 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderrotation/TargetUiState.kt @@ -17,7 +17,7 @@ import kotlinx.coroutines.flow.StateFlow @MutableUiStateSpecs class TargetUiState( private val positionInList: Int = 0, - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val scale: Scale.Target, val rotationY: RotationY.Target, val alpha: Alpha.Target, @@ -30,8 +30,8 @@ class TargetUiState( positionInList: Int ) : this( positionInList = positionInList, - position = PositionAlignment.Target( - base.position.value.copy( + positionAlignment = PositionAlignment.Target( + base.positionAlignment.value.copy( outsideAlignment = BiasAlignment.OutsideAlignment( horizontalBias = positionInList.toFloat(), verticalBias = 0f @@ -54,9 +54,9 @@ class TargetUiState( ): MutableUiState { return MutableUiState( uiContext = uiContext, - position = PositionAlignment( + positionAlignment = PositionAlignment( coroutineScope = uiContext.coroutineScope, - target = position, + target = positionAlignment, displacement = scrollX.mapState(uiContext.coroutineScope) { PositionAlignment.Value( outsideAlignment = BiasAlignment.OutsideAlignment( diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt index faf64af3b..ab3722eae 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/SpotlightSliderScale.kt @@ -31,17 +31,17 @@ class SpotlightSliderScale( ) private val created: TargetUiState = TargetUiState( - position = PositionAlignment.Target(OutsideTop), + positionAlignment = PositionAlignment.Target(OutsideTop), scale = Scale.Target(0f), ) private val standard: TargetUiState = TargetUiState( - position = PositionAlignment.Target(InContainer), + positionAlignment = PositionAlignment.Target(InContainer), scale = Scale.Target(1f), ) private val destroyed: TargetUiState = TargetUiState( - position = PositionAlignment.Target(OutsideBottom), + positionAlignment = PositionAlignment.Target(OutsideBottom), scale = Scale.Target(0f), ) diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt index 35da4a6b6..fdcee33bc 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/sliderscale/TargetUiState.kt @@ -13,7 +13,7 @@ import kotlin.math.abs @MutableUiStateSpecs class TargetUiState( private val positionInList: Int = 0, - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val scale: Scale.Target, ) { /** @@ -24,8 +24,8 @@ class TargetUiState( positionInList: Int ) : this( positionInList = positionInList, - position = PositionAlignment.Target( - base.position.value.copy( + positionAlignment = PositionAlignment.Target( + base.positionAlignment.value.copy( outsideAlignment = BiasAlignment.OutsideAlignment( horizontalBias = positionInList.toFloat(), verticalBias = 0f @@ -45,9 +45,9 @@ class TargetUiState( scrollX: StateFlow ): MutableUiState = MutableUiState( uiContext = uiContext, - position = PositionAlignment( + positionAlignment = PositionAlignment( coroutineScope = uiContext.coroutineScope, - target = position, + target = positionAlignment, displacement = scrollX.mapState(uiContext.coroutineScope) { PositionAlignment.Value( outsideAlignment = BiasAlignment.OutsideAlignment( diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt index 01510b741..2e54d78e0 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt @@ -59,7 +59,7 @@ class MutableUiStateTest { testMutableUiState = remember { TestMutableUiState( uiContext = uiContext, - position = PositionAlignment( + positionAlignment = PositionAlignment( coroutineScope = coroutineScope, target = target, ) @@ -97,7 +97,7 @@ class MutableUiStateTest { // moving the child to the top-right corner + offset its size -> pushes it off screen testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( insideAlignment = BiasAlignment.InsideAlignment.TopEnd, offset = DpOffset(x = childSize, y = 0.dp) ) @@ -123,7 +123,7 @@ class MutableUiStateTest { // moving the child to the top-right corner + offset less than its size -> make it just visible testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( insideAlignment = BiasAlignment.InsideAlignment.TopEnd, offset = DpOffset(x = offset, y = 0.dp) ) @@ -152,7 +152,7 @@ class MutableUiStateTest { // moving the child with offset that equals parent's size -> pushes it off parent's bounds testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( offset = DpOffset(x = parentSize, y = 0.dp) ) ) @@ -181,7 +181,7 @@ class MutableUiStateTest { val offset = parentSize - 1.dp testMutableUiState.snapTo( target = TestTargetUiState( - position = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target( offset = DpOffset(x = offset, y = 0.dp) ) ) diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt index 9eb443923..5133000bb 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt @@ -13,13 +13,13 @@ import kotlinx.coroutines.launch class TestMutableUiState( uiContext: UiContext, - val position: PositionAlignment, + val positionAlignment: PositionAlignment, ) : BaseMutableUiState( uiContext = uiContext, - motionProperties = listOf(position), + motionProperties = listOf(positionAlignment), ) { override val combinedMotionPropertyModifier: Modifier = Modifier - .then(position.modifier) + .then(positionAlignment.modifier) override suspend fun animateTo( scope: CoroutineScope, @@ -28,8 +28,8 @@ class TestMutableUiState( ) { listOf( scope.async { - position.animateTo( - target.position.value, + positionAlignment.animateTo( + target.positionAlignment.value, spring(springSpec.dampingRatio, springSpec.stiffness), ) }, @@ -37,7 +37,7 @@ class TestMutableUiState( } override suspend fun snapTo(target: TestTargetUiState) { - position.snapTo(target.position.value) + positionAlignment.snapTo(target.positionAlignment.value) } override fun lerpTo( @@ -47,7 +47,7 @@ class TestMutableUiState( fraction: Float, ) { scope.launch { - position.lerpTo(start.position, end.position, fraction) + positionAlignment.lerpTo(start.positionAlignment, end.positionAlignment, fraction) } } } diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt index 4903e0942..d5b9ce9d5 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt @@ -2,4 +2,6 @@ package com.bumble.appyx.interactions.ui.state import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment -class TestTargetUiState(val position: PositionAlignment.Target) +class TestTargetUiState( + val positionAlignment: PositionAlignment.Target +) diff --git a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt index 0d8b8cda5..5f53ac11f 100644 --- a/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt +++ b/appyx-interactions/common/src/commonMain/kotlin/com/bumble/appyx/interactions/core/ui/property/impl/position/PositionOffset.kt @@ -2,7 +2,6 @@ package com.bumble.appyx.interactions.core.ui.property.impl.position import androidx.compose.animation.core.Animatable import androidx.compose.animation.core.AnimationVector2D -import androidx.compose.animation.core.AnimationVector4D import androidx.compose.animation.core.Easing import androidx.compose.animation.core.TwoWayConverter import androidx.compose.foundation.layout.offset diff --git a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt index f9362064b..dd61bf2ff 100644 --- a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt +++ b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt @@ -8,10 +8,10 @@ import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.math.clamp import com.bumble.appyx.interactions.core.ui.math.smoothstep import com.bumble.appyx.interactions.core.ui.property.impl.Alpha -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationX import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs import com.bumble.appyx.mapState import kotlinx.coroutines.flow.StateFlow @@ -20,7 +20,7 @@ import kotlinx.coroutines.flow.StateFlow class TargetUiState( val positionInList: Int = 0, val rotationX: RotationX.Target, - val position: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val scale: Scale.Target, val alpha: Alpha.Target, val zIndex: ZIndex.Target, @@ -31,7 +31,7 @@ class TargetUiState( ) : this( positionInList = positionInList, rotationX = base.rotationX, - position = base.position, + positionOffset = base.positionOffset, scale = base.scale, alpha = base.alpha, zIndex = base.zIndex, @@ -54,12 +54,12 @@ class TargetUiState( }, origin = TransformOrigin(0.075f, 0f), ), - position = PositionAlignment( + position = PositionOffset( coroutineScope = uiContext.coroutineScope, - target = position, + target = positionOffset, displacement = scrollX.mapState(uiContext.coroutineScope) { val factor = 0.075f + smoothstep(0f, 1f, it) - PositionAlignment.Value( + PositionOffset.Value( offset = DpOffset( x = (-0.125f * it * itemWidth.value).dp, y = (-factor * it * itemHeight.value / (1f - 0.1f * it)).dp, diff --git a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt index ce78e3e7f..113322892 100644 --- a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt +++ b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/WidgetsStack3D.kt @@ -1,17 +1,14 @@ package com.bumble.appyx.interactions.widgets.ui -import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpOffset -import androidx.compose.ui.unit.dp import com.bumble.appyx.components.spotlight.SpotlightModel -import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Alpha import com.bumble.appyx.interactions.core.ui.property.impl.GenericFloatProperty -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationX import com.bumble.appyx.interactions.core.ui.property.impl.Scale import com.bumble.appyx.interactions.core.ui.property.impl.ZIndex +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.mapState import com.bumble.appyx.transitionmodel.BaseVisualisation @@ -21,15 +18,6 @@ class WidgetsStack3D( ) : BaseVisualisation, MutableUiState, TargetUiState>( uiContext = uiContext, ) { - private var width: Dp = 0.dp - private var height: Dp = 0.dp - - override fun updateBounds(transitionBounds: TransitionBounds) { - super.updateBounds(transitionBounds) - width = transitionBounds.widthDp - height = transitionBounds.heightDp - } - private val scrollY = GenericFloatProperty(uiContext.coroutineScope, GenericFloatProperty.Target(0f)) @Suppress("MaxLineLength") @@ -59,14 +47,14 @@ class WidgetsStack3D( targetUiState.toMutableState( uiContext = uiContext, scrollX = scrollY.renderValueFlow.mapState(uiContext.coroutineScope) { it - targetUiState.positionInList }, - itemWidth = width, - itemHeight = height, + itemWidth = transitionBounds.widthDp, + itemHeight = transitionBounds.heightDp, ) private companion object { val default: TargetUiState = TargetUiState( rotationX = RotationX.Target(0f), - position = PositionAlignment.Target(DpOffset.Zero), + positionOffset = PositionOffset.Target(DpOffset.Zero), scale = Scale.Target(1f), alpha = Alpha.Target(1f), zIndex = ZIndex.Target(0f), diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt index ed37aabc2..ea2b6915a 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt @@ -162,8 +162,8 @@ fun Target( modifier = modifier .size(60.dp) .offset( - targetUiState.position.value.offset.x, - targetUiState.position.value.offset.y + targetUiState.positionAlignment.value.offset.x, + targetUiState.positionAlignment.value.offset.y ) .scale(targetUiState.scale.value) .rotate(targetUiState.rotationZ.value) diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt index 1b218c1cd..eb2846a21 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt @@ -63,21 +63,21 @@ class DragPredictionVisualisation( // Top-left corner, A private val uiStateA = TargetUiState( - position = PositionAlignment.Target(DpOffset(0.dp, 0.dp)), + positionAlignment = PositionAlignment.Target(DpOffset(0.dp, 0.dp)), scale = Scale.Target(1f), backgroundColor = BackgroundColor.Target(color_primary) ) // Top-right corner, B private val uiStateB = TargetUiState( - position = PositionAlignment.Target(DpOffset(180.dp, 30.dp)), + positionAlignment = PositionAlignment.Target(DpOffset(180.dp, 30.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), backgroundColor = BackgroundColor.Target(color_dark) ) // Bottom-right corner, C private val uiStateC = TargetUiState( - position = PositionAlignment.Target(DpOffset(180.dp, 180.dp)), + positionAlignment = PositionAlignment.Target(DpOffset(180.dp, 180.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), rotationZ = RotationZ.Target(90f), backgroundColor = BackgroundColor.Target(color_secondary) @@ -85,7 +85,7 @@ class DragPredictionVisualisation( // Bottom-left corner, D private val uiStateD = TargetUiState( - position = PositionAlignment.Target(DpOffset(30.dp, 180.dp)), + positionAlignment = PositionAlignment.Target(DpOffset(30.dp, 180.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_tertiary) @@ -103,8 +103,8 @@ class DragPredictionVisualisation( class Gestures( transitionBounds: TransitionBounds, ) : GestureFactory> { - private val maxX = uiStateB.position.value.offset.x - uiStateA.position.value.offset.x - private val maxY = uiStateD.position.value.offset.y - uiStateA.position.value.offset.y + private val maxX = uiStateB.positionAlignment.value.offset.x - uiStateA.positionAlignment.value.offset.x + private val maxY = uiStateD.positionAlignment.value.offset.y - uiStateA.positionAlignment.value.offset.y @Suppress("ComplexMethod") override fun createGesture( diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt index 01b6867e7..815722c56 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt @@ -10,7 +10,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val scale: Scale.Target, val rotationZ: RotationZ.Target = RotationZ.Target(0f), val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), diff --git a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt index 6f659963c..b68116eef 100644 --- a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt +++ b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt @@ -60,25 +60,25 @@ class IncompleteDragVisualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomEnd, bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomStart, bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt index 71e9b5d1d..53b50dfa7 100644 --- a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt @@ -9,7 +9,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val rotationZ: RotationZ.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt index e1831b997..ac111a47a 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt @@ -59,22 +59,22 @@ class Sample1Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt index 8805d25cd..d09a4432e 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt @@ -8,7 +8,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt index 66216dcf0..3801af528 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt @@ -60,25 +60,25 @@ class Sample2Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt index f44920f75..7a406bcc1 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt @@ -9,7 +9,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val rotationZ: RotationZ.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt index 8a17cc0ad..f8f3e856b 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt @@ -165,10 +165,10 @@ fun Target( modifier = with(boxScope) { modifier .size(60.dp) - .align(targetUiState.position.value.insideAlignment) + .align(targetUiState.positionAlignment.value.insideAlignment) .offset( - targetUiState.position.value.offset.x, - targetUiState.position.value.offset.y + targetUiState.positionAlignment.value.offset.x, + targetUiState.positionAlignment.value.offset.y ) .alpha(0.35f) .background( diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt index e8e10f287..1fc4d586c 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt @@ -59,22 +59,22 @@ class Sample3Visualisation( } private val topLeftCorner = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), backgroundColor = BackgroundColor.Target(color_primary) ) private val uiStateB = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), backgroundColor = BackgroundColor.Target(color_dark) ) private val uiStateC = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val uiStateD = TargetUiState( - position = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt index a8e2f174d..231dd3b95 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt @@ -8,7 +8,7 @@ import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val position: PositionAlignment.Target, + val positionAlignment: PositionAlignment.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, ) From 9bd07df916a06a4c867d3f9915cf2db01e5c3bd6 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 12:31:39 +0100 Subject: [PATCH 06/13] Account for all alignment params in base copy and scroll-based ui --- .../spotlight/ui/slider/TargetUiState.kt | 20 +++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt index 87b3ca653..dce849fb6 100644 --- a/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt +++ b/appyx-components/stable/spotlight/common/src/commonMain/kotlin/com/bumble/appyx/components/spotlight/ui/slider/TargetUiState.kt @@ -2,9 +2,10 @@ package com.bumble.appyx.components.spotlight.ui.slider import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.Alpha -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.Scale +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.OutsideAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs import com.bumble.appyx.mapState import kotlinx.coroutines.flow.StateFlow @@ -25,12 +26,15 @@ class TargetUiState( ) : this( positionInList = positionInList, positionAlignment = PositionAlignment.Target( - base.positionAlignment.value.copy( - outsideAlignment = OutsideAlignment( - horizontalBias = positionInList.toFloat(), - verticalBias = 0f + with(base.positionAlignment.value) { + copy( + outsideAlignment = OutsideAlignment( + horizontalBias = outsideAlignment.horizontalBias + positionInList.toFloat(), + verticalBias = outsideAlignment.verticalBias + ) ) - ) + } + ), scale = base.scale, alpha = base.alpha, @@ -52,6 +56,10 @@ class TargetUiState( target = positionAlignment, displacement = scrollX.mapState(uiContext.coroutineScope) { scrollX -> PositionAlignment.Value( + insideAlignment = InsideAlignment( + horizontalBias = 0f, + verticalBias = 0f, + ), outsideAlignment = OutsideAlignment( horizontalBias = scrollX, verticalBias = 0f From eb5f9ebd2bd6b168b1f481512cf2f41578b144e1 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 12:34:48 +0100 Subject: [PATCH 07/13] Fix long line --- .../node/spotlight/SpotlightObserveTransitionsExampleNode.kt | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt b/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt index aa1d97910..b2cc1ffe8 100644 --- a/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt +++ b/demos/appyx-navigation/common/src/commonMain/kotlin/com/bumble/appyx/navigation/node/spotlight/SpotlightObserveTransitionsExampleNode.kt @@ -87,8 +87,11 @@ class SpotlightObserveTransitionsExampleNode( val alignment = motionPropertyRenderValue() if (alignment != null) { + val offsetPercentage = + (alignment.outsideAlignment.horizontalBias * 100).toTwoPointPrecisionString() + Text( - text = "Offset: ${(alignment.outsideAlignment.horizontalBias * 100).toTwoPointPrecisionString()}%", + text = "Offset: $offsetPercentage%", fontSize = 20.sp, color = Color.Black, fontWeight = FontWeight.Bold From b49c0503ece8d92ab880674c2cc55cd154ffb802 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 13:32:46 +0100 Subject: [PATCH 08/13] Fix web samples --- .../demos/dragprediction/DragPrediction.kt | 4 +- .../DragPredictionVisualisation.kt | 39 +++++++------------ .../demos/dragprediction/TargetUiState.kt | 4 +- .../IncompleteDragVisualisation.kt | 18 ++++++--- .../demos/incompletedrag/TargetUiState.kt | 2 + .../demos/sample1/Sample1Visualisation.kt | 16 ++++++-- .../appyx/demos/sample1/TargetUiState.kt | 2 + .../demos/sample2/Sample2Visualisation.kt | 16 ++++++-- .../appyx/demos/sample2/TargetUiState.kt | 2 + .../com/bumble/appyx/demos/sample3/Sample3.kt | 6 +-- .../demos/sample3/Sample3Visualisation.kt | 30 ++++++++------ .../appyx/demos/sample3/TargetUiState.kt | 2 + 12 files changed, 86 insertions(+), 55 deletions(-) diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt index ea2b6915a..128e5d703 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPrediction.kt @@ -162,8 +162,8 @@ fun Target( modifier = modifier .size(60.dp) .offset( - targetUiState.positionAlignment.value.offset.x, - targetUiState.positionAlignment.value.offset.y + targetUiState.positionOffset.value.offset.x, + targetUiState.positionOffset.value.offset.y ) .scale(targetUiState.scale.value) .rotate(targetUiState.rotationZ.value) diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt index eb2846a21..6c7cf693b 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/DragPredictionVisualisation.kt @@ -25,9 +25,9 @@ import com.bumble.appyx.interactions.core.ui.gesture.GestureFactory import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.Scale +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -48,44 +48,35 @@ class DragPredictionVisualisation( ) companion object { - val offsetA = DpOffset(0.dp, 0.dp) - val offsetB = DpOffset(324.dp, 0.dp) - val offsetC = DpOffset(324.dp, 180.dp) - val offsetD = DpOffset(0.dp, 180.dp) - fun TestDriveModel.State.ElementState.toTargetUiState(): TargetUiState = when (this) { - A -> uiStateA - B -> uiStateB - C -> uiStateC - D -> uiStateD + A -> topLeftCorner + B -> topRightCorner + C -> BottomRightCorner + D -> bottomLeftCorner } - // Top-left corner, A - private val uiStateA = TargetUiState( - positionAlignment = PositionAlignment.Target(DpOffset(0.dp, 0.dp)), + private val topLeftCorner = TargetUiState( + positionOffset = PositionOffset.Target(DpOffset(0.dp, 0.dp)), scale = Scale.Target(1f), backgroundColor = BackgroundColor.Target(color_primary) ) - // Top-right corner, B - private val uiStateB = TargetUiState( - positionAlignment = PositionAlignment.Target(DpOffset(180.dp, 30.dp)), + private val topRightCorner = TargetUiState( + positionOffset = PositionOffset.Target(DpOffset(180.dp, 30.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), backgroundColor = BackgroundColor.Target(color_dark) ) - // Bottom-right corner, C - private val uiStateC = TargetUiState( - positionAlignment = PositionAlignment.Target(DpOffset(180.dp, 180.dp)), + private val BottomRightCorner = TargetUiState( + positionOffset = PositionOffset.Target(DpOffset(180.dp, 180.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), rotationZ = RotationZ.Target(90f), backgroundColor = BackgroundColor.Target(color_secondary) ) - // Bottom-left corner, D - private val uiStateD = TargetUiState( - positionAlignment = PositionAlignment.Target(DpOffset(30.dp, 180.dp)), + private val bottomLeftCorner = TargetUiState( + positionOffset = PositionOffset.Target(DpOffset(30.dp, 180.dp)), scale = Scale.Target(2f, TransformOrigin(0f, 0f)), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_tertiary) @@ -103,8 +94,8 @@ class DragPredictionVisualisation( class Gestures( transitionBounds: TransitionBounds, ) : GestureFactory> { - private val maxX = uiStateB.positionAlignment.value.offset.x - uiStateA.positionAlignment.value.offset.x - private val maxY = uiStateD.positionAlignment.value.offset.y - uiStateA.positionAlignment.value.offset.y + private val maxX = topRightCorner.positionOffset.value.offset.x - topLeftCorner.positionOffset.value.offset.x + private val maxY = bottomLeftCorner.positionOffset.value.offset.y - topLeftCorner.positionOffset.value.offset.y @Suppress("ComplexMethod") override fun createGesture( diff --git a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt index 815722c56..12857bff0 100644 --- a/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/gestures/dragprediction/web/src/jsMain/kotlin/com/bumble/appyx/demos/dragprediction/TargetUiState.kt @@ -1,16 +1,16 @@ package com.bumble.appyx.demos.dragprediction import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor -import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.Scale +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( - val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val scale: Scale.Target, val rotationZ: RotationZ.Target = RotationZ.Target(0f), val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), diff --git a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt index b68116eef..d2749c5a2 100644 --- a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt +++ b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/IncompleteDragVisualisation.kt @@ -27,8 +27,12 @@ import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ -import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.BottomEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.BottomStart +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -60,25 +64,29 @@ class IncompleteDragVisualisation( } private val topLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(TopStart), + positionOffset = PositionOffset.Target(DpOffset.Zero), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(TopEnd), + positionOffset = PositionOffset.Target(DpOffset.Zero), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(BottomEnd), + positionOffset = PositionOffset.Target(bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(BiasAlignment.InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(BottomStart), + positionOffset = PositionOffset.Target(bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt index 53b50dfa7..a921859e3 100644 --- a/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/gestures/incompletedrag/web/src/jsMain/kotlin/com/bumble/appyx/demos/incompletedrag/TargetUiState.kt @@ -4,12 +4,14 @@ import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val rotationZ: RotationZ.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt index ac111a47a..7dd0e02b8 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/Sample1Visualisation.kt @@ -27,7 +27,11 @@ import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.BottomEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -59,22 +63,26 @@ class Sample1Visualisation( } private val topLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(TopStart), + positionOffset = PositionOffset.Target(DpOffset.Zero), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(TopEnd), + positionOffset = PositionOffset.Target(DpOffset.Zero), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(BottomEnd), + positionOffset = PositionOffset.Target(bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(InsideAlignment.BottomStart), + positionOffset = PositionOffset.Target(bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt index d09a4432e..79c5a24ce 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample1/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample1/TargetUiState.kt @@ -3,12 +3,14 @@ package com.bumble.appyx.demos.sample1 import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt index 3801af528..dbff301f8 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/Sample2Visualisation.kt @@ -28,7 +28,11 @@ import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.BottomEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -60,25 +64,29 @@ class Sample2Visualisation( } private val topLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(TopStart), + positionOffset = PositionOffset.Target(DpOffset.Zero), rotationZ = RotationZ.Target(0f), backgroundColor = BackgroundColor.Target(color_primary) ) private val topRightCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), + positionAlignment = PositionAlignment.Target(TopEnd), + positionOffset = PositionOffset.Target(DpOffset.Zero), rotationZ = RotationZ.Target(180f), backgroundColor = BackgroundColor.Target(color_dark) ) private val bottomRightCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), + positionAlignment = PositionAlignment.Target(BottomEnd), + positionOffset = PositionOffset.Target(bottomOffset), rotationZ = RotationZ.Target(270f), backgroundColor = BackgroundColor.Target(color_secondary) ) private val bottomLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), + positionAlignment = PositionAlignment.Target(InsideAlignment.BottomStart), + positionOffset = PositionOffset.Target(bottomOffset), rotationZ = RotationZ.Target(540f), backgroundColor = BackgroundColor.Target(color_tertiary) ) diff --git a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt index 7a406bcc1..c72f6b037 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample2/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample2/TargetUiState.kt @@ -4,12 +4,14 @@ import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RotationZ import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val rotationZ: RotationZ.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt index f8f3e856b..a5c19ab59 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3.kt @@ -165,10 +165,10 @@ fun Target( modifier = with(boxScope) { modifier .size(60.dp) - .align(targetUiState.positionAlignment.value.insideAlignment) + .align(targetUiState.positionAlignment.value) .offset( - targetUiState.positionAlignment.value.offset.x, - targetUiState.positionAlignment.value.offset.y + x = targetUiState.positionOffset.value.offset.x, + y = targetUiState.positionOffset.value.offset.y ) .alpha(0.35f) .background( diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt index 1fc4d586c..e7f0895aa 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/Sample3Visualisation.kt @@ -26,8 +26,12 @@ import com.bumble.appyx.interactions.core.ui.gesture.GestureFactory import com.bumble.appyx.interactions.core.ui.gesture.dragDirection8 import com.bumble.appyx.interactions.core.ui.helper.DefaultAnimationSpec import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor -import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.BottomEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.BottomStart +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopEnd +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MatchedTargetUiState import com.bumble.appyx.transitionmodel.BaseVisualisation import com.bumble.appyx.utils.multiplatform.AppyxLogger @@ -53,28 +57,32 @@ class Sample3Visualisation( fun TestDriveModel.State.ElementState.toTargetUiState(): TargetUiState = when (this) { A -> topLeftCorner - B -> uiStateB - C -> uiStateC - D -> uiStateD + B -> topRightCorner + C -> bottomRightCorner + D -> bottomLeftCorner } private val topLeftCorner = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopStart), + positionAlignment = PositionAlignment.Target(TopStart), + positionOffset = PositionOffset.Target(DpOffset.Zero), backgroundColor = BackgroundColor.Target(color_primary) ) - private val uiStateB = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.TopEnd), + private val topRightCorner = TargetUiState( + positionAlignment = PositionAlignment.Target(TopEnd), + positionOffset = PositionOffset.Target(DpOffset.Zero), backgroundColor = BackgroundColor.Target(color_dark) ) - private val uiStateC = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomEnd, bottomOffset), + private val bottomRightCorner = TargetUiState( + positionAlignment = PositionAlignment.Target(BottomEnd), + positionOffset = PositionOffset.Target(bottomOffset), backgroundColor = BackgroundColor.Target(color_secondary) ) - private val uiStateD = TargetUiState( - positionAlignment = PositionAlignment.Target(insideAlignment = InsideAlignment.BottomStart, bottomOffset), + private val bottomLeftCorner = TargetUiState( + positionAlignment = PositionAlignment.Target(BottomStart), + positionOffset = PositionOffset.Target(bottomOffset), backgroundColor = BackgroundColor.Target(color_tertiary) ) } diff --git a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt index 231dd3b95..36df79cd4 100644 --- a/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt +++ b/demos/mkdocs/appyx-interactions/interactions/sample3/web/src/jsMain/kotlin/com/bumble/appyx/demos/sample3/TargetUiState.kt @@ -3,12 +3,14 @@ package com.bumble.appyx.demos.sample3 import com.bumble.appyx.interactions.core.ui.property.impl.BackgroundColor import com.bumble.appyx.interactions.core.ui.property.impl.RoundedCorners import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.MutableUiStateSpecs @Suppress("unused") @MutableUiStateSpecs class TargetUiState( val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target, val roundedCorners: RoundedCorners.Target = RoundedCorners.Target(10), val backgroundColor: BackgroundColor.Target, ) From 17828293c2ec7f50bea93aadf0c367815be6c92a Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 13:50:01 +0100 Subject: [PATCH 09/13] Fix tests --- .../appyx/interactions/ui/state/MutableUiStateTest.kt | 11 +++++++++-- .../appyx/interactions/ui/state/TestTargetUiState.kt | 4 +++- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt index 2e54d78e0..2983758e3 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt @@ -20,6 +20,7 @@ import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import junit.framework.TestCase.assertFalse import junit.framework.TestCase.assertTrue import kotlinx.coroutines.CoroutineScope @@ -99,6 +100,8 @@ class MutableUiStateTest { target = TestTargetUiState( positionAlignment = PositionAlignment.Target( insideAlignment = BiasAlignment.InsideAlignment.TopEnd, + ), + positionOffset = PositionOffset.Target( offset = DpOffset(x = childSize, y = 0.dp) ) ) @@ -125,6 +128,8 @@ class MutableUiStateTest { target = TestTargetUiState( positionAlignment = PositionAlignment.Target( insideAlignment = BiasAlignment.InsideAlignment.TopEnd, + ), + positionOffset = PositionOffset.Target( offset = DpOffset(x = offset, y = 0.dp) ) ) @@ -152,7 +157,8 @@ class MutableUiStateTest { // moving the child with offset that equals parent's size -> pushes it off parent's bounds testMutableUiState.snapTo( target = TestTargetUiState( - positionAlignment = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target(), + positionOffset = PositionOffset.Target( offset = DpOffset(x = parentSize, y = 0.dp) ) ) @@ -181,7 +187,8 @@ class MutableUiStateTest { val offset = parentSize - 1.dp testMutableUiState.snapTo( target = TestTargetUiState( - positionAlignment = PositionAlignment.Target( + positionAlignment = PositionAlignment.Target(), + positionOffset = PositionOffset.Target( offset = DpOffset(x = offset, y = 0.dp) ) ) diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt index d5b9ce9d5..0898ac778 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestTargetUiState.kt @@ -1,7 +1,9 @@ package com.bumble.appyx.interactions.ui.state import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset class TestTargetUiState( - val positionAlignment: PositionAlignment.Target + val positionAlignment: PositionAlignment.Target, + val positionOffset: PositionOffset.Target ) From b8fb659332a3dc10e3c7c9d06b39f918a9c9a86a Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 14:01:54 +0100 Subject: [PATCH 10/13] Update CHANGELOG.md --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index c0872b80c..b72dd3d12 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,7 @@ ### API breaking changes - [#612](https://github.com/bumble-tech/appyx/pull/612) – Rename MotionController to Visualisation +- [#617](https://github.com/bumble-tech/appyx/pull/617) – Unify inside & outside position alignment ### Changed From d617c254efbb09a1f5ddb5811ed882267851624f Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 15:06:19 +0100 Subject: [PATCH 11/13] Fix desktop sample --- .../com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt index dd61bf2ff..17ee04a99 100644 --- a/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt +++ b/demos/appyx-interactions/desktop/src/desktopMain/kotlin/com/bumble/appyx/interactions/widgets/ui/TargetUiState.kt @@ -54,7 +54,7 @@ class TargetUiState( }, origin = TransformOrigin(0.075f, 0f), ), - position = PositionOffset( + positionOffset = PositionOffset( coroutineScope = uiContext.coroutineScope, target = positionOffset, displacement = scrollX.mapState(uiContext.coroutineScope) { From 00e138bb6e7bdc4ac104d6c590d653682c148768 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 15:11:06 +0100 Subject: [PATCH 12/13] Fix web sample --- .../observemp/ObserveMotionPropertiesSample.kt | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt b/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt index cc526878c..b196c3388 100644 --- a/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt +++ b/demos/mkdocs/appyx-interactions/interactions/observemp/web/src/jsMain/kotlin/com/bumble/appyx/demos/observemp/ObserveMotionPropertiesSample.kt @@ -13,6 +13,8 @@ import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.text.style.TextAlign.Companion import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.bumble.appyx.components.spotlight.Spotlight @@ -106,19 +108,25 @@ fun ModalUi( color = Color.White ) val alignment = - motionPropertyRenderValue()?.alignment + motionPropertyRenderValue() if (alignment != null) { + val offsetPercentage = roundFloatToTwoDecimals( + alignment.outsideAlignment.horizontalBias * 100 + ) + Text( - text = "Offset: ${roundFloatToTwoDecimals(alignment.horizontalBias * 100)}%", + text = "Offset:\n$offsetPercentage%", fontSize = 12.sp, + textAlign = TextAlign.Center, color = Color.White ) } val rotationY = motionPropertyRenderValue() if (rotationY != null) { Text( - text = "${roundFloatToTwoDecimals(rotationY)}°", + text = "Rotation:\n${roundFloatToTwoDecimals(rotationY)}°", fontSize = 12.sp, + textAlign = TextAlign.Center, color = Color.White ) } From cd8ab50bf1f871d01b176710f12c10790f09c5c6 Mon Sep 17 00:00:00 2001 From: Zsolt Kocsi Date: Sun, 8 Oct 2023 15:26:14 +0100 Subject: [PATCH 13/13] Fix tests --- .../interactions/ui/state/MutableUiStateTest.kt | 15 +++++++++------ .../interactions/ui/state/TestMutableUiState.kt | 11 +++++++++++ 2 files changed, 20 insertions(+), 6 deletions(-) diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt index 2983758e3..4f76c51bf 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/MutableUiStateTest.kt @@ -19,6 +19,7 @@ import com.bumble.appyx.interactions.core.ui.LocalBoxScope import com.bumble.appyx.interactions.core.ui.context.TransitionBounds import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.BiasAlignment.InsideAlignment.Companion.TopStart import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import junit.framework.TestCase.assertFalse @@ -40,12 +41,10 @@ class MutableUiStateTest { private lateinit var coroutineScope: CoroutineScope private fun setupTestMutableUiState( - target: PositionAlignment.Target = PositionAlignment.Target( - insideAlignment = BiasAlignment.InsideAlignment.TopStart - ), + targetAlignment: PositionAlignment.Target = PositionAlignment.Target(TopStart), + targetOffset: PositionOffset.Target = PositionOffset.Target(DpOffset.Zero), clipToBounds: Boolean = false, - containerModifier: Modifier = Modifier - .fillMaxSize(), + containerModifier: Modifier = Modifier.fillMaxSize(), childModifier: Modifier = Modifier, ) { composeTestRule.setContent { @@ -62,7 +61,11 @@ class MutableUiStateTest { uiContext = uiContext, positionAlignment = PositionAlignment( coroutineScope = coroutineScope, - target = target, + target = targetAlignment, + ), + positionOffset = PositionOffset( + coroutineScope = coroutineScope, + target = targetOffset, ) ).apply { updateBounds( diff --git a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt index 5133000bb..2514e29d8 100644 --- a/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt +++ b/appyx-interactions/android/src/androidTest/kotlin/com/bumble/appyx/interactions/ui/state/TestMutableUiState.kt @@ -5,6 +5,7 @@ import androidx.compose.animation.core.spring import androidx.compose.ui.Modifier import com.bumble.appyx.interactions.core.ui.context.UiContext import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionAlignment +import com.bumble.appyx.interactions.core.ui.property.impl.position.PositionOffset import com.bumble.appyx.interactions.core.ui.state.BaseMutableUiState import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.async @@ -14,12 +15,14 @@ import kotlinx.coroutines.launch class TestMutableUiState( uiContext: UiContext, val positionAlignment: PositionAlignment, + val positionOffset: PositionOffset, ) : BaseMutableUiState( uiContext = uiContext, motionProperties = listOf(positionAlignment), ) { override val combinedMotionPropertyModifier: Modifier = Modifier .then(positionAlignment.modifier) + .then(positionOffset.modifier) override suspend fun animateTo( scope: CoroutineScope, @@ -33,11 +36,18 @@ class TestMutableUiState( spring(springSpec.dampingRatio, springSpec.stiffness), ) }, + scope.async { + positionOffset.animateTo( + target.positionOffset.value, + spring(springSpec.dampingRatio, springSpec.stiffness), + ) + }, ).awaitAll() } override suspend fun snapTo(target: TestTargetUiState) { positionAlignment.snapTo(target.positionAlignment.value) + positionOffset.snapTo(target.positionOffset.value) } override fun lerpTo( @@ -48,6 +58,7 @@ class TestMutableUiState( ) { scope.launch { positionAlignment.lerpTo(start.positionAlignment, end.positionAlignment, fraction) + positionOffset.lerpTo(start.positionOffset, end.positionOffset, fraction) } } }