简介

​SpringView​​ 是一个提供了上下拖拽的功能组件,能够进行高度自定义,实现各种下拉\上拉动画效果,demo里实现了:仿阿里旅行、仿美团,仿 QQ 下拉刷红包,仿 acfun 等,完全兼容源生控件如 RecyclerView、ScrollView、WebView 等,使用简单,轻易定制自己风格的拖拽页面。

  • 单独将头部/尾部独立出来,几乎可以实现任何你想要的效果,只需要继承BaseHeader(或Footer)实现接口;
  • 能在运行时动态地替换头部/尾部,只需要设置不同的头尾即可:springView.setHeader(MyHeader());
  • 提供了2种拖拽方式(重叠和跟随),可以动态地切换
  • 为不想去自定义头/尾的懒人提供了7种默认的实现(模仿了阿里,腾讯,美团等多种风格)
  • 支持和 AppBarLayout 联动。

效果图

【Android -- 开源库】SpringView 的基本使用_下拉刷新

使用

1. 添加依赖

//SpringView核心库 (只包含DefaultHeader/Footer)
implementation 'com.liaoinstan.springview:library:1.7.0'

//以下是各个风格的Header/Footer,选择自己喜欢的引入
implementation 'com.liaoinstan.springview:AcfunHeader:1.7.0' //AcFun风格 (header and footer)
implementation 'com.liaoinstan.springview:AliHeader:1.7.0' //阿里旅行风格 (header and footer)
implementation 'com.liaoinstan.springview:MeituanHeader:1.7.0' //美团风格 (header and footer)
implementation 'com.liaoinstan.springview:RotationHeader:1.7.0' //齿轮机械风格 (header and footer)
implementation 'com.liaoinstan.springview:WeixinHeader:1.7.0' //微信小程序header(只有header)
implementation 'com.liaoinstan.springview:DuHeader:1.7.0' //'毒'App header(只有header)

2. 布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context=".MainActivity">

<com.qmuiteam.qmui.widget.QMUITopBar
android:id="@+id/topbar"
android:layout_width="match_parent"
android:layout_height="60dp"
app:qmui_topbar_title_bold="true"
app:qmui_topbar_title_color="@color/white"
android:background="@color/app_color_theme_8"
tools:ignore="MissingConstraints" />

<com.liaoinstan.springview.widget.SpringView
android:id="@+id/springview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff">

<com.marshalchen.ultimaterecyclerview.UltimateRecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
app:recyclerviewClipToPadding="true"
app:recyclerviewDefaultSwipeColor="@array/google_colors"
app:recyclerviewFloatingActionView="@layout/floating_view"
app:recyclerviewScrollbars="vertical" />

</com.liaoinstan.springview.widget.SpringView>

</LinearLayout>

3. 逻辑代码

@BindView(R.id.recycler_view)
UltimateRecyclerView mRecyclerView;

@BindView(R.id.topbar)
QMUITopBar mTopBar;

@BindView(R.id.springview)
SpringView mSpringView;

//下拉过程动画
private int[] pullAnimSrcs = {R.mipmap.mt_pull, R.mipmap.mt_pull01, R.mipmap.mt_pull02,
R.mipmap.mt_pull03, R.mipmap.mt_pull04, R.mipmap.mt_pull05};
//刷新中动画
private int[] refreshAnimSrcs = {R.mipmap.mt_refreshing01, R.mipmap.mt_refreshing02,
R.mipmap.mt_refreshing03, R.mipmap.mt_refreshing04, R.mipmap.mt_refreshing05,
R.mipmap.mt_refreshing06};
//加载更多底部动画
private int[] loadingAnimSrcs = {R.mipmap.mt_loading01, R.mipmap.mt_loading02};

private void initView() {
...
mSpringView.setListener(new SpringView.OnFreshListener() {
@Override
public void onRefresh() {
new Handler().postDelayed(() -> mSpringView.onFinishFreshAndLoad(), 2000);
}

@Override
public void onLoadmore() {
new Handler().postDelayed(() -> mSpringView.onFinishFreshAndLoad(), 3000);
}
});

mSpringView.setHeader(new MeituanHeader(this, pullAnimSrcs, refreshAnimSrcs));
mSpringView.setFooter(new MeituanFooter(this, loadingAnimSrcs));
}

自定义 Header 或 Footer

1. 首先新建一个自定义头部布局;

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="@drawable/view_post_comment_bg"
android:layout_gravity="top">

<TextView
android:layout_width="120dp"
android:gravity="center"
android:layout_height="wrap_content"
android:text="this is TextView "
android:background="#ff0000"
android:textColor="#ffffff"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:id="@+id/textView" />
</RelativeLayout>
  1. 新建一个 MyHeader 继承自 BaseHeader
public class MyHeader extends BaseHeader{
private TextView textView;
private int i = 0;

//获取Header
@Override
public View getView(LayoutInflater inflater, ViewGroup viewGroup) {
View view = inflater.inflate(R.layout.header_my, viewGroup, true);
textView = (TextView)view.findViewById(R.id.textView);
return view;
}

//拖拽开始前回调
@Override
public void onPreDrag(View rootView) {}

//手指拖拽过程中不断回调,dy为拖拽的距离,可以根据拖动的距离添加拖动过程动画
@Override
public void onDropAnim(View rootView, int dy) {}

//手指拖拽过程中每次经过临界点时回调,upORdown是向上经过还是向下经过
@Override
public void onLimitDes(View rootView, boolean upORdown) {}

//拉动超过临界点后松开时回调
@Override
public void onStartAnim() {}

//头部已经全部弹回时回调
@Override
public void onFinishAnim() {}
}
  1. 在 Activity 中为 SpringView 设置我们自定义的 MyHeader 就可以了。
springView = (SpringView) findViewById(R.id.springview);
springView.setHeader(new MyHeader());

springView.setListener(new SpringView.OnFreshListener() {
@Override
public void onRefresh() {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
springView.onFinishFreshAndLoad();
}
}, 1000);
}
@Override
public void onLoadmore() {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
springView.onFinishFreshAndLoad();
}
}, 1000);
}
});