Page(s) contain a ViewGroup with a LayoutTransition (or animateLayoutChanges="true"), which interferes with the scrolling animation

Question

I use fragments with ViewPager2, and I notice two relevant IllegalStateExceptions in production (I can't reproduce it myself) occurring in devices like Xiaomi, Yulong, asus, vivo running Android 8 or 9:

Fatal Exception: java.lang.IllegalStateException: Page can only be offset by a positive amount, not by -758
       at androidx.viewpager2.widget.ScrollEventAdapter.updateScrollEventValues(ScrollEventAdapter.java:280)
       at androidx.viewpager2.widget.ScrollEventAdapter.onScrolled(ScrollEventAdapter.java:178)
       at androidx.recyclerview.widget.RecyclerView.dispatchOnScrolled(RecyclerView.java:5173)
       at androidx.recyclerview.widget.RecyclerView$ViewFlinger.run(RecyclerView.java:5338)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1029)
       at android.view.Choreographer.doCallbacks(Choreographer.java:834)
       at android.view.Choreographer.doFrame(Choreographer.java:760)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1015)
       at android.os.Handler.handleCallback(Handler.java:873)
       at android.os.Handler.dispatchMessage(Handler.java:99)
       at android.os.Looper.loop(Looper.java:224)
       at android.app.ActivityThread.main(ActivityThread.java:7083)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:537)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:928)

and

Fatal Exception: java.lang.IllegalStateException: Page(s) contain a ViewGroup with a LayoutTransition (or animateLayoutChanges="true"), which interferes with the scrolling animation. Make sure to call getLayoutTransition().setAnimateParentHierarchy(false) on all ViewGroups with a LayoutTransition before an animation is started.
       at androidx.viewpager2.widget.ScrollEventAdapter.updateScrollEventValues(ScrollEventAdapter.java:272)
       at androidx.viewpager2.widget.ScrollEventAdapter.onScrolled(ScrollEventAdapter.java:178)
       at androidx.recyclerview.widget.RecyclerView.dispatchOnScrolled(RecyclerView.java:5173)
       at androidx.recyclerview.widget.RecyclerView$ViewFlinger.run(RecyclerView.java:5338)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1029)
       at android.view.Choreographer.doCallbacks(Choreographer.java:841)
       at android.view.Choreographer.doFrame(Choreographer.java:769)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1015)
       at android.os.Handler.handleCallback(Handler.java:794)
       at android.os.Handler.dispatchMessage(Handler.java:99)
       at android.os.Looper.loop(Looper.java:176)
       at android.app.ActivityThread.main(ActivityThread.java:6651)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:547)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:824)

While looking around, I passed by the following thread: https://issuetracker.google.com/issues/129530305, which as I understood correctly, seems to summarize to set animateLayoutChanges to false on any parent layout of viewPager2 and that's what I did. Unfortunately, that didn't solve my issue. Then I found another thread: java.lang.IllegalStateException: Page can only be offset by a positive amount, which seems to not help a lot. Any idea what else might cause the issue?

Wharfage

Did you have a look at lines 245 and 254 of the source? – Tiemroth

Answer 1

You need to perform this on each of your pages/Fragments

 View view = layoutInflater.inflate(R.layout.page, parent, false);
 ViewGroup viewGroup = view.findViewById(R.id.animated_viewgroup);
 viewGroup.getLayoutTransition().setAnimateParentHierarchy(false);

As looking at official documentation here

https://developer.android.com/reference/androidx/viewpager2/widget/ViewPager2

It states that

If your pages contain LayoutTransitions, then those LayoutTransitions must have animateParentHierarchy set to false. Note that if you have a ViewGroup with animateLayoutChanges="true" in your layout xml file, a LayoutTransition is added automatically to that ViewGroup. You will need to manually call getLayoutTransition().setAnimateParentHierarchy(false) on that ViewGroup after you inflated the xml layout.

