1. 程式人生 > >Android RecyclerView (十)元件化封裝

Android RecyclerView (十)元件化封裝

pullrefreshrecyclerylib 開發文件



GitHub專案地址 點選檢視詳情


  • 下拉重新整理
  • 上拉載入更多
  • 多佈局模式適配
  • 載入中狀態
  • 載入無資料狀態

1 工程新增依賴

使用前先去GitHub下載依賴庫下載

然後再向工程中新增依賴

compile project(':pullrefreshrecyclerylib')
2 初始化基本使用

效果樣式 一 無上拉載入更多 也無下拉重新整理功能



效果樣式 二 有上拉載入更多 有下拉重新整理功能



效果樣式 三 無上拉載入更多 有下拉重新整理功能




效果樣式 四 有上拉載入更多 無下拉重新整理功能

2.1 建立RecyclerView並設定資料

        //初始化
        pullRecyclerViewUtils = PullRecyclerViewUtils.getInstance();

        //1條目佈局ID
        int itemLayoutId = R.layout.item_comm_base_layout;
        //2資料集合
        final List<DataModel> list = new ArrayList<>();

        //3初始化Recyclerview
/** * 引數一 this Context例項 * 引數二 單一佈局模式條目佈局ID * 引數三 資料集合 * 引數四 回撥監聽 */ RelativeLayout relativeLayout = pullRecyclerViewUtils.setRecyclerViewFunction(this, itemLayoutId, list, mPullRecclerLinserner); //4相關設定 //---- //設定RecyclerView的模式
/** * * @param statue NORMAL,//正常狀態下,沒有下拉重新整理也沒有上拉載入更多 * PULL_REFRESH,//只有下拉重新整理功能 * UP_LOAD_MORE,//只有上拉載入更多功能 * PULL_AND_UP//下拉重新整理 上拉載入功能 * @see PullRecyclerViewUtils.RECYCLRYVIEW_STATUE */ switch (pageType) { case 1: //下拉重新整理和上拉載入更多模式 pullRecyclerViewUtils.setRecyclerviewStatue(PullRecyclerViewUtils.RECYCLRYVIEW_STATUE.PULL_AND_UP); break; case 2: //無下拉重新整理 也無上拉載入更多 pullRecyclerViewUtils.setRecyclerviewStatue(PullRecyclerViewUtils.RECYCLRYVIEW_STATUE.NORMAL); break; case 3: //無下拉重新整理 只有上拉載入更多 pullRecyclerViewUtils.setRecyclerviewStatue(PullRecyclerViewUtils.RECYCLRYVIEW_STATUE.UP_LOAD_MORE); break; case 4: //下拉重新整理 無上拉載入更多 pullRecyclerViewUtils.setRecyclerviewStatue(PullRecyclerViewUtils.RECYCLRYVIEW_STATUE.PULL_REFRESH); break; default: //下拉重新整理和上拉載入更多模式 pullRecyclerViewUtils.setRecyclerviewStatue(PullRecyclerViewUtils.RECYCLRYVIEW_STATUE.PULL_AND_UP); break; } //---- //5將recyclerview新增到當前顯示的頁面中 maintContentLinearLayyout.addView(relativeLayout); //模擬網路 new Handler(getMainLooper()).postDelayed(new Runnable() { @Override public void run() { List<DataModel> list = new ArrayList<>(); for (int i = 0; i < 4; i++) { DataModel dataModel = new DataModel(); dataModel.name = "小燕子的情懷" + i; list.add(dataModel); } //更新資料 //這裡需要注意的是 每次設定的資料集合都是一個新的List物件 pullRecyclerViewUtils.setLoadingDataList(list); } }, 3000);
2.2 回撥監聽

    /**
     * RecyclerView相關操作的回撥
     */
    private PullRecyclerViewLinserner mPullRecclerLinserner = new

            PullRecyclerViewLinserner() {
                //當觸發上拉載入更多時,回撥此方法
                @Override
                public void loadMoreData() {
                    //模擬網路請求
                    new Handler(getMainLooper()).postDelayed(new Runnable() {
                        @Override
                        public void run() {
                            //請求成功的資料集合
                            List<DataModel> list = new ArrayList<>();
                            for (int i = 0; i < 16; i++) {
                                DataModel dataModel = new DataModel();
                                dataModel.name = "小燕子的情懷" + i;
                                list.add(dataModel);
                            }
                            //更新資料
                            //這裡的資料集合為新的list物件就可以
                            //內部自動處理了資料的延續新增重新整理
                            pullRecyclerViewUtils.setLoadingDataList(list);
                        }
                    }, 3000);
                }

                //當觸發下拉重新整理資料時會回撥此方法
                @Override
                public void loadingRefresDataFunction() {
                    //模擬網路請求
                    new Handler(getMainLooper()).postDelayed(new Runnable() {
                        @Override
                        public void run() {
                            //請求成功的資料集合
                            List<DataModel> list = new ArrayList<>();
                            for (int i = 0; i < 16; i++) {
                                DataModel dataModel = new DataModel();
                                dataModel.name = "小燕子的情懷" + i;
                                list.add(dataModel);
                            }
                            //這裡的資料集合為新的list物件就可以
                            //內部自動處理了資料的清空更新
                            pullRecyclerViewUtils.setLoadingDataList(list);
                        }
                    }, 3000);
                }

                //設定資料回撥方法 

                /**
                 * 
                 * @param itemView  佈局條目對應的View
                 * @param position 當前條目位置
                 * @param itemType 當前的條目佈局型別
                 * @param object   資料模型
                 */
                @Override
                public void setViewDatas(View itemView, int position, int itemType, Object object) {

                    //對就的模型資料
                    DataModel dataModel = (DataModel) object;

                    //設定資料
                    TextView nameTextView = itemView.findViewById(R.id.tv_item_name);
                    nameTextView.setText(dataModel.name);
                }
            };

3 設定多佈局樣式

效果樣式(例如這裡設定了三種Item的樣式)

3.1 初始化設定 (與2中描述的基本一至)

在這裡需要注意的是 ,初始化操作Recyclerview方式與2中描述的基本一至,重要的是在為RecyclerView設定資料的時候,要構造多佈局樣式資料模型PullRecyclerMoreStatueModel

/**
 * Created by androidlongs on 2017/8/21.
 * 站在頂峰,看世界
 * 落在谷底,思人生
 */

public class PullRecyclerMoreStatueModel implements Serializable {
    //資料模型 
    public Object model;
    //佈局型別
    public int itemType=-1;
    //佈局ID
    public int itemLayoutId=-1;
}

        //當前頁面 要顯示列表資料的父佈局
        LinearLayout maintContentLinearLayyout = findViewById(R.id.ll_content);


        //1初始化
        pullRecyclerViewUtils = PullRecyclerViewUtils.getInstance();

        //2資料集合
        final List<PullRecyclerMoreStatueModel> list = new ArrayList<>();

        //3初始化Recyclerview
        /**
         * 引數一 this Context例項
         * 引數二 單一佈局模式條目佈局ID 多佈局模式下可以傳-1
         * 引數三 資料集合
         * 引數四 回撥監聽
         */
        RelativeLayout relativeLayout = pullRecyclerViewUtils.setRecyclerViewFunction(this, -1, list, mPullRecclerLinserner);

        //4相關設定
        //----
        //設定RecyclerView的模式
        /**
         *
         * @param statue NORMAL,//正常狀態下,沒有下拉重新整理也沒有上拉載入更多
         *               PULL_REFRESH,//只有下拉重新整理功能
         *               UP_LOAD_MORE,//只有上拉載入更多功能
         *               PULL_AND_UP//下拉重新整理 上拉載入功能
         * @see PullRecyclerViewUtils.RECYCLRYVIEW_STATUE
         */
        //下拉重新整理和上拉載入更多模式
        pullRecyclerViewUtils.setRecyclerviewStatue(PullRecyclerViewUtils.RECYCLRYVIEW_STATUE.PULL_AND_UP);


        //----
        //5將recyclerview新增到當前顯示的頁面中
        maintContentLinearLayyout.addView(relativeLayout);


        //模擬網路
        new Handler(getMainLooper()).postDelayed(new Runnable() {
            @Override
            public void run() {

                /**
                 * 多而佈局樣式下 需要使用 PullRecyclerMoreStatueModel 資料模型 將資料和其對應的佈局樣式封裝
                 */
                List<PullRecyclerMoreStatueModel> list = new ArrayList<>();

                for (int i = 0; i < 14; i++) {
                    //網路請求的使用者資料
                    DataModel dataModel = new DataModel();
                    dataModel.name = "小燕子的情懷" + i;

                    //構造多佈局樣式與資料模式
                    PullRecyclerMoreStatueModel moreStatueModel = new PullRecyclerMoreStatueModel();

                    moreStatueModel.model = dataModel;

                    if (i % 3 == 0) {
                        //第一種佈局樣式

                        moreStatueModel.itemLayoutId = R.layout.item_comm_base_layout;
                        moreStatueModel.itemType = 1;
                    } else if (i % 3 == 1) {
                        //第二種佈局樣式
                        moreStatueModel.itemLayoutId = R.layout.item_comm_base_2_layout;
                        moreStatueModel.itemType = 2;
                    } else {
                        //第三種佈局樣式
                        moreStatueModel.itemLayoutId = R.layout.item_comm_base_3_layout;
                        moreStatueModel.itemType = 3;
                    }

                    list.add(moreStatueModel);
                }
                //更新資料
                //這裡需要注意的是 每次設定的資料集合都是一個新的List物件
                pullRecyclerViewUtils.setLoadingDataList(list);
            }
        }, 2000);

對應的回撥設定資料中

private PullRecyclerViewLinserner mPullRecclerLinserner = new

            PullRecyclerViewLinserner() {
                //當觸發上拉載入更多時,回撥此方法
                @Override
                public void loadMoreData() {

                }

                //當觸發下拉重新整理資料時會回撥此方法
                @Override
                public void loadingRefresDataFunction() {
                    //模擬網路請求

                }

                //設定資料回撥方法

                /**
                 *
                 * @param itemView  佈局條目對應的View
                 * @param position 當前條目位置
                 * @param itemType 當前的條目佈局型別
                 * @param object   資料模型
                 */
                @Override
                public void setViewDatas(View itemView, int position, int itemType, Object object) {


                    //多佈局模式下  object對應的資料型別是 PullRecyclerMoreStatueModel
                    PullRecyclerMoreStatueModel pullRecyclerMoreStatueModel = (PullRecyclerMoreStatueModel) object;
                    //獲取對應的資料型別或者說是條目佈局樣式
                    itemType = pullRecyclerMoreStatueModel.itemType;

                    //根據itemType來獲取對應的資料 與 設定對應的資料顯示
                    if (itemType == 1) {
                        //對應就的模型資料
                        DataModel dataModel = (DataModel) pullRecyclerMoreStatueModel.model;
                        //設定資料
                        TextView nameTextView = itemView.findViewById(R.id.tv_item_name);
                        nameTextView.setText(dataModel.name);
                    } else if (itemType == 2) {
                        //對應的模型資料
                        DataModel dataModel = (DataModel) pullRecyclerMoreStatueModel.model;
                        //設定資料
                        TextView nameTextView = itemView.findViewById(R.id.tv_item_name);
                        nameTextView.setText(dataModel.name);
                    } else {
                        //對應的模型資料
                        DataModel dataModel = (DataModel) pullRecyclerMoreStatueModel.model;
                        //設定資料
                        TextView nameTextView = itemView.findViewById(R.id.tv_item_name);
                        nameTextView.setText(dataModel.name);
                    }


                }
            };
4 設定多佈局樣式

效果樣式一(例如這裡設定了藍色的背景)


效果樣式二(例如這裡自定義了一個背景)

4.1 初始化設定 (與2中描述的基本一至)
4.2 設定重新整理背景(純色)
pullRecyclerViewUtils.setMainBackgroundRelativeLayoutColor(Color.BLUE);
4.3 設定重新整理背景 (自定義檢視)

在這裡提供了兩種設定方式

 //方式一 直接將自定義的背景樣式xml 的ID設定
 pullRecyclerViewUtils.addMainBackgroundChildLayout(R.layout.item_refresh_bg_layout);

 //方式二 設定一個構造 好的View 
   View view = View.inflate(this,R.layout.item_refresh_bg_layout,null);
   pullRecyclerViewUtils.addMainBackgroundChildLayout(view);
4.4 設定重新整理部位背景 (純色)

    //下拉重新整理部位的背景顏色 設定
    pullRecyclerViewUtils.setPullRefshBackGroundColor(Color.WHITE);
    //下拉重新整理部位的顯示文字的顏色
    pullRecyclerViewUtils.setPullRefshTextColorFunction(Color.BLUE);

5 設定下拉重新整理部分的樣式
   /**
     * @param statue PB_AND_TV,//顯示 載入進度顯示文字
     *               IV_AND_TV,//顯示圖片 載入進度顯示文字
     *               PB,//只顯示載入進度圈
     *               TV,//只顯示載入文字
     *               IV//只顯示載入圖片
     * @see PULLREFSH_SHOW_VIEW_STATUE
     */
5.1 樣式一 顯示重新整理圓形進度與文字
    //下拉重新整理部位的背景顏色 設定
    pullRecyclerViewUtils.setPullRefshBackGroundColor(Color.WHITE);
    //下拉重新整理部位的顯示文字的顏色
    pullRecyclerViewUtils.setPullRefshTextColorFunction(Color.BLUE);
    //設定下拉重新整理樣式型別
    pullRecyclerViewUtils.setPullRefshStatue(PullRecyclerViewUtils.PULLREFSH_SHOW_VIEW_STATUE.PB_AND_TV);

5.2 樣式二 只顯示重新整理文字
//設定下拉重新整理樣式型別
pullRecyclerViewUtils.setPullRefshStatue(PullRecyclerViewUtils.PULLREFSH_SHOW_VIEW_STATUE.TV);

5.3 樣式三 只顯示重新整理圓形進度
//設定下拉重新整理樣式型別
pullRecyclerViewUtils.setPullRefshStatue(PullRecyclerViewUtils.PULLREFSH_SHOW_VIEW_STATUE.PB);

5.4 樣式四 只顯示自定義圖片
//設定下拉重新整理顯示圖片
pullRecyclerViewUtils.setPullRefshImageFunction(this.getResources().getDrawable(R.drawable.home_table_topic_header));
//設定下拉重新整理樣式型別
pullRecyclerViewUtils.setPullRefshStatue(PullRecyclerViewUtils.PULLREFSH_SHOW_VIEW_STATUE.IV);

5.5 樣式五 只顯示自定義幀動畫
//設定下拉重新整理顯示 動畫檔案
pullRecyclerViewUtils.setPullRefshImageFunction(this.getResources().getDrawable(R.drawable.dra_pull_anim));
//設定下拉重新整理樣式型別
pullRecyclerViewUtils.setPullRefshStatue(PullRecyclerViewUtils.PULLREFSH_SHOW_VIEW_STATUE.IV);

5.6 樣式六 顯示自定義圖片和文字
//設定下拉重新整理顯示 動畫檔案
pullRecyclerViewUtils.setPullRefshImageFunction(this.getResources().getDrawable(R.drawable.dra_pull_anim));
//設定下拉重新整理樣式型別
pullRecyclerViewUtils.setPullRefshStatue(PullRecyclerViewUtils.PULLREFSH_SHOW_VIEW_STATUE.IV_AND_TV);


6 設定首次進入頁面後 無資料顯示的樣式
public enum SHOW_DEFAUTLE_PAGE_TYPE {
   NO_DATA,//無資料
   LOADING,//載入中
   NORMAL//列表資料頁面
}
6.1 顯示正在載入中的圓形進度與顯示文字
pullRecyclerViewUtils.setFirstDefaultPageType(PullRecyclerViewUtils.SHOW_DEFAUTLE_PAGE_TYPE.LOADING);

6.2 顯示暫無資料顯示文字
pullRecyclerViewUtils.setFirstDefaultPageType(PullRecyclerViewUtils.SHOW_DEFAUTLE_PAGE_TYPE.NO_DATA);

6.3 顯示空的列表頁面
pullRecyclerViewUtils.setFirstDefaultPageType(PullRecyclerViewUtils.SHOW_DEFAUTLE_PAGE_TYPE.NORMAL);