材料设计——折叠自定义toolbar

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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:fitsSystemWindows="true"
    tools:context="com.weiyang.bojiuvedio.ui.discovery.DiscoveryDetailActivity">

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

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            app:contentScrim="@color/grey_f2"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
            <ImageView
                android:id="@+id/im_design_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:fitsSystemWindows="true"
                android:background="@mipmap/img_test"
                app:layout_collapseMode="parallax" />
            <RelativeLayout
                android:id="@+id/rr_Layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_collapseMode="parallax">
                <ImageView
                    android:id="@+id/im_design_back"
                    android:src="@mipmap/fanhui_bai"
                    android:layout_marginTop="@dimen/y23"
                    android:layout_marginLeft="@dimen/x16"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" />
                <!--faxain2jym_yiguanzhu-->
                <ImageView
                    android:id="@+id/im_design_attention"
                    android:src="@mipmap/faxain2jym_guanzhu"
                    android:layout_alignParentRight="true"
                    android:layout_marginTop="@dimen/y30"
                    android:layout_marginRight="@dimen/x20"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" />

                <LinearLayout
                    android:layout_marginTop="@dimen/y45"
                    android:gravity="center_horizontal"
                    android:orientation="vertical"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">
                    <ImageView
                        android:id="@+id/im_design_photo"
                        android:background="@mipmap/faxianzz_touxiangzhanweifu"
                        android:layout_width="@dimen/x126"
                        android:layout_height="@dimen/y126" />
                    <TextView
                        android:id="@+id/tv_design_name"
                        android:layout_marginTop="@dimen/y19"
                        android:layout_marginLeft="@dimen/x49"
                        android:layout_marginRight="@dimen/x49"
                        android:text="name"
                        android:textSize="@dimen/x28"
                        android:textColor="@color/white"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />
                    <TextView
                        android:id="@+id/tv_design_desprite"
                        android:layout_marginTop="@dimen/y31"
                        android:layout_marginLeft="@dimen/x49"
                        android:layout_marginRight="@dimen/x49"
                        android:text="desprite"
                        android:maxLines="2"
                        android:ellipsize="end"
                        android:textSize="@dimen/x26"
                        android:textColor="@color/white"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />
                    <TextView
                        android:id="@+id/tv_design_infomation"
                        android:layout_marginTop="@dimen/y23"
                        android:layout_marginLeft="@dimen/x49"
                        android:layout_marginRight="@dimen/x49"
                        android:layout_marginBottom="@dimen/y26"
                        android:text="infomation"
                        android:textSize="@dimen/x28"
                        android:textColor="@color/white"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />
                </LinearLayout>
            </RelativeLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="@dimen/y96"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay">
                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginRight="@dimen/x25">
                    <ImageView
                        android:id="@+id/title_leftimageview"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingTop="@dimen/y24"
                        android:paddingBottom="@dimen/y24"
                        android:paddingRight="@dimen/x24"
                        android:layout_alignParentLeft="true"
                        android:layout_centerVertical="true"
                        android:src="@mipmap/fanhui"/>
                    <TextView
                        android:id="@+id/title_centertextview"
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:layout_centerHorizontal="true"
                        android:layout_centerVertical="true"
                        android:gravity="center"
                        android:text="标题"
                        android:textColor="@color/black_333"
                        android:textSize="@dimen/x34" />
                </RelativeLayout>
            </android.support.v7.widget.Toolbar>
        </android.support.design.widget.CollapsingToolbarLayout>

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

    <cn.droidlover.xrecyclerview.XRecyclerContentLayout
        android:id="@+id/xrc_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingLeft="@dimen/y21"
        android:visibility="gone">

    </cn.droidlover.xrecyclerview.XRecyclerContentLayout>

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

AppBarLayout中作为一个整体。
1、在CollapsingToolbarLayout中：
我们设置了layout_scrollFlags:关于它的值我这里再说一下：
scroll - 想滚动就必须设置这个。
enterAlways - 实现quick return效果, 当向下移动时，立即显示View（比如Toolbar)。
exitUntilCollapsed - 向上滚动时收缩View，但可以固定Toolbar一直在上面。
enterAlwaysCollapsed - 当你的View已经设置minHeight属性又使用此标志时，你的View只能以最小高度进入，只有当滚动视图到达顶部时才扩大到完整高度。
其中还设置了一些属性，简要说明一下：
contentScrim - 设置当完全CollapsingToolbarLayout折叠(收缩)后的背景颜色。
expandedTitleMarginStart - 设置扩张时候(还没有收缩时)title向左填充的距离。
app:expandedTitleGravity=”center”

