MaterialDesign-RecyleView探究及使用【二】-分割線添加

概述：

當我們準備爲RecyclerView添加分割線時，你會發現RecyclerView並沒有支持divider這樣的屬性。想想辦法，你可以給Item的佈局去設置margin，當然了這種方式不夠優雅，我們可以自由的去定製它。

繪製橫向或縱向列表分割線：

RecyclerView.ItemDecoration是一個抽象類，就是用來裝飾RecyclerView的子item的，通過名字就可以知道，功能並不僅僅是添加間距繪製分割線，是用來裝飾item的。

這個類包含三個方法 ：
1、getItemOffsets(Rect outRect, View view, RecyclerView parent, State state)//設置四邊邊距
2、onDraw(Canvas c, RecyclerView parent, State state)//繪製裝飾
3、onDrawOver(Canvas c, RecyclerView parent, State state)//繪製蒙層

1、getItemOffsets(Rect outRect, View view, RecyclerView parent, State state)方法：

該方法中有4個參數：
1、Rect outRect： outRect 設置的4個方向的值，將被計算進所有 decoration 的尺寸中，而這個尺寸，被用來計算 RecyclerView 每個 item view 的padding間距大小。
2、View view: childView，就是item，可以理解爲item的根View，並不是item中的控件
3、RecyclerView parent：就是RecyclerView自身
4、RecyclerView.State state ： RecyclerView的狀態
代碼實現：

//獲取分割線尺寸
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
    super.getItemOffsets(outRect, view, parent, state);
    outRect.set(0, 0, 0, mDividerHeight);
}

2、onDraw(Canvas c, RecyclerView parent, RecyclerView.State state)方法：

onDraw用於繪製divider，繪製到每一個item的下一層，也就是說item會蓋在divider所在層的上面
onDraw()方法可以爲divier設置繪製範圍，並且繪製範圍可以超出在 getItemOffsets中設置的範圍，但由於是在item下面一層進行繪製，會存在overdraw

代碼實現：

//繪製分割線
@Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
    super.onDraw(c, parent, state);
    if (mOrientation == LinearLayoutManager.VERTICAL) {
        drawVertical(c, parent);
    } else {
        drawHorizontal(c, parent);
    }
}
//繪製橫向 item 分割線
private void drawHorizontal(Canvas canvas, RecyclerView parent) {
    final int left = parent.getPaddingLeft();
    final int right = parent.getMeasuredWidth() - parent.getPaddingRight();
    final int childSize = parent.getChildCount();
    for (int i = 0; i < childSize; i++) {
        final View child = parent.getChildAt(i);
        RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child.getLayoutParams();
        final int top = child.getBottom() + layoutParams.bottomMargin;
        final int bottom = top + mDividerHeight;
        if (mDivider != null) {
            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(canvas);
        }
        if (mPaint != null) {
            canvas.drawRect(left, top, right, bottom, mPaint);
        }
    }
}
//繪製縱向 item 分割線
private void drawVertical(Canvas canvas, RecyclerView parent) {
    final int top = parent.getPaddingTop();
    final int bottom = parent.getMeasuredHeight() - parent.getPaddingBottom();
    final int childSize = parent.getChildCount();
    for (int i = 0; i < childSize; i++) {
        final View child = parent.getChildAt(i);
        RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child.getLayoutParams();
        final int left = child.getRight() + layoutParams.rightMargin;
        final int right = left + mDividerHeight;
        if (mDivider != null) {
            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(canvas);
        }
        if (mPaint != null) {
            canvas.drawRect(left, top, right, bottom, mPaint);
        }
    }
}

3、onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state)方法：

這個方法是在item的onDraw()方法之後進行回調，也就繪製在了最上層
由於 onDrawOver 是繪製在最上層的，所以它的繪製位置並不受限制，
只要手指在RecyclerView上進行滑動，onDrawOver()方法就會被回調。但onDrawOver()每回調一次，會將上次的繪製清除，只有最後一次的繪製會被保留。也就是說繪製的蒙層在屏幕只會有一個
所以利用 onDrawOver 可以做很多事情，例如爲 RecyclerView 整體頂部繪製一個蒙層，或者爲特定的 item view 繪製蒙層。這裏就不單獨進行測試了。

