| /* |
| * Copyright (C) 2022 The Android Open Source Project |
| * |
| * Licensed under the Apache License, Version 2.0 (the "License"); |
| * you may not use this file except in compliance with the License. |
| * You may obtain a copy of the License at |
| * |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| * |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| */ |
| |
| package androidx.constraintlayout.compose |
| |
| import androidx.annotation.IntRange |
| import androidx.compose.ui.unit.Dp |
| import androidx.compose.ui.unit.dp |
| import androidx.constraintlayout.core.parser.CLArray |
| import androidx.constraintlayout.core.parser.CLContainer |
| import androidx.constraintlayout.core.parser.CLNumber |
| import androidx.constraintlayout.core.parser.CLObject |
| import androidx.constraintlayout.core.parser.CLString |
| import kotlin.properties.ObservableProperty |
| import kotlin.reflect.KProperty |
| |
| @ExperimentalMotionApi |
| fun Transition( |
| from: String = "start", |
| to: String = "end", |
| transitionContent: TransitionScope.() -> Unit |
| ): Transition { |
| val transitionScope = TransitionScope(from, to) |
| transitionScope.transitionContent() |
| return TransitionImpl(transitionScope.getObject()) |
| } |
| |
| @ExperimentalMotionApi |
| class TransitionScope internal constructor( |
| private val from: String, |
| private val to: String |
| ) { |
| private val containerObject = CLObject(charArrayOf()) |
| |
| private val keyFramesObject = CLObject(charArrayOf()) |
| private val keyAttributesArray = CLArray(charArrayOf()) |
| private val keyPositionsArray = CLArray(charArrayOf()) |
| private val keyCyclesArray = CLArray(charArrayOf()) |
| |
| private val onSwipeObject = CLObject(charArrayOf()) |
| |
| internal fun reset() { |
| containerObject.clear() |
| keyFramesObject.clear() |
| keyAttributesArray.clear() |
| onSwipeObject.clear() |
| } |
| |
| private fun addKeyAttributesIfMissing() { |
| containerObject.put("KeyFrames", keyFramesObject) |
| keyFramesObject.put("KeyAttributes", keyAttributesArray) |
| } |
| |
| private fun addKeyPositionsIfMissing() { |
| containerObject.put("KeyFrames", keyFramesObject) |
| keyFramesObject.put("KeyPositions", keyPositionsArray) |
| } |
| |
| private fun addKeyCyclesIfMissing() { |
| containerObject.put("KeyFrames", keyFramesObject) |
| keyFramesObject.put("KeyCycles", keyCyclesArray) |
| } |
| |
| var motionArc: Arc = Arc.None |
| |
| var onSwipe: OnSwipe? = null |
| |
| fun keyAttributes( |
| vararg targets: ConstrainedLayoutReference, |
| keyAttributesContent: KeyAttributesScope.() -> Unit |
| ) { |
| val scope = KeyAttributesScope(*targets) |
| keyAttributesContent(scope) |
| addKeyAttributesIfMissing() |
| keyAttributesArray.add(scope.keyFramePropsObject) |
| } |
| |
| fun keyPositions( |
| vararg targets: ConstrainedLayoutReference, |
| keyPositionsContent: KeyPositionsScope.() -> Unit |
| ) { |
| val scope = KeyPositionsScope(*targets) |
| keyPositionsContent(scope) |
| addKeyPositionsIfMissing() |
| keyPositionsArray.add(scope.keyFramePropsObject) |
| } |
| |
| fun keyCycles( |
| vararg targets: ConstrainedLayoutReference, |
| keyCyclesContent: KeyCyclesScope.() -> Unit |
| ) { |
| val scope = KeyCyclesScope(*targets) |
| keyCyclesContent(scope) |
| addKeyCyclesIfMissing() |
| keyCyclesArray.add(scope.keyFramePropsObject) |
| } |
| |
| /** |
| * Creates one [ConstrainedLayoutReference] corresponding to the [ConstraintLayout] element |
| * with [id]. |
| */ |
| fun createRefFor(id: Any): ConstrainedLayoutReference = ConstrainedLayoutReference(id) |
| |
| internal fun getObject(): CLObject { |
| containerObject.putString("pathMotionArc", motionArc.name) |
| containerObject.putString("from", from) |
| containerObject.putString("to", to) |
| // TODO: Uncomment once we decide how to deal with Easing discrepancy from user driven |
| // `progress` value. Eg: `animateFloat(tween(duration, LinearEasing))` |
| // containerObject.putString("interpolator", easing.name) |
| // containerObject.putNumber("duration", durationMs.toFloat()) |
| onSwipe?.let { |
| containerObject.put("onSwipe", onSwipeObject) |
| onSwipeObject.putString("direction", it.direction.name) |
| onSwipeObject.putNumber("dragScale", it.dragScale) |
| it.dragAround?.id?.let { id -> |
| onSwipeObject.putString("around", id.toString()) |
| } |
| onSwipeObject.putNumber("threshold", it.dragThreshold) |
| onSwipeObject.putString("anchor", it.anchor.id.toString()) |
| onSwipeObject.putString("side", it.side.name) |
| onSwipeObject.putString("touchUp", it.onTouchUp.name) |
| onSwipeObject.putString("mode", it.mode.name) |
| onSwipeObject.putNumber("maxVelocity", it.mode.maxVelocity) |
| onSwipeObject.putNumber("maxAccel", it.mode.maxAcceleration) |
| onSwipeObject.putNumber("springMass", it.mode.springMass) |
| onSwipeObject.putNumber("springStiffness", it.mode.springStiffness) |
| onSwipeObject.putNumber("springDamping", it.mode.springDamping) |
| onSwipeObject.putNumber("stopThreshold", it.mode.springThreshold) |
| onSwipeObject.putString("springBoundary", it.mode.springBoundary.name) |
| } |
| return containerObject |
| } |
| } |
| |
| @ExperimentalMotionApi |
| open class BaseKeyFramesScope internal constructor(vararg targets: ConstrainedLayoutReference) { |
| internal val keyFramePropsObject = CLObject(charArrayOf()).apply { |
| clear() |
| } |
| |
| private val targetsContainer = CLArray(charArrayOf()) |
| protected val framesContainer = CLArray(charArrayOf()) |
| |
| var easing: Easing by addNameOnPropertyChange(Easing.Standard, "transitionEasing") |
| |
| init { |
| keyFramePropsObject.put("target", targetsContainer) |
| keyFramePropsObject.put("frames", framesContainer) |
| targets.forEach { |
| val targetChars = it.id.toString().toCharArray() |
| targetsContainer.add(CLString(targetChars).apply { |
| start = 0 |
| end = targetChars.size.toLong() - 1 |
| }) |
| } |
| } |
| |
| protected fun <E : NamedPropertyOrValue?> addNameOnPropertyChange( |
| initialValue: E, |
| nameOverride: String? = null |
| ) = |
| object : ObservableProperty<E>(initialValue) { |
| override fun afterChange(property: KProperty<*>, oldValue: E, newValue: E) { |
| val name = nameOverride ?: property.name |
| if (newValue != null) { |
| keyFramePropsObject.putString(name, newValue.name) |
| } |
| } |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class KeyAttributesScope internal constructor(vararg targets: ConstrainedLayoutReference) : |
| BaseKeyFramesScope(*targets) { |
| fun frame(@IntRange(0, 100) frame: Int, keyFrameContent: KeyAttributeScope.() -> Unit) { |
| val scope = KeyAttributeScope() |
| keyFrameContent(scope) |
| framesContainer.add(CLNumber(frame.toFloat())) |
| scope.addToContainer(keyFramePropsObject) |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class KeyPositionsScope internal constructor(vararg targets: ConstrainedLayoutReference) : |
| BaseKeyFramesScope(*targets) { |
| var type by addNameOnPropertyChange(RelativePosition.Parent) |
| |
| fun frame(@IntRange(0, 100) frame: Int, keyFrameContent: KeyPositionScope.() -> Unit) { |
| val scope = KeyPositionScope() |
| keyFrameContent(scope) |
| framesContainer.add(CLNumber(frame.toFloat())) |
| scope.addToContainer(keyFramePropsObject) |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class KeyCyclesScope internal constructor(vararg targets: ConstrainedLayoutReference) : |
| BaseKeyFramesScope(*targets) { |
| fun frame(@IntRange(0, 100) frame: Int, keyFrameContent: KeyCycleScope.() -> Unit) { |
| val scope = KeyCycleScope() |
| keyFrameContent(scope) |
| framesContainer.add(CLNumber(frame.toFloat())) |
| scope.addToContainer(keyFramePropsObject) |
| } |
| } |
| |
| @ExperimentalMotionApi |
| abstract class BaseKeyFrameScope internal constructor() { |
| /** |
| * PropertyName-Value map for the properties of each type of key frame. |
| * |
| * The values are for a singular unspecified frame. |
| */ |
| private val keyFramePropertiesValue = mutableMapOf<String, Any>() |
| |
| /** |
| * PropertyName-Value map for user-defined values. |
| * |
| * Typically used on KeyAttributes only. |
| */ |
| internal val customPropertiesValue = mutableMapOf<String, Any>() |
| |
| /** |
| * When changed, updates the value of type [T] on the [keyFramePropertiesValue] map. |
| * |
| * Where the Key is the property's name unless [nameOverride] is not null. |
| */ |
| protected fun <T> addOnPropertyChange(initialValue: T, nameOverride: String? = null) = |
| object : ObservableProperty<T>(initialValue) { |
| override fun afterChange(property: KProperty<*>, oldValue: T, newValue: T) { |
| if (newValue != null) { |
| keyFramePropertiesValue[nameOverride ?: property.name] = newValue |
| } else { |
| keyFramePropertiesValue.remove(nameOverride ?: property.name) |
| } |
| } |
| } |
| |
| /** |
| * Property delegate that updates the [keyFramePropertiesValue] map on value changes. |
| * |
| * Where the Key is the property's name unless [nameOverride] is not null. |
| * |
| * The value is the String given by [NamedPropertyOrValue.name]. |
| * |
| * |
| * |
| * Use when declaring properties that have a named value. |
| * |
| * E.g.: `var curveFit: CurveFit? by addNameOnPropertyChange(null)` |
| */ |
| protected fun <E : NamedPropertyOrValue?> addNameOnPropertyChange( |
| initialValue: E, |
| nameOverride: String? = null |
| ) = |
| object : ObservableProperty<E>(initialValue) { |
| override fun afterChange(property: KProperty<*>, oldValue: E, newValue: E) { |
| val name = nameOverride ?: property.name |
| if (newValue != null) { |
| keyFramePropertiesValue[name] = newValue.name |
| } |
| } |
| } |
| |
| /** |
| * Adds the property maps to the given container. |
| * |
| * Where every value is treated as part of array. |
| */ |
| internal fun addToContainer(container: CLContainer) { |
| container.putValuesAsArrayElements(keyFramePropertiesValue) |
| val customPropsObject = container.getObjectOrNull("custom") ?: run { |
| val custom = CLObject(charArrayOf()) |
| container.put("custom", custom) |
| custom |
| } |
| customPropsObject.putValuesAsArrayElements(customPropertiesValue) |
| } |
| |
| /** |
| * Adds the values from [propertiesSource] to the [CLContainer]. |
| * |
| * Each value will be added as a new element of their corresponding array (given by the Key, |
| * which is the name of the affected property). |
| */ |
| private fun CLContainer.putValuesAsArrayElements(propertiesSource: Map<String, Any>) { |
| propertiesSource.forEach { (name, value) -> |
| val array = this.getArrayOrCreate(name) |
| when (value) { |
| is String -> { |
| val stringChars = value.toCharArray() |
| array.add(CLString(stringChars).apply { |
| start = 0 |
| end = stringChars.size.toLong() - 1 |
| }) |
| } |
| is Dp -> { |
| array.add(CLNumber(value.value)) |
| } |
| is Number -> { |
| array.add(CLNumber(value.toFloat())) |
| } |
| } |
| } |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class KeyAttributeScope internal constructor() : BaseKeyFrameScope() { |
| var alpha by addOnPropertyChange(1f, "alpha") |
| var scaleX by addOnPropertyChange(1f, "scaleX") |
| var scaleY by addOnPropertyChange(1f, "scaleY") |
| var rotationX by addOnPropertyChange(0f, "rotationX") |
| var rotationY by addOnPropertyChange(0f, "rotationY") |
| var rotationZ by addOnPropertyChange(0f, "rotationZ") |
| var translationX: Dp by addOnPropertyChange(0.dp, "translationX") |
| var translationY: Dp by addOnPropertyChange(0.dp, "translationY") |
| var translationZ: Dp by addOnPropertyChange(0.dp, "translationZ") |
| } |
| |
| @ExperimentalMotionApi |
| class KeyPositionScope internal constructor() : BaseKeyFrameScope() { |
| var percentX by addOnPropertyChange(1f) |
| var percentY by addOnPropertyChange(1f) |
| var percentWidth by addOnPropertyChange(1f) |
| var percentHeight by addOnPropertyChange(0f) |
| var curveFit: CurveFit? by addNameOnPropertyChange(null) |
| } |
| |
| @ExperimentalMotionApi |
| class KeyCycleScope internal constructor() : BaseKeyFrameScope() { |
| var alpha by addOnPropertyChange(1f) |
| var scaleX by addOnPropertyChange(1f) |
| var scaleY by addOnPropertyChange(1f) |
| var rotationX by addOnPropertyChange(0f) |
| var rotationY by addOnPropertyChange(0f) |
| var rotationZ by addOnPropertyChange(0f) |
| var translationX: Dp by addOnPropertyChange(0.dp) |
| var translationY: Dp by addOnPropertyChange(0.dp) |
| var translationZ: Dp by addOnPropertyChange(0.dp) |
| var period by addOnPropertyChange(0f) |
| var offset by addOnPropertyChange(0f) |
| var phase by addOnPropertyChange(0f) |
| |
| // TODO: Add Wave Shape & Custom Wave |
| } |
| |
| internal interface NamedPropertyOrValue { |
| val name: String |
| } |
| |
| @ExperimentalMotionApi |
| data class OnSwipe( |
| val anchor: ConstrainedLayoutReference, |
| val side: SwipeSide, |
| val direction: SwipeDirection, |
| val dragScale: Float = 1f, |
| val dragThreshold: Float = 10f, |
| val dragAround: ConstrainedLayoutReference? = null, |
| val limitBoundsTo: ConstrainedLayoutReference? = null, |
| val onTouchUp: SwipeTouchUp = SwipeTouchUp.AutoComplete, |
| val mode: SwipeMode = SwipeMode.Velocity(), |
| ) |
| |
| @ExperimentalMotionApi |
| class Easing internal constructor(override val name: String) : NamedPropertyOrValue { |
| companion object { |
| val Standard = Easing("standard") |
| val Accelerate = Easing("accelerate") |
| val Decelerate = Easing("decelerate") |
| val Linear = Easing("linear") |
| val Anticipate = Easing("anticipate") |
| val Overshoot = Easing("overshoot") |
| |
| /** |
| * Defines a Cubic-Bezier curve where the points P1 and P2 are at the given coordinate |
| * ratios. |
| * |
| * P1 and P2 are typically defined within (0f, 0f) and (1f, 1f), but may be assigned beyond |
| * these values for overshoot curves. |
| * |
| * @param x1 X-axis value for P1. Value is typically defined within 0f-1f. |
| * @param y1 Y-axis value for P1. Value is typically defined within 0f-1f. |
| * @param x2 X-axis value for P2. Value is typically defined within 0f-1f. |
| * @param y2 Y-axis value for P2. Value is typically defined within 0f-1f. |
| */ |
| fun Cubic(x1: Float, y1: Float, x2: Float, y2: Float) = Easing("cubic($x1, $y1, $x2, $y2)") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class Arc internal constructor(val name: String) { |
| companion object { |
| val None = Arc("none") |
| val StartVertical = Arc("startVertical") |
| val StartHorizontal = Arc("startHorizontal") |
| val Flip = Arc("flip") |
| val Below = Arc("below") |
| val Above = Arc("above") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class SwipeMode internal constructor( |
| val name: String, |
| internal val springMass: Float = 1f, |
| internal val springStiffness: Float = 400f, |
| internal val springDamping: Float = 10f, |
| internal val springThreshold: Float = 0.01f, |
| internal val springBoundary: SpringBoundary = SpringBoundary.Overshoot, |
| internal val maxVelocity: Float = 4f, |
| internal val maxAcceleration: Float = 1.2f |
| ) { |
| companion object { |
| val Velocity = Velocity() |
| |
| val Spring = Spring() |
| |
| fun Velocity(maxVelocity: Float = 4f, maxAcceleration: Float = 1.2f): SwipeMode = |
| SwipeMode( |
| name = "velocity", |
| maxVelocity = maxVelocity, |
| maxAcceleration = maxAcceleration |
| ) |
| |
| fun Spring( |
| mass: Float = 1f, |
| stiffness: Float = 400f, |
| damping: Float = 10f, |
| threshold: Float = 0.01f, |
| boundary: SpringBoundary = SpringBoundary.Overshoot |
| ): SwipeMode = |
| SwipeMode( |
| name = "spring", |
| springMass = mass, |
| springStiffness = stiffness, |
| springDamping = damping, |
| springThreshold = threshold, |
| springBoundary = boundary |
| ) |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class SwipeTouchUp internal constructor(val name: String) { |
| companion object { |
| val AutoComplete: SwipeTouchUp = SwipeTouchUp("autocomplete") |
| val ToStart: SwipeTouchUp = SwipeTouchUp("toStart") |
| val ToEnd: SwipeTouchUp = SwipeTouchUp("toEnd") |
| val Stop: SwipeTouchUp = SwipeTouchUp("stop") |
| val Decelerate: SwipeTouchUp = SwipeTouchUp("decelerate") |
| val NeverCompleteStart: SwipeTouchUp = SwipeTouchUp("neverCompleteStart") |
| val NeverCompleteEnd: SwipeTouchUp = SwipeTouchUp("neverCompleteEnd") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class SwipeDirection internal constructor(val name: String) { |
| companion object { |
| val Up: SwipeDirection = SwipeDirection("up") |
| val Down: SwipeDirection = SwipeDirection("down") |
| val Left: SwipeDirection = SwipeDirection("left") |
| val Right: SwipeDirection = SwipeDirection("right") |
| val Start: SwipeDirection = SwipeDirection("start") |
| val End: SwipeDirection = SwipeDirection("end") |
| val ClockWise: SwipeDirection = SwipeDirection("clockwise") |
| val AntiClockWise: SwipeDirection = SwipeDirection("anticlockwise") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class SwipeSide internal constructor(val name: String) { |
| companion object { |
| val Top: SwipeSide = SwipeSide("top") |
| val Left: SwipeSide = SwipeSide("left") |
| val Right: SwipeSide = SwipeSide("right") |
| val Bottom: SwipeSide = SwipeSide("bottom") |
| val Middle: SwipeSide = SwipeSide("middle") |
| val Start: SwipeSide = SwipeSide("start") |
| val End: SwipeSide = SwipeSide("end") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class SpringBoundary internal constructor(val name: String) { |
| companion object { |
| val Overshoot = SpringBoundary("overshoot") |
| val BounceStart = SpringBoundary("bounceStart") |
| val BounceEnd = SpringBoundary("bounceEnd") |
| val BounceBoth = SpringBoundary("bounceBoth") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class CurveFit internal constructor(override val name: String) : NamedPropertyOrValue { |
| companion object { |
| val Spline: CurveFit = CurveFit("spline") |
| val Linear: CurveFit = CurveFit("linear") |
| } |
| } |
| |
| @ExperimentalMotionApi |
| class RelativePosition internal constructor(override val name: String) : NamedPropertyOrValue { |
| companion object { |
| val Delta: RelativePosition = RelativePosition("deltaRelative") |
| val Path: RelativePosition = RelativePosition("pathRelative") |
| val Parent: RelativePosition = RelativePosition("parentRelative") |
| } |
| } |