酷炫吸顶效果二：ByRecyclerView如何实现的酷炫吸顶效果

1.先看效果

2.首先，我是使用ByRecyclerView，因此必须要在项目build.gradle文件中引入包

    implementation 'com.github.youlookwhat:ByRecyclerView:1.0.11-support'

3.xml布局文件其实是很简单的引入控件 因为首页的滑动都是动态加载的，因此我使用了ByRecyclerView的多布局，通过在适配器中通过getItemViewType来处理不同item的效果（此处就不多说，后续会有专门的文章来讲这个） 因此：

a.顶部的搜索栏，默认的是在ByRecyclerView适配器中的position=0的item项中 而滑动显示的顶部搜索栏，是在activity中的，跟ByRecyclerView是同一级

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


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/color_F7F4F8"
        android:orientation="vertical">
        <android.support.v4.widget.SwipeRefreshLayout
            android:id="@+id/mSwipeLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <com.example.jingbin.zkfudou.view.LoadingLayout
                android:id="@+id/loading"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:overScrollMode="never">
                    <me.jingbin.library.ByRecyclerView
                        android:id="@+id/recycler_view"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:overScrollMode="never" />
<!--                </LinearLayout>-->

                <!--                    </com.example.jingbin.zkfudou.view.MyScrollView>-->
            </com.example.jingbin.zkfudou.view.LoadingLayout>
        </android.support.v4.widget.SwipeRefreshLayout>
        
                <RelativeLayout
            android:id="@+id/search"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:background="@color/colorWhite"
            android:paddingLeft="15dp"
            android:paddingTop="30dp"
            android:visibility="invisible"
            android:paddingBottom="10dp"
            android:paddingRight="20dp">

            <RelativeLayout
                android:id="@+id/ll_search"
                android:layout_width="match_parent"
                android:layout_height="27dp"
                android:layout_alignParentTop="true"
                android:layout_marginRight="15dp"
                android:layout_toLeftOf="@+id/iv_msg"
                android:background="@drawable/search_bg_2"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/iv_search"
                    android:layout_width="15dp"
                    android:layout_height="15dp"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="10dp"
                    android:src="@mipmap/search_bar_1" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="5dp"
                    android:layout_toRightOf="@+id/iv_search"
                    android:text="想找点什么？"
                    android:textColor="@color/color_999999"
                    android:textSize="13sp" />
            </RelativeLayout>

            <ImageView
                android:id="@+id/iv_msg"
                android:layout_width="21dp"
                android:layout_height="21dp"
                android:layout_alignParentTop="true"
                android:layout_alignParentRight="true"
                android:layout_marginTop="4.5dp"
                android:src="@mipmap/iv_msg_1" />
        </RelativeLayout>

        <!--            </LinearLayout>-->
        <!--        </android.support.v4.widget.NestedScrollView>-->
    </RelativeLayout>

</layout>

4.设置ByRecyclerView的滑动监听事件

通过监听滑动状态，来动态控制外层顶部布局的显示和隐藏，以及动画效果

注意：

a.外层定义 int[] dyFlush = {0};的作用：为了解决recyclerView再往上的时候，顶部布局没有隐藏

b.dyFlush原理：当滑动到第一项时，记录recyclerView滑动的高度总和

    int[] dyFlush = {0};
    private void setTopView() {

        bindingView.recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(RecyclerView t, int dx, int dy) {
                //找到即将移出屏幕Item的position,position是移出屏幕item的数量
                int position = manager.findFirstVisibleItemPosition();
                //根据position找到这个Item
                View firstVisiableChildView = manager.findViewByPosition(position);
                //获取Item的高
                int itemHeight = firstVisiableChildView.getHeight();
                //算出该Item还未移出屏幕的高度
                int itemTop = firstVisiableChildView.getTop();
                //position移出屏幕的数量*高度得出移动的距离
                int iposition = position * itemHeight;
//                //减去该Item还未移出屏幕的部分可得出滑动的距离
//                iResult = iposition - itemTop;

                dyFlush[0] += dy;
                if (position == 0){

//                    if (dyFlush[0]> 0) {
                        iposition = dyFlush[0];
//                    }else {
//                        iposition += dyFlush[0];
//                    }
                }else {
//                    iposition += dyFlush[0];
                }
                Log.d("TeshLog","position:"+position);
                Log.d("TeshLog","dy:"+dy);
                Log.d("TeshLog","dyFlush[0]:"+dyFlush[0]);
                Log.d("TeshLog","itemHeight:"+itemHeight);
                Log.d("TeshLog","iposition:"+iposition);

                int height = bindingView.search.getHeight();
                Log.d("TeshLog","height:"+height);
                Log.d("TeshLog","----------------------------------------------");
                if (iposition <= 0) {
                    bindingView.search.setVisibility(View.GONE);
                    bindingView.search.setBackgroundColor(Color.argb((int) 0, 227, 29, 26));//AGB由相关工具获得，或者美工提供
                } else if (iposition > 0 && iposition < height) {
                    bindingView.search.setVisibility(View.VISIBLE);
                    //获取ScrollView向下滑动图片消失的比例
                    float scale = (float) iposition / height;
                    //更加这个比例,让标题颜色由浅入深
                    float alpha = (255 * scale);
                    // 只是layout背景透明
                    bindingView.search.setBackgroundColor(Color.argb((int) alpha, 255, 255, 255));
                }else {
                    bindingView.search.setVisibility(View.VISIBLE);
                    bindingView.search.setBackgroundColor(getResources().getColor(R.color.colorWhite));
                }

            }
        });
    }

完美结束！