android联系人吸顶效果可点击,酷炫吸顶效果二：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是同一级

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:background="@color/color_F7F4F8"

android:orientation="vertical">

android:id="@+id/mSwipeLayout"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/loading"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:overScrollMode="never">

android:id="@+id/recycler_view"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:overScrollMode="never" />

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

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

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

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

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

复制代码

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));

}

}

});

}

复制代码

完美结束！