上拉加载下拉刷新---SmartRefreshLayout
2019-04-15 本文已影响26人
穿越平行宇宙
前言
上拉加载下拉刷新的控件大家该很熟悉了，今天介绍一款不错的上拉加载下拉刷新控件--------SmartRefreshLayout
参考链接：
SmartRefreshLayout官网
介绍
支持下拉刷新、上拉加载、RefreshLayout、OverScroll，Android智能下拉刷新框架，支持越界回弹，具有极强的扩展性，集成了几十种炫酷的Header和 Footer。
不只是如其它的刷新布局所说的支持所有的View，还支持多层嵌套的视图结构。 除了“聪明”之外，SmartRefreshLayout还具备了很多的特点。
它继承自ViewGroup 而不是其它的FrameLayout或者LinearLayout，提高了性能。
1、支持所有的 View（AbsListView、RecyclerView、WebView....View） 和多层嵌套的视图结构
2、支持自定义并且已经集成了很多炫酷的 Header 和 Footer （图）.
3、支持和ListView的同步滚动 和 RecyclerView、AppBarLayout、CoordinatorLayout 的嵌套滚动 NestedScrolling.
4、支持在Android Studio Xml 编辑器中预览 效果（图）
5、支持分别在 Default（默认）、Xml、JavaCode 三个中设置 Header 和 Footer.
6、支持自动刷新、自动上拉加载（自动检测列表惯性滚动到底部，而不用手动上拉）.
7、支持通用的刷新监听器 OnRefreshListener 和更详细的滚动监听 OnMultiPurposeListener.
8、支持自定义回弹动画的插值器，实现各种炫酷的动画效果.
9、支持设置主题来适配任何场景的App，不会出现炫酷但很尴尬的情况.
10、支持设置多种滑动方式来适配各种效果的Header和Footer：平移、拉伸、背后固定、顶层固定、全屏
11、支持内容尺寸自适应 Content-wrap_content
12、支持继承重写和扩展功能，内部实现没有 private 方法和字段，继承之后都可以重写覆盖
13、支持越界回弹（Listview、RecyclerView、ScrollView、WebView...View）
14、支持多点触摸，下拉、上拉各种手势冲突
- 一、导入依赖
在app-module中添加RecycleView和SmartRefreshLayout的依赖
//recyclerview
implementation 'com.android.support:recyclerview-v7:26.1.0'
implementation 'com.android.support:design:26.1.0'
//SmartRefreshLayout
implementation 'com.scwang.smartrefresh:SmartRefreshLayout:1.0.4-7'
implementation 'com.scwang.smartrefresh:SmartRefreshHeader:1.0.4-7'
- 二、在mainActivity中添加xml布局
<?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"
tools:context="com.freshdemo.MainActivity"
android:orientation="vertical">
<com.scwang.smartrefresh.layout.SmartRefreshLayout
android:id="@+id/refreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srlAccentColor="#00000000"
app:srlPrimaryColor="#00000000"
app:srlEnablePreviewInEditMode="true">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</com.scwang.smartrefresh.layout.SmartRefreshLayout>
</LinearLayout>
这是SmartRefreshLayout的基本布局，其中：
app:srlAccentColor="#00000000"//设置Header主题颜色
app:srlPrimaryColor="#00000000"//设置Footer主题颜色
app:srlEnablePreviewInEditMode="true"//开启和关闭预览功能
- 三、MainActivity中初始化和刷新加载事件
private RecyclerView mRecyclerView;
private RefreshLayout mRefreshLayout;
//初始化
mRecyclerView=findViewById(R.id.rv);
mRefreshLayout = findViewById(R.id.refreshLayout);
//刷新
mRefreshLayout.setOnRefreshListener(new OnRefreshListener() {
@Override
public void onRefresh(RefreshLayout refreshlayout) {
mData.clear();
mNameAdapter.notifyDataSetChanged();
refreshlayout.finishRefresh();
}
});
//加载更多
mRefreshLayout.setOnLoadmoreListener(new OnLoadmoreListener() {
@Override
public void onLoadmore(RefreshLayout refreshlayout) {
for(int i=0;i<30;i++){
mData.add("小明"+i);
}
mNameAdapter.notifyDataSetChanged();
refreshlayout.finishLoadmore();
}
});
开启/关闭下拉刷新和加载更多，结束刷新和加载
开始下拉
mRefreshLayout.setEnableRefresh(true);//启用刷新
mRefreshLayout.setEnableLoadmore(true);//启用加载
关闭下拉
mRefreshLayout.finishRefresh();
mRefreshLayout.finishLoadmore();
- 四.运行效果
SmartRefreshLayout运行的默认效果如下
image.png
- 五.SmartRefreshLayout的其他的刷新样式
5.1经典样式ClassicsFooter
只需要在布局中添加对应的header和footer，则activity_main.xml代码如下：
<?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"
tools:context="com.freshdemo.MainActivity"
android:orientation="vertical">
<com.scwang.smartrefresh.layout.SmartRefreshLayout
android:id="@+id/refreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srlAccentColor="#00000000"
app:srlPrimaryColor="#00000000"
app:srlEnablePreviewInEditMode="true">
<com.scwang.smartrefresh.layout.header.ClassicsHeader
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<android.support.v7.widget.RecyclerView
android:id="@+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.scwang.smartrefresh.layout.footer.ClassicsFooter
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</com.scwang.smartrefresh.layout.SmartRefreshLayout>
</LinearLayout>
运行效果如下图：
image.png
5.2一个绚丽的PhoenixHeader展示
修改后activity_main.xml代码如下：
<?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"
tools:context="com.freshdemo.MainActivity"
android:orientation="vertical">
<com.scwang.smartrefresh.layout.SmartRefreshLayout
android:id="@+id/refreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srlAccentColor="#00000000"
app:srlPrimaryColor="#00000000"
app:srlEnablePreviewInEditMode="true">
<com.scwang.smartrefresh.header.PhoenixHeader
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<android.support.v7.widget.RecyclerView
android:id="@+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.scwang.smartrefresh.layout.footer.BallPulseFooter
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</com.scwang.smartrefresh.layout.SmartRefreshLayout>
</LinearLayout>
运行效果图：
image.png
5.3header，footer各样式类所引入包路径如下
SmartRefreshLayout可以引入好几种Header和Footer样式，其中footer固定样式有三种，在refresh-layout包下：
image
包路径分别为：
com.scwang.smartrefresh.layout.footer.BallPulseFooter
com.scwang.smartrefresh.layout.footer.ClassicsFooter
com.scwang.smartrefresh.layout.footer.FalsifyFooter
header样式则很多，在refresh-layout包下有：
image
包路径分别为：
com.scwang.smartrefresh.layout.header.BezierRadarHeader
com.scwang.smartrefresh.layout.header.ClassicsHeader
com.scwang.smartrefresh.layout.header.FalsifyHeader
在refresh-header包下有以下样式：
image
他们的包路径是：
com.scwang.smartrefresh.header.BezierCircleHeader
com.scwang.smartrefresh.header.DeliveryHeader
//以下类似,在此省略
//......
六.自定义Header和Footer
当然SmartRefreshLayout还支持自定义Header和Footer
具体可以参考官网中的自定义Header
SmartRefreshLayout关于属性这一块也是有很多可以设置的，大家依然可以去SmartRefreshLayout官网查看更多使用细则，这里就不展开讲解了
