Android Material Design - CollapsingToolbarLayout 折叠后如何更改工具栏的背景颜色答案

【问题标题】：Android Material Design - How to change background color of Toolbar after CollapsingToolbarLayout is collapsedAndroid Material Design - CollapsingToolbarLayout 折叠后如何更改工具栏的背景颜色
【发布时间】：2015-08-17 15:12:38
【问题描述】：

用户向下滚动屏幕后，CollapsingToolbarLayout 中的图像消失，并留下带有返回按钮、内容标题和设置菜单的工具栏。我想知道如何仅在该工具栏处于“折叠”状态时更改其背景颜色。

我所指的动作与工具栏背景颜色变为绿色的情况类似：

在 CollapsingToolbarLayout 下面我有一个 NestedScrollView 和 CardViews

【问题讨论】：

可以给我代码吗？
你是如何制作 gif 的？

标签： android material-design android-collapsingtoolbarlayout

【解决方案1】：

我想你在关注app:contentScrim。

<android.support.design.widget.CollapsingToolbarLayout
    ...
    app:contentScrim="?attr/colorPrimary">
    <!-- Toolbar and ImageView here -->
</android.support.design.widget.CollapsingToolbarLayout>

【讨论】：

当我旋转我的手机时，这个 CollapsingToolbarLayout app:contentScrim="?attr/colorPrimary" 会导致 android.view.InflateException Error inflating class ，其他人说要替换 ?attr @color 或 @dimen等，但他们不被应用程序识别：......我该怎么办？谢谢
请问 ELI5 Scrim 是什么意思？
@SudhirKhanger 我也很好奇。看起来他们指的是剧院中使用的一种设备：“一块在从后面照亮之前看起来不透明的纱布，用作屏幕或背景。” google.com/search?q=scrim

【解决方案2】：

先删除

app:contentScrim="?attr/colorPrimary">

来自 CollapsingToolbarLayout

添加库

compile 'com.android.support:palette-v7:23.2.1'

并在java代码中添加以下代码

    Bitmap bitmap = BitmapFactory.decodeResource(getApplicationContext().getResources(), R.drawable.ny);
    Palette.generateAsync(bitmap,
            new Palette.PaletteAsyncListener() {
                @Override
                public void onGenerated(Palette palette) {
                    Palette.Swatch vibrant =
                            palette.getVibrantSwatch();
                    int mutedColor = palette.getVibrantSwatch().getRgb();
                    if (vibrant != null) {
                        // If we have a vibrant color
                        // update the title TextView
                        collapseToolbar.setBackgroundColor(mutedColor);
                        //  mutedColor = palette.getMutedColor(R.attr.colorPrimary);
                        collapseToolbar.setStatusBarScrimColor(palette.getDarkMutedColor(mutedColor));
                        collapseToolbar.setContentScrimColor(palette.getMutedColor(mutedColor));

                    }
                }
            });

【讨论】：

generateAsync 已被弃用，尽管在删除 app:contentScrim="?attr/colorPrimary" 后，我的身边并没有改变，有什么帮助吗？

【解决方案3】：

在collapsed模式下，只需使用CollapsingToolbarLayout XML属性contentScrim设置Toolbar背景色。

app:contentScrim="YOUR_TOOLBAR_COLOR"

这是一个例子：

<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:id="@+id/img_group_photo"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        android:scaleType="centerCrop"
        app:layout_collapseMode="parallax" />

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

希望对你有帮助~

【讨论】：

【解决方案4】：

也许你一直在寻找的是这个：

myCollapsingToolbar.setContentScrimColor(getResources().getColor(R.color.my_color_id));

它对我有用，并在折叠工具栏折叠后更改它的颜色，以帮助我适应折叠工具栏全尺寸时显示的图像的主要颜色。有了这个，颜色显然可以通过编程来改变！

我知道我迟到了，但我希望它能有所帮助。

【讨论】：

【解决方案5】：

您可以使用AppBarLayout 的偏移量侦听器并根据所需的行为更改CollapsingTollbar 属性。

appBarLayout.addOnOffsetChangedListener { _, verticalOffSet ->
            if (Math.abs(verticalOffSet) == appBarLayout.totalScrollRange) {
                //Collapsed
                toolBar.setBackgroundDrawable(ContextCompat.getDrawable(this,
                        R.drawable.last_revolut_gradient))
            } else {
                //Expanded
                toolBar.setBackgroundColor(ContextCompat.getColor(this,
                        android.R.color.transparent))
            }
        }

【讨论】：

【解决方案6】：

    Bitmap bitmap = BitmapFactory.decodeResource(getResources(),
            R.drawable.header);

    Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
        @SuppressWarnings("ResourceType")

        @Override
        public void onGenerated(Palette palette) {
            Palette.Swatch vibrant =
                    palette.getVibrantSwatch();

            if (vibrant != null) {

                collapsingToolbar.setBackgroundColor(getResources().getColor(R.color.cpb_blue));
                collapsingToolbar.setStatusBarScrimColor(getResources().getColor(R.color.cpb_blue));
                collapsingToolbar.setContentScrimColor(getResources().getColor(R.color.cpb_blue));

            }
        }

    });

【讨论】：