RecyclerView에 줄 라인 추가하기(Divider)

ListView와는 다르게 RecyclerView에는 기본적으로 line divider 가 존재하지 않는다. 따라서 RecyclerView에서 제공하는 addItemDecoration 함수를 사용해야 한다.

사실 이전에도 관련 글을 포스팅한 적이 있었는데 최근 들어 사용 언어를 Kotlin으로 갈아타게 되면서 코틀린 버전도 포스팅을 해볼까 한다..

 

적용을 위해서는 DividerItemDecoration 클래스를 만들고 line으로 사용할 xml을 생성해주면 된다.

일단 line으로 쓰이게 될 line_divider.xml 을 drawable안에 만들어준다.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <size android:width="1dp" android:height="1dp" />
    <solid android:color="#f0f0f0" />
</shape>

이렇게 되면 약간의 회색 줄이 생성된다. 이제 이를 사용할 class를 생성해보자. 클래스명은 원하는 대로..

class DividerItemDecoration(
    context: Context,
    resId: Int,
    val paddingLeft: Int,
    val paddingRight: Int
) : RecyclerView.ItemDecoration() {

    private var mDivider: Drawable? = null

    init {
        mDivider = ContextCompat.getDrawable(context, resId)
    }

    override fun onDrawOver(c: Canvas, parent: RecyclerView, state: RecyclerView.State) {

        val left = parent.paddingLeft + paddingLeft
        val right = parent.width - parent.paddingRight - paddingRight
        val childCount = parent.childCount

        for (i in 0 until childCount) {
            val child = parent.getChildAt(i)
            val params = child.layoutParams as RecyclerView.LayoutParams
            val top = child.bottom + params.bottomMargin
            val bottom = top + (mDivider?.intrinsicHeight ?: 0)

            mDivider?.let {
                it.setBounds(left, top, right, bottom)
                it.draw(c)
            }

        }
    }
}

설명을 조금 하자면.. 파라미터로 context와 styel을 적용할 drawable xml, 좌우 패딩 값을 받는다. 또한 ItemDecoration을 상속받은 것을 볼 수 있다. mDivider객체에 이전에 미리 만들어둔 라인으로 쓰게 될 xml을 지정해 주면 된다.

 

그렇게 되면 onDrawOver함수에서 라인을 그리게 되는 것이다.

 

실제 RecyclerView에서의 적용 방법은 아래와 같다.

recyclerView.addItemDecoration(DividerItemDecoration(context, R.drawable.line_divider, 80, 80))

나는 좌우 80 만큼의 간격을 주고 라인을 그릴 것이기 때문에 위와 같이 작성하였으나 이 또한 본인의 입맛대로, 디자인 가이드 대로 진행하면 된다.

 

좀 귀찮아지긴 했으나.. 코드가 좀 더 유연해진 느낌이다.