Android进阶之路 - 5分钟内快速实现下拉刷新与上拉加载的SmartRefreshLayout

本文介绍如何在Android应用中实现下拉刷新与上拉加载更多功能,使用SmartRefreshLayout库简化开发流程,并提供三种不同效果的实现方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Android内下拉,上拉,再加上列表,这样的搭配几乎没有一个app不用的,在平常开发中下拉最好实现,因为5.0有SwipeRefreshLayout,分分秒秒搞定,但是上拉加载更多,有时候相对麻烦。而我又是一个懒人…为了让自己空出一点时间睡觉,所以需要尽快掌握本文知识 ~

本文为博友:”树朾“的切割版,目标是只为满足基本需求,如果说需要切换自己的headLayout与FootLayout或者更详细的使用,可跳转 此处 ~

原作者的GIthub地址

Effect - 1:
默认效果

Effect - 2:
Application重写方法

Effect - 3 :
gif效果
bulid:

 compile 'com.scwang.smartrefresh:SmartRefreshLayout:1.0.3'
 compile 'com.android.support:recyclerview-v7:24.0.0'
 //如果头部有需要加载gif的话,需要导入下面的这个依赖
 compile 'pl.droidsonroids.gif:android-gif-drawable:1.2.3'

Effect - 1实现方式:

导入成功之后,在Xml中引用“SmartRefreshLayout”,SmartRefreshLayout原作者默认展示的方式就是贝塞尔雷达动画,所以我们直接使用就可以达成我们的Effect - 1效果,具体代码如下。

MainActivity

package com.bakheet.car.smartrefresh;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import com.scwang.smartrefresh.layout.SmartRefreshLayout;
import com.scwang.smartrefresh.layout.api.RefreshLayout;
import com.scwang.smartrefresh.layout.listener.OnRefreshListener;
import com.scwang.smartrefresh.layout.listener.OnRefreshLoadmoreListener;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    private RecyclerView mRv;
    private SmartRefreshLayout mRefresh;
    private LayoutAdapter adapter;
    private List lists;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //先存入数据
        initData();
        
        mRv = (RecyclerView) findViewById(R.id.recyclerview);
        mRefresh = (SmartRefreshLayout) findViewById(R.id.refreshLayout);
        mRv.setLayoutManager(new LinearLayoutManager(this));
        adapter = new LayoutAdapter();
        mRv.setAdapter(adapter);
        
        //下拉刷新的监听
        mRefresh.setOnRefreshListener(new OnRefreshListener() {
            @Override
            public void onRefresh(RefreshLayout refreshlayout) {
                lists.add(" start ");

                adapter.notifyDataSetChanged();
                mRefresh.finishRefresh(2000);
            }
        });

        //上拉加载更多的监听
        mRefresh.setOnLoadmoreListener(new OnRefreshLoadmoreListener() {
            @Override
            public void onLoadmore(RefreshLayout refreshlayout) {
                lists.add(" end ");

                adapter.notifyDataSetChanged();
                mRefresh.finishLoadmore(2000);
            }

            @Override
            public void onRefresh(RefreshLayout refreshlayout) {

            }
        });
    }

    private void initData() {
        lists = new ArrayList();
        for (int i = 0; i < 30; i++) {
            lists.add("Please go " + i);
        }
    }

    class LayoutAdapter extends RecyclerView.Adapter<LayoutAdapter.myViewholder> {

        @Override
        public LayoutAdapter.myViewholder onCreateViewHolder(ViewGroup parent, int viewType) {
            myViewholder myViewholder = new myViewholder(LayoutInflater.from(MainActivity.this).inflate(R.layout.item_layout, parent, false));
            return myViewholder;
        }

        @Override
        public void onBindViewHolder(LayoutAdapter.myViewholder holder, final int position) {
            holder.mItemData.setText(lists.get(position) + "");
        }

        @Override
        public int getItemCount() {
            return lists == null ? 0 : lists.size();
        }

        class myViewholder extends RecyclerView.ViewHolder {

            public TextView mItemData;
            public myViewholder(View itemView) {
                super(itemView);
                mItemData = (TextView) itemView.findViewById(R.id.item_layout);
            }
        }
    }
}

MainActivity Xml

<?xml version="1.0" encoding="utf-8"?>
<com.scwang.smartrefresh.layout.SmartRefreshLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/refreshLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:overScrollMode="never"
        android:background="#fff" />
