上拉加载下拉刷新---SmartRefreshLayout
2018-01-08 本文已影响1423人
奔跑的佩恩
前言
上拉加载下拉刷新的控件大家该很熟悉了,今天介绍一款不错的上拉加载下拉刷新控件--------SmartRefreshLayout
参考链接:
SmartRefreshLayout官网
一.导入依赖
在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();
}
});
四.运行效果
SmartRefreshLayout运行的默认效果如下
1.gif
五.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>
运行效果如下图:
2.gif
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>
运行效果图:
3.gif
5.3header,footer各样式类所引入包路径如下
SmartRefreshLayout可以引入好几种Header和Footer样式,其中footer固定样式有三种,在refresh-layout包下:
image.png
包路径分别为:
com.scwang.smartrefresh.layout.footer.BallPulseFooter
com.scwang.smartrefresh.layout.footer.ClassicsFooter
com.scwang.smartrefresh.layout.footer.FalsifyFooter
header样式则很多,在refresh-layout包下有:
image.png
包路径分别为:
com.scwang.smartrefresh.layout.header.BezierRadarHeader
com.scwang.smartrefresh.layout.header.ClassicsHeader
com.scwang.smartrefresh.layout.header.FalsifyHeader
在refresh-header包下有以下样式:
image.png
他们的包路径是:
com.scwang.smartrefresh.header.BezierCircleHeader
com.scwang.smartrefresh.header.DeliveryHeader
//以下类似,在此省略
//......
六.自定义Header和Footer
当然SmartRefreshLayout还支持自定义Header和Footer
具体可以参考官网中的自定义Header
SmartRefreshLayout关于属性这一块也是有很多可以设置的,大家依然可以去SmartRefreshLayout官网查看更多使用细则,这里就不展开讲解了
今天就讲到这里了,谢谢大家。