Question

在我的应用程序中，当我开始滚动布局时，CollapsingToolbarLayout几乎立即开始将背景更改为我设置的稀松布颜色。

有没有办法设置CollapsingToolbar开始更改背景的值？

这是我的XML布局：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="eu.ericnisoli.ambrosettiap.activities.MeetingActivity"
    android:visibility="visible"
    android:id="@+id/container">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:fitsSystemWindows="true"
        android:layout_height="@dimen/app_bar_height"
        android:layout_width="match_parent"
        android:theme="@style/AppTheme.AppBarOverlay">

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

            <RelativeLayout
                android:id="@+id/relativeLayout_title"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom|center_horizontal"
                app:layout_collapseMode="parallax">

                <FrameLayout
                    android:id="@+id/frameLayout_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_above="@+id/frameLayout_info">

                    <ImageView
                        android:id="@+id/imageView_bg"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:src="@drawable/login_bg"
                        android:scaleType="centerCrop"/>

                    <View
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@drawable/detail_meeting_gradient" />

                    <LinearLayout
                        android:id="@+id/linearLayout_title"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:orientation="vertical"
                        android:paddingStart="16dp"
                        android:paddingEnd="80dp"
                        android:paddingTop="16dp"
                        android:paddingBottom="16dp"
                        android:layout_gravity="bottom">

                        <TextView
                            android:id="@+id/textView_meeting"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="4dp"
                            android:text="@string/meeting"
                            android:textColor="@color/text_grey_1"
                            android:textSize="@dimen/text_size_14"
                            android:textAllCaps="true"
                            />

                        <TextView
                            android:id="@+id/textView_title"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:textColor="@android:color/white"
                            android:textSize="@dimen/text_size_16"
                            android:text="New Text"
                            />

                    </LinearLayout>

                </FrameLayout>

                <FrameLayout
                    android:id="@+id/frameLayout_info"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:background="@color/grey_2">

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:orientation="horizontal">

                        <RelativeLayout
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:paddingTop="32dp"
                            android:paddingBottom="32dp">

                            <LinearLayout
                                android:orientation="vertical"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_centerHorizontal="true"
                                android:gravity="center">

                                <ImageView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:src="@drawable/pin_small_icon"
                                    android:layout_marginBottom="4dp"/>

                                <TextView
                                    android:id="@+id/textView_place"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:textColor="@color/text_black_1"/>

                                <TextView
                                    android:id="@+id/textView_address"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:textColor="@color/text_black_1"/>
                            </LinearLayout>

                        </RelativeLayout>

                        <RelativeLayout
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:paddingTop="32dp"
                            android:paddingBottom="32dp">

                            <LinearLayout
                                android:orientation="vertical"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_centerHorizontal="true"
                                android:gravity="center">

                                <ImageView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:src="@drawable/cal_small_icon"
                                    android:layout_marginBottom="4dp"/>

                                <TextView
                                    android:id="@+id/textView_date"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:textColor="@color/text_black_1"/>

                                <TextView
                                    android:id="@+id/textView_time"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:textColor="@color/text_black_1"/>
                            </LinearLayout>

                        </RelativeLayout>
                    </LinearLayout>

                </FrameLayout>

            </RelativeLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_height="?attr/actionBarSize"
                android:layout_width="match_parent"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay"
                app:title="@string/event_caps"/>

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

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

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:layout_anchor="@+id/app_bar"
            app:layout_anchorGravity="bottom"
            app:layout_collapseMode="pin">

            <android.support.design.widget.TabLayout
                android:id="@+id/tabs"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:layout_gravity="bottom"
                app:layout_anchor="@+id/app_bar"
                app:layout_anchorGravity="bottom"
                android:background="@color/grey_2"
                app:tabTextColor="@color/text_black_1"
                app:tabSelectedTextColor="@color/text_black_1"
                style="@style/DetailTab"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

            <View
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@drawable/shadow"
                android:layout_gravity="bottom"/>

        </FrameLayout>

        <android.support.v4.view.ViewPager
            xmlns:app="http://schemas.android.com/apk/res-auto"
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/pager"
            android:layout_height="match_parent"
            android:layout_width="match_parent"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:layout_marginTop="?attr/actionBarSize"/>

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/fab_margin"
            app:layout_anchor="@id/frameLayout_title"
            app:layout_anchorGravity="bottom|end"/>

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

<ProgressBar
    android:id="@+id/progress"
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:indeterminate="true"
    android:layout_gravity="center"
    android:visibility="gone"/>

</FrameLayout>

Answer 1

使用版本26.1或更高版本，您可以使用scrimVisibleHeightTrigger属性设置高度阈值，以显示稀松布覆盖层。

<android.support.design.widget.CollapsingToolbarLayout
    app:scrimVisibleHeightTrigger="80dp"
    ...>

设置用于定义何时触发稀松布可见性更改的可见高度（以像素为单位）。

如果此视图的可见高度小于给定值，则将使可见光泽可见，否则它们将被隐藏。

Answer 2

干

在查看CollapsingToolbarLayout的实施后，您可能会看到，当CollapsingToolbarLayout高度低于其minimum height x 2 + "status bar height"时，内容稀松布会出现：

if (mContentScrim != null || mStatusBarScrim != null) {
    setScrimsShown(getHeight() + verticalOffset < getScrimTriggerOffset() + insetTop);
}

这里是getScrimTriggerOffset实施：

final int getScrimTriggerOffset() {
    return 2 * ViewCompat.getMinimumHeight(this);
}

很遗憾，设置minHeight属性不会有效，因为这段代码会在onLayout期间覆盖它：

if (mToolbarDirectChild == null || mToolbarDirectChild == this) {
    setMinimumHeight(getHeightWithMargins(mToolbar));
} else {
    setMinimumHeight(getHeightWithMargins(mToolbarDirectChild));
}

解决方案

在CollapsingToolbarLayout致电onLayout后延长setMinimumHeight。您还可以使用setContentScrimHeight方法使用以下实现：

import android.content.Context;
import android.support.design.widget.CollapsingToolbarLayout;
import android.util.AttributeSet;

public class MyCollapsingToolbarLayout extends CollapsingToolbarLayout {

    private int contentScrimHeight;

    public MyCollapsingToolbarLayout(Context context) {
        super(context);
    }

    public MyCollapsingToolbarLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyCollapsingToolbarLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        super.setMinimumHeight(contentScrimHeight);
    }

    public int getContentScrimHeight() {
        return contentScrimHeight;
    }

    public void setContentScrimHeight(int contentScrimHeight) {
        this.contentScrimHeight = contentScrimHeight;
        requestLayout();
    }
}

Answer 3

在视图的ID为setParallaxMultiplier(float)的布局参数上使用relativeLayout_title。

setParallaxMultiplier更改视差动画开始触发的阈值。默认情况下，它触发父高度的一半，相当于设置0.5f的值。

Source

CollapsingToolbarLayout设置动画阈值？

3 个答案:

干

解决方案