2、在ImageView控件中：
我们设置了：
*layout_collapseMode (折叠模式) - 有两个值:（重要）

• pin - 设置为这个模式时，当CollapsingToolbarLayout完全收缩后，Toolbar还可以保留在屏幕上。
• parallax - 设置为这个模式时，在内容滚动时，CollapsingToolbarLayout中的View（比如ImageView)也可以同时滚动，实现视差滚动效果，通常和layout_collapseParallaxMultiplier(设置视差因子)搭配使用。

*layout_collapseParallaxMultiplier(视差因子) - 设置视差滚动因子，值为：0~1。

private static final float PERCENTAGE_TO_SHOW_TITLE_AT_TOOLBAR = 0.9f;
    private static final float PERCENTAGE_TO_HIDE_TITLE_DETAILS = 0.3f;
    private static final int ALPHA_ANIMATIONS_DURATION = 100;
    private boolean mIsTheTitleVisible = false;
    private boolean mIsTheTitleContainerVisible = true;
@Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
         appBar.addOnOffsetChangedListener(this); //监听
        startAlphaAnimation(titleLeftimageview, 0, View.GONE);
        startAlphaAnimation(titleCentertextview, 0, View.GONE);
    }
 @Override
    public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
        int maxScroll = appBarLayout.getTotalScrollRange();
        float percentage = (float) Math.abs(verticalOffset) / (float) maxScroll;

        handleAlphaOnTitle(percentage);
        handleToolbarTitleVisibility(percentage);
    }


    private void handleToolbarTitleVisibility(float percentage) {
        if (percentage >= PERCENTAGE_TO_SHOW_TITLE_AT_TOOLBAR) {
            if (!mIsTheTitleVisible) {
//                startAlphaAnimation(toolbar, 0, View.VISIBLE);
                startAlphaAnimation(titleLeftimageview, ALPHA_ANIMATIONS_DURATION, View.VISIBLE);
                startAlphaAnimation(titleCentertextview, ALPHA_ANIMATIONS_DURATION, View.VISIBLE);
                mIsTheTitleVisible = true;
            }
        } else {
            if (mIsTheTitleVisible) {
//                startAlphaAnimation(toolbar, 0, View.GONE);
                startAlphaAnimation(titleLeftimageview, ALPHA_ANIMATIONS_DURATION, View.GONE);
                startAlphaAnimation(titleCentertextview, ALPHA_ANIMATIONS_DURATION, View.GONE);
                mIsTheTitleVisible = false;
            }
        }
    }

    private void handleAlphaOnTitle(float percentage) {
        if (percentage >= PERCENTAGE_TO_HIDE_TITLE_DETAILS) {
            if (mIsTheTitleContainerVisible) {
                startAlphaAnimation(rrDesignView, ALPHA_ANIMATIONS_DURATION, View.INVISIBLE);
                mIsTheTitleContainerVisible = false;
            }
        } else {
            if (!mIsTheTitleContainerVisible) {
                startAlphaAnimation(rrDesignView, ALPHA_ANIMATIONS_DURATION, View.VISIBLE);
                mIsTheTitleContainerVisible = true;
            }
        }
    }


    public static void startAlphaAnimation(View v, long duration, int visibility) {
        AlphaAnimation alphaAnimation = (visibility == View.VISIBLE)
                ? new AlphaAnimation(0f, 1f)
                : new AlphaAnimation(1f, 0f);
        alphaAnimation.setDuration(duration);
        alphaAnimation.setFillAfter(true);
        v.startAnimation(alphaAnimation);
    }

*如果想动态设置toolbar，toolbar上的设置是在CollapsingToolbarLayout 上进行设置；

Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);  
    setSupportActionBar(mToolbar);  
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);  
    mToolbar.setNavigationOnClickListener(new View.OnClickListener() {  
        @Override  
        public void onClick(View v) {  
            onBackPressed();  
        }  
    });  
    //使用CollapsingToolbarLayout必须把title设置到CollapsingToolbarLayout上，设置到Toolbar上则不会显示  
    CollapsingToolbarLayout mCollapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);  
    //设置标题
    mCollapsingToolbarLayout.setTitle("CollapsingToolbarLayout");  
    //通过CollapsingToolbarLayout修改字体颜色  
    mCollapsingToolbarLayout.setExpandedTitleColor(Color.WHITE);//设置还没收缩时状态下字体颜色  
    mCollapsingToolbarLayout.setCollapsedTitleTextColor(Color.GREEN);//设置收缩后Toolbar上字体的颜色