[Android/kotlin] RecyclerView에 Divider 구분선 넣기 : ItemDecoration

---

공식문서

RecyclerView.ItemDecoration  |  Android 개발자  |  Android Developers

ItemDecoration 이란?

해당 추상 클래스를 이용하여 항목, 하이라이트, 시작적 그룹화 경계 사이에 구분선을 그리는데 유용하게 사용할 수 있습니다. 

ItemDecoration 을 사용하는 이유

다음과 같이 ListView의 경우 자체적으로 구분선을 그리는 기능이 존재합니다.

	<ListView
	android:id="@+id/lv_main"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:divider="@android:color/black"
	android:dividerHeight="4dp"/>

view raw test.xml hosted with ❤ by GitHub

하지만 RecyclerView의 경우 ListView와 같이 사용하는 것이 불가능하고 구분선을 그릴 수 있는 ItemDecoration을 사용해야한다.

그러나 대부분 아래와 같은 방법으로 구분선을 그리곤 하는데

	<View
	android:width="match_parent"
	android:height="1dp"
	android:background="#000000" />

view raw view_divider.xml hosted with ❤ by GitHub

위와 같은 방법을 사용하면 아래와 같은 문제가 발생한다고 합니다.

• 퍼포먼스에 영향을 준다.
• 좌우 슬라이드시 하단 구분선이 같이 움직인다.
• 각각 구분선을 통제할 수 없어진다.

출처 - https://readyandroid.wordpress.com/recyclerview-itemdecoration-in-android/

RecyclerView ItemDecoration in Android

자세한 내용은 위 링크에서 확인할 수 있습니다.

ItemDecoration 간단 구현(그냥 구분선 추가하기)

*Adapter를 지정하기 이전에 ItemDecoration을 추가

	val decoration = DividerItemDecoration(applicationContext, VERTICAL)
	rv_main.addItemDecoration(decoration)

view raw DividerItemDecoration.kt hosted with ❤ by GitHub

VERTICAL의 경우 지정한 LayoutManager에 따라 import해주시면 됩니다.

ItemDecoration 간단 커스텀

	class MyDecoration(
	//그릴 divider의 높이와 색상을 받는다
	private val dividerHeight: Int,
	private val dividerColor: Int = Color.TRANSPARENT
	) : RecyclerView.ItemDecoration() {
	//c.drawRect 에서 사용될 변수 선언
	private val paint = Paint()
	// recyclerView 보다 먼저 그려지는 함수
	override fun onDraw(c: Canvas, parent: RecyclerView, state: RecyclerView.State) {
	myDivider(c,parent,color = dividerColor)
	}
	private fun myDivider(c: Canvas, parent: RecyclerView, color: Int) {
	paint.color = color
	for (i in 0 until parent.childCount) {
	val child = parent.getChildAt(i)
	val param = child.layoutParams as RecyclerView.LayoutParams
	val dividerTop = child.bottom + param.bottomMargin
	val dividerBottom = dividerTop + dividerHeight
	c.drawRect(
	child.left.toFloat(),
	dividerTop.toFloat(),
	child.right.toFloat(),
	dividerBottom.toFloat(),
	paint
	)
	}
	}
	//recyclerView의 측정된 자식 성격의 메소드 들을 통해 호출되고 커스텀하지 않는경우 크기가 없는 rect를 반환한다.
	override fun getItemOffsets(
	outRect: Rect,
	view: View,
	parent: RecyclerView,
	state: RecyclerView.State
	) {
	outRect.bottom = dividerHeight
	}
	}

view raw MyDividerDecoration.kt hosted with ❤ by GitHub

이런저런 다양한 커스텀 방법이 많아 커스텀을 원하는 경우 더 많은 자료를 찾는 것을 권장합니다.

      

      

      

    
    

      <kotlin />
    
rv_main.addItemDecoration(MyDecoration(100, Color.BLACK))

위와 같이 적용하면 아래와 같은 화면이 됩니다.

코드 참고-> https://heepie.me/367

onDraw와 onDrawOver의 차이

onDraw

리사이클러뷰가 그려지기 전에 먼저 그려진다. 따라서 아이템들보다 아래 그려진다.

onDrawOver

리사이클러뷰가 그려진 후 그려진다. 따라서 아이템들보다 위에 그려진다.

다른 정보를 확인하시려면 공식 문서를 확인해주세요