Search code examples
androidandroid-motionlayout

Is there a way to have multiple independent transitions in motion layout?


Let me explain the problem with an example. I wish to animate two (or more) "cubes" in motion layout.

Cube:

<View
    android:id="@+id/cube"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:background="#SOMECOLOR"
    ...
    />

I have two transitions on my scene. One transition moves the first cube, and the second transition moves the second cube.

When I programmatically start the first animation:

val motionLayout = findViewById<MotionLayout>(...)
motionLayout.setTransition(R.id.first_transition)
motionLayout.transitionToEnd()

the second cube "jumps" to its original position.

I would like MotionLayout to remember the state of the second animation. Is it possible?

I will provide any information to help you inderstand my problem. Thanks in advance.


Solution

  • MotionLayout moves the layout between ConstraintSets (states). ConstraintSet contains the state of all child Views.

    So MotionLayout is not designed around Moving individual Views, but there are solutions. If the number of actual states you want to support is small so 2 views with 2 states = 4 total states. You can define all 4 say a,b,c,d. If doing this look into ConstraintOverride it will reduce the amount of XML you will need to write. If you are not using onswipe, can then define 4 Transition to the end states (just do not define the start state)

    Another options to consider is using ViewTransition which is complex but can update the state of all the ConstraintSets in the MotionScene.