android设计库工具栏阴影[关闭]答案

【问题标题】：android design library toolbar shadow [closed]android设计库工具栏阴影[关闭]
【发布时间】：2015-09-09 07:59:51
【问题描述】：

尝试新的 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" />

结果工具栏收起时有阴影。

但是当它展开时阴影消失了。

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

【问题讨论】：

这可能不是一个错误——它可能意味着执行本页底部“具有重叠内容的灵活空间”下描述的行为：google.com/design/spec/patterns/…
您找到解决方案了吗？我认为这种行为是有意的，但如果你想要阴影，即使在扩展时也很麻烦。我试过听 AppBarLayout 偏移变化并手动设置阴影，并将 AppBarLayout 包装在 RelativeLayout 中并手动在下面放置阴影，但没有任何效果...
@Thoast83 在下面发布答案。
@RamanBranavitski 我不明白，当我问你是否找到方法时，为什么要发布答案..？但我今天居然找到了一个方法，也许有更好的方法，但它确实有效。你想让我把它作为解决方案发布吗？

标签： android toolbar shadow

【解决方案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

旧答案

我通过在ViewPager 周围加上FrameLayout 并设置android:foreground 解决了这个问题。

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

【讨论】：

【解决方案2】：

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

您必须将stateListAnimator 应用到您的 AppBarLayout：

示例：

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

并将此 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>

【讨论】：

【解决方案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">

【讨论】：

完美运行，谢谢，但需要最低 api 级别 21

【解决方案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());
            }
        });

【讨论】：