用RecyclerView的LayoutManager實現grid整頁翻頁效果

作者：HarveyLegend

連結：https://www.jianshu.com/p/9d578be5d6dc

專案中有這麼一個需求，收銀機的支付方式選擇頁：

需求具體分析：

每頁最多有12種支付方式。
1、支付方式不滿1頁，就將所有支付展示在第一頁。
2、支付方式超過12個，就將第一頁右下角的位置變為翻頁按鈕，將第二頁的左下角位置新增一個上一頁按鈕。超過兩頁以此類推。

程式碼實現：

佈局很簡單：外層是一個RecyclerView，item同樣是一個RecyclerView

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

java程式碼：

   PayWayPageAdapter payWayPageAdapter = new PayWayPageAdapter(getActivity(), assemblePayWays(), R.layout.XXX);
   payWayRecyclerView.setLayoutManager(layoutManager);
   payWayRecyclerView.setAdapter(payWayPageAdapter);

關鍵程式碼就是assemblePayWays()這個方法：

private List assemblePayWays() {
        int total = payWayEntities.size();
        //每個頁面的格子數
        int pageSize = 12;
        //找出一共需要幾頁
        for (int i = 1; i             if (i == 1 && 0                 page = 1;
                break;
            } else if ((pageSize - 2) * (i - 1) + 2 2) * i + 2) {
                page = i;
                break;
            }
        }
        //將上一頁 下一頁插入到合適的位置
        List preList = new ArrayList<>();
        for (int i = 0; i             if (i 1) * pageSize && (i + 1) % pageSize == 0) {
                preList.add(new PayWayEntity("下一頁"));
            } else if (i > pageSize && (i + 3) % pageSize == 0) {
                preList.add(new PayWayEntity("上一頁"));
            } else {
                preList.add(new PayWayEntity());
            }
        }
        int offset = 0;
        for (int i = 0; i             if ((i + offset > pageSize && (i + offset + 3) % pageSize == 0) || (i + offset 1) * pageSize && (i + offset + 1) % pageSize == 0))
                offset += 1;
            preList.set(i + offset, payWayEntities.get(i));
        }
        //封裝好資料
        List entities = new ArrayList<>();
        for (int i = 0; i             List temp;
            PayWayPageEntity entity = new PayWayPageEntity();
            temp = preList.subList(i * pageSize, (i + 1) * pageSize);
            entity.setPayWayLists(temp);
            entities.add(entity);
        }
        return entities;
    }

禁止外層的頁卡滑動需要重寫LayoutManager

public class CustomLinearLayoutManager extends LinearLayoutManager {
        //此處我直接設定為不允許滑動，需要時可以使用setScrollEnabled（）動態設定
        private boolean isScrollEnabled = false;


        public CustomLinearLayoutManager(Context context, int orientation) {
            super(context, orientation, false);
        }

        public void setScrollEnabled(boolean flag) {
            this.isScrollEnabled = flag;
        }

        @Override
        public boolean canScrollVertically() {
            //Similarly you can customize "canScrollHorizontally()" for managing horizontal scroll
            return isScrollEnabled && super.canScrollVertically();
        }

        @Override
        public boolean canScrollHorizontally() {
            return isScrollEnabled && super.canScrollHorizontally();
        }
    }

Adapter內部程式碼類似，只是根據不同的支付方式實現不同的點選事件而已：

 @Override
    public void convert(RecyclerViewViewHolder viewHolder, PayWayPageEntity payWayPageEntity) {
        RecyclerView rv = viewHolder.findViewById(R.id.rv);
        PayWayAdapter payWayAdapter = new PayWayAdapter(mContext, payWayPageEntity.getPayWayLists(), R.layout.pay_way_item);
        rv.setLayoutManager(new CustomLayoutManager(mContext, 3));
        rv.setAdapter(payWayAdapter);

切換頁卡用下麵的方式實現

layoutManager.scrollToPositionWithOffset(currentPage, 0);

最終實現：