</com.scwang.smartrefresh.layout.SmartRefreshLayout>

公共的 item_layout 样式

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/item_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
</LinearLayout>
Effect - 2 实现方式(可自行设置喜欢的背景颜色)

这是我们很常见的一种刷新方式,简单清新;每个App一般都会有自己的Application(如果你没有?那就创建一个,且继承Application),之后在其中加入以下代码:

 static {
 		//static 代码段可以防止内存泄露
        //设置全局的Header构建器
        SmartRefreshLayout.setDefaultRefreshHeaderCreater(new DefaultRefreshHeaderCreater() {
            @Override
            public RefreshHeader createRefreshHeader(Context context, RefreshLayout layout) {
                layout.setPrimaryColorsId(R.color.colorAccent, android.R.color.white);//全局设置主题颜色
                return new ClassicsHeader(context).setSpinnerStyle(SpinnerStyle.Translate);//指定为经典Header,默认是 贝塞尔雷达Header
            }
        });
        //设置全局的Footer构建器
        SmartRefreshLayout.setDefaultRefreshFooterCreater(new DefaultRefreshFooterCreater() {
            @Override
            public RefreshFooter createRefreshFooter(Context context, RefreshLayout layout) {
                //指定为经典Footer,默认是 BallPulseFooter
                return new ClassicsFooter(context).setSpinnerStyle(SpinnerStyle.Translate);
            }
        });
    }

如我创建的Appication:

package com.bakheet.car.smartrefresh;

import android.app.Application;
import android.content.Context;
import com.scwang.smartrefresh.layout.SmartRefreshLayout;
import com.scwang.smartrefresh.layout.api.DefaultRefreshFooterCreater;
import com.scwang.smartrefresh.layout.api.DefaultRefreshHeaderCreater;
import com.scwang.smartrefresh.layout.api.RefreshFooter;
import com.scwang.smartrefresh.layout.api.RefreshHeader;
import com.scwang.smartrefresh.layout.api.RefreshLayout;
import com.scwang.smartrefresh.layout.constant.SpinnerStyle;
import com.scwang.smartrefresh.layout.footer.ClassicsFooter;
import com.scwang.smartrefresh.layout.header.ClassicsHeader;

/**
 * Created by YongLiu on 2017/8/10.
 */

public class App extends Application {
    static {//static 代码段可以防止内存泄露
        //设置全局的Header构建器
        SmartRefreshLayout.setDefaultRefreshHeaderCreater(new DefaultRefreshHeaderCreater() {
            @Override
            public RefreshHeader createRefreshHeader(Context context, RefreshLayout layout) {
                layout.setPrimaryColorsId(R.color.colorAccent, android.R.color.white);//全局设置主题颜色
                return new ClassicsHeader(context).setSpinnerStyle(SpinnerStyle.Translate);//指定为经典Header,默认是 贝塞尔雷达Header
            }
        });
        //设置全局的Footer构建器
        SmartRefreshLayout.setDefaultRefreshFooterCreater(new DefaultRefreshFooterCreater() {
            @Override
            public RefreshFooter createRefreshFooter(Context context, RefreshLayout layout) {
                //指定为经典Footer,默认是 BallPulseFooter
                return new ClassicsFooter(context).setSpinnerStyle(SpinnerStyle.Translate);
            }
        });
    }
}
Effect - 3实现方式

gif图地址,可以下载一张gif图用于使用此项效果

下载好之后扔在mipmap文件夹下,之后在布局中引用,这里我们改变的之后对应的Xml。

加入的Xml:

   <pl.droidsonroids.gif.GifImageView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="centerCrop"
    android:src="@mipmap/gif_fly"
    />

MainActivity Xml :

<?xml version="1.0" encoding="utf-8"?>
<com.scwang.smartrefresh.layout.SmartRefreshLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/refreshLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <pl.droidsonroids.gif.GifImageView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="centerCrop"
    android:src="@mipmap/gif_fly"
    />
    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:overScrollMode="never"
        android:background="#fff" />
</com.scwang.smartrefresh.layout.SmartRefreshLayout>