繪製九宮格佈局樣式分割線：

對於分割線，前面的DividerItemDecoration就不適用了，主要是因爲它在繪製的時候，比如水平線，因爲每個Item一行，這樣是沒問題的。而GridLayoutManager時，一行有多個childItem，這樣就多次繪製了，並且GridLayoutManager時，Item如果爲最後一列（則右邊無間隔線）或者爲最後一行（底部無分割線）。

主要在getItemOffsets方法中，去判斷如果是最後一行，則不需要繪製底部；如果是最後一列，則不需要繪製右邊，整個判斷也考慮到了StaggeredGridLayoutManager的橫向和縱向，所以稍稍有些複雜

1、getItemOffsets(Rect outRect, View view, RecyclerView parent, State state)方法：

@Override
   @Deprecated
   public void getItemOffsets(Rect outRect, int itemPosition,
                        RecyclerView parent) {
      // 四個方向的偏移值
      int right = mDivider.getIntrinsicWidth();
      int bottom = mDivider.getIntrinsicHeight();
      if(isLastColum(itemPosition,parent)){//是否是最後一列
//       outRect.set(0, 0, 0, bottom);
         right = 0;
      }
      if(isLastRow(itemPosition,parent)){//是最後一行
//       outRect.set(0, 0, right, 0);
         bottom = 0;
      }
      outRect.set(0, 0, right, bottom);
   }
/**
 * 是否是最後一行
 * @param itemPosition
 * @param parent
 * @return
 */
private boolean isLastRow(int itemPosition, RecyclerView parent) {
   int spanCount =  getSpanCount(parent);
   LayoutManager layoutManager = parent.getLayoutManager();
   //有多少列
   if(layoutManager instanceof GridLayoutManager){
      int childCount = parent.getAdapter().getItemCount();
      int lastRowCount = childCount%spanCount;
      //最後一行的數量小於spanCount
      if(lastRowCount==0||lastRowCount<spanCount){
         return true;
      }
   }
   return false;
}
/**
 * 判斷是否是最後一列
 * @param itemPosition
 * @param parent
 * @return
 */
private boolean isLastColum(int itemPosition, RecyclerView parent) {
   LayoutManager layoutManager = parent.getLayoutManager();
   //有多少列
   if(layoutManager instanceof GridLayoutManager){
      int spanCount = getSpanCount(parent);
      if((itemPosition+1)%spanCount==0){
         return true;
      }
   }
   return false;
}

2、onDraw(Canvas c, RecyclerView parent, RecyclerView.State state)方法：

@Override
public void onDraw(Canvas c, RecyclerView parent, State state) {
   drawVertical(c,parent);
   drawHorizontal(c,parent);
}
private void drawHorizontal(Canvas c, RecyclerView parent) {
   // 繪製水平間隔線
   int childCount = parent.getChildCount();
   for (int i = 0; i < childCount; i++) {
      View child = parent.getChildAt(i);
      RecyclerView.LayoutParams params = (LayoutParams) child.getLayoutParams();
      int left = child.getLeft() - params.leftMargin;
      int right = child.getRight()+ params.rightMargin;
      int top = child.getBottom() + params.bottomMargin;
      int bottom = top + mDivider.getIntrinsicHeight();
      mDivider.setBounds(left, top, right, bottom);
      mDivider.draw(c);
   }
}
private void drawVertical(Canvas c, RecyclerView parent) {
   //繪製垂直間隔線(垂直的矩形)
   int childCount = parent.getChildCount();
   for (int i = 0; i < childCount; i++) {
      View child = parent.getChildAt(i);
      RecyclerView.LayoutParams params = (LayoutParams) child.getLayoutParams();
      int left = child.getRight() + params.rightMargin;
      int right = left + mDivider.getIntrinsicWidth();
      int top = child.getTop() - params.topMargin;
      int bottom = child.getBottom() + params.bottomMargin;
      mDivider.setBounds(left, top, right, bottom);
      mDivider.draw(c);
   }
}

源碼demo鏈接：
https://github.com/heiyl/recyleview