masi mojib
masi mojib

Reputation: 51

Animation issues in ViewPager

I want an animation of my buttons in a ViewPager. this means, if I swipe from page 1 to page 2 the "Next" button is contract and a second button moves beside it.

so far so good. if I now quickly swipe the animation gets stuck and it is no longer visible or only half visible. But the Button is still clickable.

Code

    @Override
    public void onPageSelected(int position) {

        addDotsIndicator(position);

        switch (position){
            case 0:
                TransitionManager.beginDelayedTransition(transitionContainer, new AutoTransition());
                btnSave.setVisibility(View.GONE);
                break;

            case 8:
                TransitionManager.beginDelayedTransition(transitionContainer, new AutoTransition());
                btnNext.setVisibility(View.GONE);
                break;

            default:
                TransitionManager.beginDelayedTransition(transitionContainer, new AutoTransition());
                btnSave.setVisibility(View.VISIBLE);
                btnNext.setVisibility(View.VISIBLE);
                break;
        }
    }

does anyone know how to work around the problem? or is there a way you would do this animation?

Demo

Here is a Demo

Upvotes: 1

Views: 371

Answers (1)

Inneke De Clippel
Inneke De Clippel

Reputation: 1026

I had a similar issue where I have a ViewPager, and after swiping the page I couldn't let the transition animate (the transition is on one of the pages and is triggered by a button click). The transition would just jump to the final state. The next time the animation would work. If I swiped the ViewPager again, the animation wouldn't work the next time.

After checking the code in beginDelayedTransition, I noticed the view needs to be laid out for an animation to run.

Putting the transition code in root.post { } does the trick for me. root being the ConstraintLayout.

fun ConstraintLayout.animateChanges(addChanges: (ConstraintSet) -> Unit) {
    if (ViewCompat.isLaidOut(this)) {
        animateChangesNow(addChanges)
    }
    else {
        requestLayout()
        post { animateChangesNow(addChanges) }
    }
}

private fun ConstraintLayout.animateChangesNow(addChanges: (ConstraintSet) -> Unit) {
    val constraintSet = ConstraintSet()
    constraintSet.clone(this)
    addChanges(constraintSet)
    TransitionManager.beginDelayedTransition(this)
    constraintSet.applyTo(this)
}

Upvotes: 0

Related Questions