AppBarLayout elevation change is delayed on appCompat v24.0.0

Question

In Appcompat v24.0.0 causes rendering of shadow/elevation to AppbarLayout after Activity is visible. And a lag can easily be seen in shadow drawing to AppbarLayout.

And this lag was not there in previous Appcompat library version.

Tested using both Appcompat v24.0.0 and Appcompat v23.4.0, shadow drawing clearly seen in the new version.

Answer 1

This is a bug in Appcompat v24.0.0.

References: https://code.google.com/p/android/issues/detail?id=213895

In order to minimize the delay in elevation drawing, set the duration to 1ms in your own StateListAnimator and apply it to AppbarLayout.

appbar_always_elevated.xml in animator-v21 folder under res directory.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <objectAnimator android:propertyName="elevation"
                        android:valueTo="8dp"
                        android:valueType="floatType"
                        android:duration="1"/>
    </item>

</selector>

In AppbarLayout :

<android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:fitsSystemWindows="true"
        android:stateListAnimator="@animator/appbar_always_elevated"
        android:theme="@style/AppTheme.AppBarOverlay">

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

Answer 2

Chris Banes said here:

The StateListAnimator owns all elevation handling now. If you want to do it yourself, set a null StateListAnimator and call setElevation() as you please.

So if your AppBarLayout is not collapsible you can use this:

<android.support.design.widget.AppBarLayout
    android:stateListAnimator="@null"
    android:elevation="@dimen/design_appbar_elevation">

Answer 3

I guess it is not a bug, a feature.

AppBarLayout's elevation animation duration is controlled by R.integer.app_bar_elevation_anim_duration which by default is 150.

To remove the animation, just do the following and that's it:

<integer name="app_bar_elevation_anim_duration" tools:override="true">0</integer>

Answer 4

@Vipul Asri given us a good answer, but the appbar_always_elevated.xml should be into animator-v11 instead of animator-v21 folder. The layout that has the AppbarLayout is that should be into a v21 folder.

Summarising, the structure is like this:

-res
   -animator-v11
      -appbar_always_elevated.xml
   -layout
      -a_layout_wich_has_the_appbarlayout.xml
   -layout-v21
      -a_layout_wich_has_the_appbarlayout.xml

Note that there are two a_layout_wich_has_the_appbarlayout.xml files (AppbarLayout in v21 folder with android:stateListAnimator property and in a non v21 folder without this property).

Take a look:

In a non v21 layout folder:

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

And, in v21 layout folder:

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:stateListAnimator="@animator/appbar_always_elevated">

EDIT

Curiously, if you are using the AppbarLayout with a TabLayout, the shadow is drawn instantly, but notice that if you are using with the android:stateListAnimator property this case, the shadow view is a bit different.