前言
今年換了新工作 ， 剛開始熟悉項目 卒煞，今天終于交付了一個版本 ， 整個人忙得暈頭轉(zhuǎn)向 叼架， 每次接手新項目 跷坝，都需要一段時間去熟悉項目 ， 有時候會因為不熟悉前任寫的代碼 碉碉， 可能會掉進(jìn)不明不白的坑里 柴钻， 至此，我覺得想要最快熟悉前任寫代碼 垢粮，當(dāng)前又沒有任務(wù) 贴届，可以小范圍重構(gòu) ， 并進(jìn)行測試 蜡吧， 可以減少因為不熟悉項目的一些細(xì)節(jié) 毫蚓，而踩到不明不白的坑 。
ItemDecoration
使用過RecyclerView的朋友肯定有過這樣的經(jīng)歷 昔善， 以前在使用ListView的時候元潘，在Item之間的分割線上 ， 使用ListView的divider屬性就可以搞定君仆，但在RecyclerView中卻再也沒見到這個屬性翩概，那么他到哪里去了呢 ？ RecyclerView給我們提供了這樣的方法addItemDecoration(ItemDecoration decor) 傳遞進(jìn)去的ItemDecoration對象就是今天的主角返咱，專門用于處理Item之間的間隔和拓展 钥庇。
從RecyclerView源碼中可以看到，ItemDecoration是其子類并且還是一個抽象類咖摹，里面有幾個抽象方法评姨，需要我們繼承ItemDecoration，并進(jìn)行重寫的 萤晴。
/**
* 獲得條目偏移量 吐句， 回調(diào)此方法來確定每個Item的偏移量
* @param outRect 矩形區(qū)域 , 每一個Item都是一個矩形區(qū)域胁后，rect表示矩形區(qū)域的四個方位
* @param view 每個條目的View對象
* @param parent
* @param state
*/
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
}
/**
* 間隔線繪制
* @param c
* @param parent
* @param state
*/
@Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
}
我們從源碼中可以看到 ， ItemDecoration里面嗦枢，全是RecyclerView在內(nèi)部會回調(diào)的方法择同，并提供onDraw方法 ，這樣給了我們極大的自定義性净宵，可以畫出任意圖案的Item 。
自定義簡單的ItemDecoration
移動設(shè)備開發(fā)裹纳，大部分時間都是在可以List列表類打交道择葡，因為手持設(shè)備的顯示空間有限，可以只能通過上下滑動來展示更多的內(nèi)容剃氧。因為RecyclerView沒有給我們提供常規(guī)的divider敏储，那么我們就指定一個簡單的ItemDecoration，了解它自定義的原理 朋鞍。只有了解了其原理 已添， 以后想要什么樣的都有 。
ItemDecoration給我們提供了兩個方法滥酥，onDraw方法自不必多說 更舞， 大家都知道 。getItemOffsets這個方法估計就比較少見了坎吻， 這個方法是設(shè)置我們每個Item的偏移量缆蝉，也就是我們需要Item給出多大的繪制空間 ， 這個方法給了Rect對象瘦真，用來設(shè)置巨型的偏移量刊头，也就是每個Item多出多燒來進(jìn)行繪制你給的圖案 。
getItemOffsets 圖解
由圖上可以看出 诸尽， 每個Item都是一個rect 原杂， 而我們要繪制的就是rect的四個邊， 上圖是以畫類似ListView的divider為例子 您机。
畫水平線
畫水平線 穿肄， 想要畫水平線，就要先弄清楚 际看， 要畫rect的哪個邊被碗，就List的來說，是rect的下邊也就是bottom 仿村。在getItemOffsets設(shè)置rect的下邊的偏移量 锐朴。
設(shè)置偏移量
outRect.set(0,0,0,drawable.getIntrinsicHeight()); // 將drawable繪制在Item的底部
這樣就在rect的底部 ， 偏移了一定的高度蔼囊，可以繪制并顯示我們的圖案 焚志。
繪制
/**
* 畫水平線
* @param c 畫布
* @param parent
*/
private void drawHorizontalLine(Canvas c, RecyclerView parent) {
int left = parent.getPaddingLeft(); // 從recyclerView容器內(nèi)邊距算起 衣迷， 左邊起點坐標(biāo)
int right = parent.getWidth() - parent.getPaddingRight(); // recyclerView寬度減去paddingRight計算右邊坐標(biāo)
// 以上 , Item decoration的寬度坐標(biāo)確定 ， 即rect的寬度
int childCount = parent.getChildCount();
for (int i = 0; i <childCount ; i++) {
View childView = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) childView.getLayoutParams();
int top = childView.getBottom() + layoutParams.bottomMargin + Math.round(ViewCompat.getTranslationY(childView));
int bottom = top + drawable.getIntrinsicHeight();
// 每一個Item都需要繪制一遍
drawable.setBounds(left,top,right,bottom);
drawable.draw(c);
}
}
因為繪制的是Drawable所以也需要指定drawable的rect 酱酬， 指定rect的方法為drawable.setBounds(left,top,right,bottom);壶谒，這樣來確定drawable繪制的圖形大小寬高 。
畫水平線膳沽，所有rect的左邊是從RecyclerView的左內(nèi)邊距算起(內(nèi)邊距不參與繪制) 汗菜， 右邊就是RecyclerView的整個寬度減去右內(nèi)邊距，這樣計算得出Item的寬度 挑社。因為是ListView陨界，每條線都在不同的Item下，所有rect的上邊就在每個Item的bottom下面痛阻，所有drawable的上邊就要從每個Item的下邊算起菌瘪，即 childView.getBottom() + layoutParams.bottomMargin + Math.round(ViewCompat.getTranslationY(childView)); 而drawable rect的下邊則是每個Item的bottom 加上 drawable的高度 ， 這樣drawable rect的四個邊就計算完成了 阱当， 我們水平線也就畫出來了 俏扩。
完整源碼
public class SimpleItemDecoration extends RecyclerView.ItemDecoration {
private int orientation;
private Drawable drawable;
public SimpleItemDecoration(@NonNull int orientation, @NonNull Drawable drawable) {
this.orientation = orientation;
this.drawable = drawable;
}
/**
* 設(shè)置RecyclerView的布局管理器
* @param orientation
*/
public void setOrientation(int orientation) {
if (LinearLayoutManager.HORIZONTAL != orientation && LinearLayoutManager.VERTICAL != orientation)
new IllegalArgumentException("RecyclerView不支持此布局管理器");
this.orientation = orientation;
}
/**
* 獲得條目偏移量 ， 回調(diào)此方法來確定每個Item的偏移量
* @param outRect 矩形區(qū)域 , 每一個Item都是一個矩形區(qū)域弊添，rect表示矩形區(qū)域的四個方位
* @param view 每個條目的View對象
* @param parent
* @param state
*/
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
if (LinearLayoutManager.VERTICAL == orientation) {
outRect.set(0,0,0,drawable.getIntrinsicHeight()); // 將drawable繪制在Item的底部
}else if (LinearLayoutManager.HORIZONTAL == orientation) {
outRect.set(0,0,drawable.getIntrinsicWidth(),0); // 將drawable繪制在Item的右邊
}
}
/**
* 間隔線繪制
* @param c
* @param parent
* @param state
*/
@Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
if (LinearLayoutManager.VERTICAL == orientation) {
drawHorizontalLine(c,parent); //畫水平線
}else if (LinearLayoutManager.HORIZONTAL == orientation) {
drawVerticalLine(c,parent); // 畫垂直線
}
}
/**
* 畫水平線
* @param c 畫布
* @param parent
*/
private void drawHorizontalLine(Canvas c, RecyclerView parent) {
int left = parent.getPaddingLeft(); // 從recyclerView容器內(nèi)邊距算起 录淡， 左邊起點坐標(biāo)
int right = parent.getWidth() - parent.getPaddingRight(); // recyclerView寬度減去paddingRight計算右邊坐標(biāo)
// 以上 , Item decoration的寬度坐標(biāo)確定 ， 即rect的長度
int childCount = parent.getChildCount();
for (int i = 0; i <childCount ; i++) {
View childView = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) childView.getLayoutParams();
int top = childView.getBottom() + layoutParams.bottomMargin + Math.round(ViewCompat.getTranslationY(childView));
int bottom = top + drawable.getIntrinsicHeight();
// 每一個Item都需要繪制一遍
drawable.setBounds(left,top,right,bottom);
drawable.draw(c);
}
}
/**
* 畫垂直線
* @param canvas
* @param parent
*/
private void drawVerticalLine(Canvas canvas,RecyclerView parent) {
int top = parent.getPaddingTop();
int bottom = parent.getHeight() - parent.getPaddingBottom();
int childCount = parent.getChildCount();
for (int i = 0; i <childCount ; i++) {
View childView = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) childView.getLayoutParams();
int left = childView.getRight() + layoutParams.rightMargin + Math.round(ViewCompat.getTranslationX(childView));
int right = left + drawable.getIntrinsicWidth();
drawable.setBounds(left,top,right,bottom);
drawable.draw(canvas);
}
}
}
結(jié)語
RecyclerView很強(qiáng)大 油坝， 但是需要自定義的很多 赁咙， 這也就造成了RecyclerView可以寫出千變?nèi)f化的UI出來，如此松耦合的庫免钻，需要我們不斷的去學(xué)習(xí) 彼水。
很久沒寫文章了 ， 今年忙碌并且充實著极舔，也即將迎來人生中的第一輛車凤覆，想想渾身都是動力 。
