Android安卓开发Android 开发收集

上拉加载下拉刷新---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官网查看更多使用细则,这里就不展开讲解了

今天就讲到这里了,谢谢大家。

上一篇下一篇

猜你喜欢

热点阅读