Search code examples
javaandroidandroid-coordinatorlayoutandroid-appbarlayout

Changing AppBarLayout height makes list below "jump" sharply


I switched to CoordinatorLayout/AppBarLayout mainly to utilize app:layout_scrollFlags="scroll|enterAlways" (view peeks from the top when scrolling upwards). I'm using a RecyclerView without a NestedScrollLayout as the second prevents the view from recycling and after loading a lot of items it starts to lag.

The "peeking" view is the AppBarLayout and it's being resized when clicked in order to show/hide filter options. Everything works as expected, except that when resizing the AppBarLayout (by setting child views visibility), it seems like the whole layout is being rendered, for a mere moment the RecyclerView is "jumping" to the top and then back to the expected behavior. It's very very quick yet very annoying. When replaced with a LinearLayout it doesn't happen, but obviously the view doesn't peek.

My layout:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fragment_notifications"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:animateLayoutChanges="true">

    <android.support.design.widget.AppBarLayout android:id="@+id/fragment_notifications_filter_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        android:animateLayoutChanges="true">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:animateLayoutChanges="true"
            app:layout_scrollFlags="scroll|enterAlways">

            <!--Two example views with different heights, of which only one is visible at a time -->
            <ImageView android:id="@+id/view1"
                android:layout_width="match_parent"
                android:layout_height="68dp"
                android:src="@drawable/ic_launcher"/>

            <ImageView android:id="@+id/view2"
                android:layout_width="match_parent"
                android:layout_height="44dp"
                android:src="@drawable/ic_launcher"/>
            ...
        </RelativeLayout>

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/fragment_notifications_refresh"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <android.support.v7.widget.RecyclerView
                android:id="@+id/fragment_notifications_notifications"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                android:scrollbars="vertical" />

        </FrameLayout>
    </android.support.v4.widget.SwipeRefreshLayout>

</android.support.design.widget.CoordinatorLayout>

The Java code is pretty simple; just setting the visibility of views inside the AppBarLayout:

someViewInsideAppBarLayout.setVisibility(visible ? View.VISIBLE : View.GONE);

Any idea how to deal with this? Thanks!


Solution

  • I had to enable the transition of type LayoutTransition.CHANGING (disabled by default) in the ViewGroup that has the appbar scrolling behavior (in my case it's the SwipeRefreshLayout).

    LayoutTransition layoutTransition = swipeRefreshLayout.getLayoutTransition();
    layoutTransition.enableTransitionType(LayoutTransition.CHANGING);
    

    Later on I faced additional odd animation behavior that was solved by changing the LayoutTransition.CHANGE_DISAPPEARING value of the parents of the disappearing view(s) to 0 (originally 300):

    relativeLayout.getLayoutTransition().setStartDelay(LayoutTransition.CHANGE_DISAPPEARING, 0);
    appBar.getLayoutTransition().setStartDelay(LayoutTransition.CHANGE_DISAPPEARING, 0);
    coordinatorLayout.getLayoutTransition().setStartDelay(LayoutTransition.CHANGE_DISAPPEARING, 0);