Question

尝试新的Android设计库我发现了工具栏阴影的错误。使用CollapsingToolbarLayout时，仅当工具栏折叠时，工具栏下方的阴影才会出现。当我们展开它时，阴影消失了。我的布局看起来像

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="@dimen/user_avatar_height"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            app:layout_collapseMode="parallax" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:gravity="center_vertical"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        app:tabGravity="fill"
        app:tabIndicatorColor="@android:color/white"
        app:tabMaxWidth="0dp"
        app:tabMode="fixed" />

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

<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

结果工具栏折叠时有一个阴影。

但是当它扩大时它的阴影消失了。

有什么解决方案可以解决这个问题吗？可能有办法处理阴影出现/消失？感谢。

Answer 1

<强>更新

来自Google的支持图书馆团队似乎将该行为作为24.0.0的一部分进行了介绍，但它有点儿错误，所以现在需要做一个新的解决方法。

1 - 在res目录下的animator-v21文件夹中创建appbar_always_elevated.xml。

<?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>

2 - 在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>

旧答案

他们将此修复为新支持库版本（24）的一部分，因此您只需升级并使用正确的属性即可。

观看https://youtu.be/w45y_w4skKs?t=31m52s

旧答案

我通过在FrameLayout周围设置ViewPager并设置android:foreground来解决此问题。

附件是我正在使用的drawable，这里是gist

的链接

Answer 2

@ amilcar-andrade的回应帮助我找到了合适的解决方案，因为他的链接不正确。

您必须将<android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="320dp" android:stateListAnimator="@animator/appbar_always_elevated" android:fitsSystemWindows="true">应用于AppBarLayout：

示例：

<?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>

并使用此xml作为动画师：

{{1}}

Answer 3

就我而言，这段代码对我有用！

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:stateListAnimator="@null"
    android:elevation="4dp">

Answer 4

我只是覆盖CollapsingToolbarLayout这样的代码

public class ShadowCollapsingToolbarLayout extends CollapsingToolbarLayout {

private AppBarLayout.OnOffsetChangedListener mOnOffsetChangedListener;

//constructors

@Override
protected void onAttachedToWindow() {
    super.onAttachedToWindow();
    ViewParent parent = this.getParent();
    if (parent instanceof AppBarLayout) {
        if (mOnOffsetChangedListener != null)
            ((AppBarLayout) parent).addOnOffsetChangedListener(mOnOffsetChangedListener);
    }
}

public void setOnOffsetChangeListener(AppBarLayout.OnOffsetChangedListener listener) {
    mOnOffsetChangedListener = listener;
}
}

在xml中使用它而不是原生的CollapsingToolbarLayout并设置这样的监听器

mCollapsingLayout.setOnOffsetChangeListener(new AppBarLayout.OnOffsetChangedListener() {
            @Override
            public void onOffsetChanged(AppBarLayout appBarLayout, int i) {
                ViewCompat.setElevation(appBarLayout, appBarLayout.getTargetElevation());
            }
        });

android设计库工具栏阴影

4 个答案: