帶有吸附效果的RecyclerView裝飾器

經過本文你講了解到： 1.RecyclerView.ItemDecoration的通常寫法 2.View的DrawingCache的相關內容 3.Kotlin的簡單語法 4.這個一個支持任意分組的，任意佈局的Item裝飾。外加能夠頂部吸附效果（固然你不喜歡，也能夠不啓用）

靈感來源：（http://www.jianshu.com/p/b335b620af39 ） 先偷一張圖，想要的效果就是這樣的。

而後是我寫的代碼的效果：

####1.先說說ItemDecoration#### ItemDecoration主要一下三個方法，能夠給Item添加裝飾，這就是裝飾器的意思，通常用來作分割線。

public void onDraw(Canvas c, RecyclerView parent, State state)
public void onDrawOver(Canvas c, RecyclerView parent, State state)
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, State state)
複製代碼

onDraw是在Item內容以前繪製，onDrawOver是在Item內容之上繪製，getItemOffsets是給Item設置一個偏移量，來給裝飾器留下繪製的空間。

再偷一個圖：

本次的效果，頂部懸浮的裝飾是在onDrawOver中繪製，其餘的裝飾是在onDraw中繪製，getItemOffsets中判斷分組的第一個，設置偏移。

####2.而後是DrawingCache####

繪製裝飾器是先經過cache機制，將裝飾器保存爲bitmap，而後用canvas繪製上去。

咱們要獲取cache首先要經過setDrawingCacheEnable方法開啓cache，而後再調用getDrawingCache方法就能夠得到view的cache圖片了。

buildDrawingCache方法能夠不用調用，由於調用getDrawingCache方法時，若果cache沒有創建，系統會自動調用buildDrawingCache方法生成cache。由於會更新裝飾器的內容, 因此要調用destoryDrawingCache方法把舊的cache銷燬，才能創建新的。

當調用setDrawingCacheEnabled方法設置爲false, 系統也會自動把原來的cache銷燬。

####3.最後是代碼####

package top.greendami.mykotlinapp

import android.content.Context
import android.graphics.Bitmap
import android.graphics.Canvas
import android.graphics.Rect
import android.support.v7.widget.RecyclerView
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup


/**
 *
 * Created by GreendaMi on 2017/6/14.
 */
class SectionDecoration<T>(var context: Context, var dataList: ArrayList<T>, val layoutId: Int, val groupListener: GroupListener,var isFloat : Boolean = true, var sectionLayout: ViewGroup = LayoutInflater.from(context).inflate(layoutId, null) as ViewGroup) : RecyclerView.ItemDecoration() {

    var lastBitmap: Bitmap? = null
    var firstTop: Int = 0

    init {
        val layoutParams = ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT)
        sectionLayout.layoutParams = layoutParams
        sectionLayout.measure(
                View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED),
                View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED))
    }

    //繪製分割區域
    override fun onDraw(c: Canvas?, parent: RecyclerView?, state: RecyclerView.State?) {
        super.onDrawOver(c, parent, state)
        val left = parent!!.paddingLeft
        for (i: Int in 0..parent.childCount) {
            if (groupListener.isFirst(parent.getChildAdapterPosition(parent.getChildAt(i)))) {
                //設置內容
                groupListener.setContnt(sectionLayout, parent.getChildAdapterPosition(parent.getChildAt(i)))
                //設置內容後從新測量（此處默認父佈局寬度）
                sectionLayout.measure(
                        View.MeasureSpec.makeMeasureSpec(parent.width, View.MeasureSpec.EXACTLY),
                        View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED))
                sectionLayout.layout(0, 0, parent.width - parent.paddingRight, sectionLayout.measuredHeight)
                sectionLayout.isDrawingCacheEnabled = true
                sectionLayout.buildDrawingCache(true)
                c!!.drawBitmap(sectionLayout.drawingCache, left.toFloat(), (parent.getChildAt(i).top - sectionLayout.measuredHeight).toFloat(), null)
                //獲取圖像(保存滾出屏幕的最後一個)
                if ((parent.getChildAt(i).top - sectionLayout.measuredHeight) <= 0) {
                    lastBitmap = Bitmap.createBitmap(sectionLayout.drawingCache)
                }
                sectionLayout.destroyDrawingCache()
                sectionLayout.isDrawingCacheEnabled = false
            } else {
                continue
            }
        }
    }

    //若是開啓了懸浮，繪製懸浮的那個分割區域
    override fun onDrawOver(c: Canvas?, parent: RecyclerView?, state: RecyclerView.State?) {
        super.onDrawOver(c, parent, state)
        if(!isFloat){
            return
        }
        val left = parent!!.paddingLeft
        for (i: Int in 0..parent.childCount) {
            if (groupListener.isFirst(parent.getChildAdapterPosition(parent.getChildAt(i)))) {
                //parent.getChildAt(i).top是Item內容的高度，不包含Decoration的高度；sectionLayout.measuredHeight是Decoration的高度
                if (parent.getChildAt(i).top in sectionLayout.measuredHeight..sectionLayout.measuredHeight * 2) {
                    firstTop = parent.getChildAt(i).top - sectionLayout.measuredHeight * 2
                    c!!.drawBitmap(lastBitmap, left.toFloat(), firstTop.toFloat(), null)
                    //發現是交換的過程，繪製完交換後的Decoration後，再也不繪製top位置是0的Decoration
                    return
                } else {
                    firstTop = 0
                }
            } else {
                firstTop = 0
            }
        }
        //繪製top位置是0的Decoration
        c!!.drawBitmap(lastBitmap, left.toFloat(), firstTop.toFloat(), null)
    }

    //每一個Item給留出分割區域的繪製控件
    override fun getItemOffsets(outRect: Rect?, itemPosition: Int, parent: RecyclerView?) {
        super.getItemOffsets(outRect, itemPosition, parent)
        if (groupListener.isFirst(itemPosition)) {
            outRect!!.top = sectionLayout.measuredHeight
        }
    }

}

abstract class GroupListener {
    abstract fun isFirst(position: Int): Boolean
    abstract fun setContnt(contentView: ViewGroup, position: Int)
}
複製代碼

//獲取圖像(保存滾出屏幕的最後一個) if ((parent.getChildAt(i).top - sectionLayout.measuredHeight) <= 0) { lastBitmap = Bitmap.createBitmap(sectionLayout.drawingCache) } 是在尋找最後一個滾出屏幕的裝飾器，用於繪製吸附效果。

if (parent.getChildAt(i).top in sectionLayout.measuredHeight..sectionLayout.measuredHeight * 2) { firstTop = parent.getChildAt(i).top - sectionLayout.measuredHeight * 2 c!!.drawBitmap(lastBitmap, left.toFloat(), firstTop.toFloat(), null) //發現是交換的過程（後一個把前一個頂出的過程），繪製完交換後的Decoration後，再也不繪製top位置是0的Decoration return }

後一個把前一個頂出的過程，計算被頂出的裝飾器的top座標。

外部回調，list是一個普通的RecycleView，R.layout.header是裝飾器的佈局。

list.addItemDecoration(SectionDecoration(this, datas, R.layout.header, object : GroupListener() {
override fun isFirst(position: Int): Boolean {
return position % 5 == 0
}

override fun setContnt(contentView: ViewGroup, position: Int) {
(contentView.findViewById(R.id.text) as TextView).text = "標題：" + datas[position]
}

}))
複製代碼

Github( https://github.com/GreendaMi/PPColorPicker/blob/master/app/src/main/java/top/greendami/mykotlinapp/PPSectionDecoration.kt )