部分时候我们觉得Head部位与Foot部位太大,可以使用框架内自带的俩个类在xml中实现自己的期望效果,如下代码:

 <com.scwang.smartrefresh.layout.SmartRefreshLayout
        android:id="@+id/sl_refresh_question"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.scwang.smartrefresh.layout.header.ClassicsHeader
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:background="#6666"
            app:srlTextSizeTime="3sp"
            app:srlTextSizeTitle="5sp">
            
        </com.scwang.smartrefresh.layout.header.ClassicsHeader>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/rv_home_data"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <com.scwang.smartrefresh.layout.footer.ClassicsFooter
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:background="#6666"
            app:srlTextSizeTime="3sp"
            app:srlTextSizeTitle="5sp">

        </com.scwang.smartrefresh.layout.footer.ClassicsFooter>
    </com.scwang.smartrefresh.layout.SmartRefreshLayout>
重要方法(当然可以通过三方代码查看)

扩展学习 - 传送门

属性 Attributes

名称-name格式-format描述-description
srlPrimaryColorcolor主题颜色
srlAccentColorcolor强调颜色
srlReboundDurationinteger释放后回弹动画时长
srlHeaderHeightdimensionHeader的标准高度
srlFooterHeightdimensionFooter的标准高度
srlDragRatefloat显示拖动高度/真实拖动高度(默认0.5,阻尼效果)
srlHeaderMaxDragRatefloatHeader最大拖动高度/Header标准高度(默认2,要求>=1)
srlFooterMaxDragRatefloatFooter最大拖动高度/Header标准高度(默认2,要求>=1)
srlEnableRefreshboolean是否开启下拉刷新功能(默认true)
srlEnableLoadmoreboolean是否开启加上拉加载功能(默认true)
srlEnableHeaderTranslationContentboolean拖动Header的时候是否同时拖动内容(默认true)
srlEnableFooterTranslationContentboolean拖动Footer的时候是否同时拖动内容(默认true)
srlEnablePreviewInEditModeboolean是否在编辑模式时显示预览效果(默认true)
srlDisableContentWhenRefreshboolean是否在刷新的时候禁止内容的一切手势操作(默认false)
srlDisableContentWhenLoadingboolean是否在加载的时候禁止内容的一切手势操作(默认false)

方法 Method

名称-name	格式-format	描述-description
setPrimaryColors	colors	主题\强调颜色
setPrimaryColorsId	colors	主题\强调颜色资源Id
setReboundDuration	integer	释放后回弹动画时长
setHeaderHeight	dimension	Header的标准高度(px/dp 两个版本)
setFooterHeight	dimension	Footer的标准高度(px/dp 两个版本)
setDragRate	float	显示拖动高度/真实拖动高度(默认0.5,阻尼效果)
setHeaderMaxDragRate	float	Header最大拖动高度/Header标准高度(默认2,要求>=1)
setFooterMaxDragRate	float	Footer最大拖动高度/Footer标准高度(默认2,要求>=1)
setEnableRefresh	boolean	是否开启下拉刷新功能(默认true)
setEnableLoadmore	boolean	是否开启加上拉加载功能(默认true)
setEnableHeaderTranslationContent	boolean	拖动Header的时候是否同时拖动内容(默认true)
setEnableFooterTranslationContent	boolean	拖动Footer的时候是否同时拖动内容(默认true)
setEnableAutoLoadmore	boolean	是否监听列表滚动到底部时触发加载事件
setDisableContentWhenRefresh	boolean	是否在刷新的时候禁止内容的一切手势操作(默认false)
setDisableContentWhenLoading	boolean	是否在加载的时候禁止内容的一切手势操作(默认false)
setReboundInterpolator	Interpolator	设置回弹动画的插值器
setRefreshHeader	RefreshHeader	设置指定的Header
setRefreshFooter	RefreshFooter	设置指定的Footer
setOnRefreshListener	OnRefreshListener	设置刷新监听器
setOnLoadmoreListener	OnLoadmoreListener	设置加载监听器
setOnRefreshLoadmoreListener	OnRefreshLoadmoreListener	同时设置上面两个监听器
setOnMultiPurposeListener	OnMultiPurposeListener	设置多功能监听器
setLoadmoreFinished	boolean	设置全部数据加载完成,之后不会触发加载事件
finishRefresh	(int delayed)	完成刷新,结束刷新动画
finishLoadmore	(int delayed)	完成加载,结束加载动画
getRefreshHeader	RefreshHeader	获取Header
getRefreshFooter	RefreshFooter	获取Footer
getState	RefreshState	获取当前状态
isRefreshing	boolean	是否正在刷新
isLoading	boolean	是否正在加载
autoRefresh	(int delayed)	触发自动刷新
autoLoadmore	(int delayed)	触发自动加载
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

远方那座山

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值