same your error log talks about on very first line

Fatal Exception: java.lang.IllegalStateException: Page(s) contain a ViewGroup with a LayoutTransition (or animateLayoutChanges="true"), which interferes with the scrolling animation. Make sure to call getLayoutTransition().setAnimateParentHierarchy(false) on all ViewGroups with a LayoutTransition before an animation is started.

Hemiplegia

The thing is, I cannot find any ViewGroup which has a LayoutTransition in the fragments I have. I looped through the child views as well and checking for viewGroup.getLayoutTransition() but they all seem to be null. So I'm not sure where the code triggers the exception. – Wharfage

I started the thread mentioned above. I have seen the first exception intermittently in Android Vitals, but not the second exception. I'm not using any LayoutTransitions, but I am using viewpager2.setPageTransformer. – Tiemroth

@Tiemroth which devices does the exception occur on? – Wharfage

I have had this exception only a few times. The devices: Motorola Moto G4 Play (Android 6.0, en_GB), Google Pixel 3 (Android 9, en_GB), and Huawei Mate 9 (Android 7.0, fr_FR). There doesn't seem to be any pattern. It's probably a timing issue, where the automated tests mash the UI rapidly. – Tiemroth

Same. I thought I fixed it by looping through all the ViewGroups and setting setAnimateParentHierarchy to false whenever it's true thinking that might solve it for whenever a ViewGroup has a LayoutTransition but the crash reports just seem to increase in numbers. The only option I now have is to revert back to ViewPager. – Wharfage

If this is explicitly set then just confirm as it must be set to OFFSCREEN_PAGE_LIMIT_DEFAULT like setOffscreenPageLimit(OFFSCREEN_PAGE_LIMIT_DEFAULT) – Hemiplegia

Setting the off-screen page limit to a positive integer is supported though: link – Tiemroth

Answer 2

Another Problem I had was, that I did not got the above exception, but my viewpager2 started to flick / reload the page, when the transition started. I was a bit confused by these examples and how to add set setAnimateParentHiearchy to false, so I would like to add another example, how to fix this problem:

ViewPager Layout

<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!-- Toolbar -->
        <include
            android:id="@+id/headline"
            layout="@layout/registration_toolbar"
            app:isBold="@{false}"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:outsideToolbarTitle="@{@string/fragment_user_data_toolbar_title}" />

        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tl_user_data"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/headline" />

        <!-- This Viewpager contains a fragment, which has android:animateLayoutChanges="true" -->
        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/vp_user_data"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_marginTop="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/tl_user_data" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

Fragment Layout (which will be inside the viewpager)

   <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/outerContraintLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:animateLayoutChanges="true" > <-- THIS WILL CAUSE PROBLEMS

       <!-- Deleted unnecessary parts -->


    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

If you want to keep android:animateLayoutChanges, you have to call this inside your fragments onViewCreated()

class MyFragmentInsideViewPagerThatHasProblems : Fragment(R.layout.above_layout) {

     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        val viewGroup = requireView().findViewById<ConstraintLayout>(R.id.outerContraintLayout) as ViewGroup
        viewGroup.layoutTransition.setAnimateParentHierarchy(false)
     }
}

Whatley

Answer 3

I had the second error when used viewPager2. As commented above, in my fragment layout I found viewGroup with animateLayoutChanges="true", then in fragment OnViewCreated I called

viewGroup.getLayoutTransition().setAnimateParentHierarchy(false);

That's fix my problem!

Ionopause

Answer 4

I was trying previous answers but none of them are working then I found a solution. Need to stop smooth animation for that we can use TabLayoutMediator

You need to add this with your viewpager2

 TabLayoutMediator(tabLayout,  binding.viewPager, false , false) { tab,position ->
        tab.text = tabTitle[position]
    }.attach()

If you don't want to show text no worry just commit this code. Hope this will solve the issues.

Althaalthea