How to run multiple MaterialContainerTransform transitions simultaneously?

user_9323550 0
Viewed 401

I'm trying to animate two sets of views simultaneously using the MaterialContainerTransform transition. However, with the code below, only the first transition runs correctly, while the second jumps from the start to the end state unanimated. When tested separately, both run as they should. After searching the internet for many hours, I have so far been unable to find any solution to this. Any help would be appreciated!

val transform = TransitionSet().apply {
    ordering = TransitionSet.ORDERING_TOGETHER

    addTransition(MaterialContainerTransform().apply {
        startView = startViewA
        endView = endViewA

        addTarget(endViewA)

        pathMotion = MaterialArcMotion()
        scrimColor = Color.TRANSPARENT
    })

    addTransition(MaterialContainerTransform().apply {
        startView = startViewB
        endView = endViewB

        addTarget(endViewB)

        pathMotion = MaterialArcMotion()
        scrimColor = Color.TRANSPARENT
    })
}

TransitionManager.beginDelayedTransition(viewContainer, transform)

startViewA?.visibility = View.GONE
endViewA?.visibility = View.VISIBLE
endViewB?.visibility = View.INVISIBLE
startViewB?.visibility = View.VISIBLE
android-transitions material-components-android android
1 Answers

MaterialContainerTransform transition, under the hood, uses a drawable to animate between two states. The drawable is added as an overlay to android.R.id.content by default ( root view ).

My guess is, as both drawables are added as an overlay to same view, one is completely overriden. I would need to take a look at view overlay system to make sure.

BUT there is a method in MaterialContainerTransform that lets you set which view is going to use the drawable as an overlay.

  /**
   * Set the id of the View whose overlay this transition will be added to.
   *
   * <p>This can be used to limit the bounds of the animation (including the background scrim) to
   * the bounds of the provided drawing view, and also have the animation drawn at the relative
   * z-order of the drawing view.
   *
   * <p>By default, the {@code drawingViewId} will be {@code android.R.id.content}. Additionally, if
   * {@code drawingViewId} is the same as the end View's id, {@code MaterialContainerTransform} will
   * add the transition's drawable to the {@code drawingViewId}'s parent instead.
   *
   * <p>If the drawing view cannot be found during the initialization of the {@code
   * MaterialContainerTransform}, then an {@link IllegalArgumentException} will be thrown.
   */
public void setDrawingViewId(@IdRes int drawingViewId) {
this.drawingViewId = drawingViewId;
}

Use this method to set a different 'drawing view' for one of your transitions and I think that would solve it.

user_112181380
Related