五分钟打造RecyclerView悬浮吸顶效果
2017-06-18 本文已影响5428人
wenld_
MultiType-Adapter打造悬浮吸顶效果
配合RecyclerView快速打造一款 展示UI 悬浮吸顶效果,如 通讯录效果,时光轴效果等等,且支持触摸事件。 内存友好!内存友好!内存友好!
MultiType-Adapter介绍地址:戳我! MultiType-Adapter是一款轻量级支持多数据类型的 RecyclerView 适配器; 使用简单,完全解耦;
第一种复用方面有致命的问题。recyclerview中推荐使用第二种和四种方式。 scrollerview当中推荐使用第三种 ,鉴于黏贴头部这块事件比较多样性,后面我会将黏贴部分抽出来 不再放入包中。
悬浮吸顶效果
效果1.gif效果2.gif
// root build.gradle
repositories {
jcenter()
maven { url "https://www.jitpack.io" }
}
// yout project build.gradle
dependencies {
compile 'com.github.LidongWen:MultiTypeAdapter:xxx'
}
使用 类型1
定义一个Adapter
class StickySigleTwoAdapter extends MultiTypeAdapter implements StickyHeaderAdapter {
@Override
public boolean isHeader(int position) {
if (position == 0 || position == 8 || position == 15|| position == 21|| position == 28) {
return true;
} else
return false;
}
}
使用
adapter = new StickySigleTwoAdapter();
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.rlv_multidata);
recyclerView.setNestedScrollingEnabled(false);
adapter.register(String.class, new ItemVIewNormal());
adapter.register(Bean01.class, new ItemVIew01());
adapter.register(Bean02.class, new ItemVIew02());
adapter.register(Bean03.class, new ItemVIew03());
recyclerView.setAdapter(adapter);
StickyControl.anyHeader2()
.adapter(adapter)
.setRecyclerView(recyclerView)
// .immersion()
.togo();
使用 模式2
在内容itemView中选取悬浮 头部;下面这种效果
效果1.gifpublic class StickySigleTwoAdapter extends StickyAnyAdapter {
public StickySigleTwoAdapter(Context context, RecyclerView.Adapter mAdapter) {
super(context, mAdapter);
}
@Override
public boolean isHeader(int position) { //选取悬浮item
if (position == 0 || position == 8 || position == 14|| position == 20 || position == 28|| position == 32) {
return true;
} else
return false;
}
}
activity
stickyTestAdapter = new StickySigleTwoAdapter(this, adapter);
recyclerView.setAdapter(stickyTestAdapter);
StickyControl.any()
.adapter(stickyTestAdapter)
.setRecyclerView(recyclerView)
// .immersion()
.togo();
使用模式3
将布局放入 StickyNestedScrollView 中 ,并将 需要黏贴的头部的view 设置 tag属性为 "sticky" "-nonconstant" "-hastransparency"中的任意属性
<com.wenld.multitypeadapter.sticky.StickyNestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<VewGroup>
<view sticky:tag="sticky"
...
</view>
<view sticky:tag="-nonconstant"
...
</view>
</VewGroup>
</com.wenld.multitypeadapter.sticky.StickyNestedScrollView>
使用 类型4
添加自顶布局作为头部,
添加分组
1、 自定义一个 StickyAdapter
在这里你可以设置 header 布局,header的位置
public class StickySigleTwoAdapter extends StickyAdapter {
public StickySigleTwoAdapter(Context context, RecyclerView.Adapter mAdapter) {
super(context, mAdapter);
}
@Override
public boolean isHeader(int position) {
if (position == 0 || position == 8 || position == 14|| position == 20 || position == 28|| position == 32) {
return true;
} else
return false;
}
@Override
public void onBindHeaderViewHolder(final ViewHolder viewholder, final int position) {
}
@Override
protected int getLayoutId() {
return R.layout.header_two;
}
}
2、在activity中设置
//将 adapter 包裹进 StickyAdapter
// setAdapter
//配置生效
stickyTestAdapter = new StickySigleTwoAdapter(this, adapter);
recyclerView.setAdapter(stickyTestAdapter);
StickyControl.single() // 设置单个
.adapter(stickyTestAdapter) //
.setRecyclerView(recyclerView)
.immersion() // 是否嵌入
.togo();
三种方式优缺点:
模式 | recyclerView | anyView | 优点 | 不足 | 使用场景 |
---|---|---|---|---|---|
mode 1 | ✔ | ✘ | 准确黏贴头部,支持glide等图片加载框架 | 开启复用 位置会变化 | 大数据量时,使用 LinearLayoutManager时 。比如说通讯录头部 |
mode 2 | ✔ | ✘ | 准确黏贴头部 | 不支持glide等图片加载框架 | ,头部图片是取本地(非gilde等图片加载) |
mode 3 | ✔ | ✔ | 支持任意view,准确黏贴头部 | 不支持recyclerView复用,不支持黏贴布局根布局是ImageView时使用glide等加载框架 | 小数据量,平常布局 |
mode 2 | ✔ | ✘ | 准确黏贴头部,准确黏贴头部 | 不支持recyclerView复用,否则失效 | 这个厉害了,布局头部大小不做限定的时候 |
希望我的文章不会误导在观看的你,如果有异议的地方欢迎讨论和指正。
如果能给观看的你带来收获,那就是最好不过了。