[ToDo List] 업무 관리 앱: 어댑터 만들기

필요한 업무를 텍스트뷰에 입력하여, 버튼을 누르면 추가되고, 업무가 수행되면 상황이 바뀌는 그런 식의 앱 프로젝트입니다.

 

우선 기본적인 레이아웃을 만들어줍니다. 텍스트뷰에 입력을 받을 수 있도록 하고, Vector Access를 이용해 원하는 모양의 삭제 아이콘을 가져옵니다. 여기서는 쓰레기통 모양의 아이콘을 이용할 것입니다. 리사이클러뷰를 사용하고, 추가되는 업무(아이템)가 리사이클러뷰 내에 표시될 수 있도록 준비합니다. 

<ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
      ... 생략 ... />

    <EditText 
     ... 생략 ... />

    <RecyclerView
     ... 생략 ... />

</ConstraintLayout>

반응형

코틀린은 객체 지향이 가능한 언어입니다. 리사이클러뷰에 표시되는 추가 업무를 객체를 데이터 클래스로 만들어 줍니다. 메인 액티비티에 필요한 데이터 클래스를 아래와 같이 작성하도록 합니다. 데이터 클래스는 자동으로 getter, setter를 구현합니다.

필요한 업무를 기록하기 위한 text 파라미터와 업무가 완료되었는지 체크하는 isDone 파라미터를 받도록 합니다. isDone 파라미터는 변할 수 있는 변수이기에 var로 선언합니다.

data class Todo(val text:String, var isDone:Boolean)

 

이제는 리사이클러뷰 안에 데이터를 어떤식으로 표현할지 도와주는 역할을 담당하는 어댑터 클래스를 만들어 줍니다.

RecyclerView.Adapter<TodoAdapter.TodoViewHolder>()에서 보듯이, 리사이클러뷰에 속한 어댑터를 상속받고 있습니다. 해당 어댑터는 private val dataSet: List<Todo>처럼, 데이터 클래스를 제너릭 타입으로 갖는 List 형태의 dataSet을 인자로 갖게 됩니다.

class TodoAdapter(private val dataSet: List<Todo>) :
    RecyclerView.Adapter<TodoAdapter.TodoViewHolder>() {
     *** 생략 ***
}

class TodoViewHolder(val view: View) 처럼, 뷰홀더 클래스는 View 타입의 view를 인자로 받게 됩니다. view는 텍스트뷰, 이미지뷰 등의 여러 뷰가 담게 됩니다.

class TodoViewHolder(val view: View) : RecyclerView.ViewHolder(view) { ... }

onCreateViewHolder 메소드에서는 원하는 뷰를 담을 수 있도록 뷰홀더를 만들어주는 곳입니다. LayoutInflater를 이용해서 inflate(R.layout.item_todo, viewGroup, false)와 같이 원하는 아이템뷰를 홀더에 담아서 리턴해줍니다.

override fun onCreateViewHolder(viewGroup: ViewGroup, viewType: Int): TodoViewHolder {
        val view = LayoutInflater.from(viewGroup.context)
            .inflate(R.layout.item_todo, viewGroup, false)

        return TodoViewHolder(view)
}

 

onBindViewHolder 함수는 아이템을 화면에 표시해주는 역할을 합니다. 홀더 안에 담긴 전체 뷰(view)에서 아이템에 해당하는 레이아웃을 가져온 다음에 textView에 할당시켜 줍니다. 해당 textView에 다시 List<Todo> 타입의 dataSet.text를 할당합니다. 이렇게 해서 Todo 데이터 클래스의 텍스트 값을 표시할 수 있게 됩니다.

override fun onBindViewHolder(viewHolder: TodoViewHolder, position: Int) {
        val textView = viewHolder.view.findViewById<TextView>(R.id.todo_text)
        textView.text = dataSet[position].text
}

그리고 getItemCount( )는 dataSet의 크기만큼 리턴해줄 수 있도록 합니다.

override fun getItemCount() = dataSet.size

이후에는 뷰를 밑에 일렬로 표시하기 위해 LinearLayoutManager가 필요하며, TodoAdapter에 dataSet을 전달하고, 리사이클러뷰에 레이아웃매니저와 어댑터를 지정해주면 됩니다.

 

하지만 다음 챕터에는 뷰 바인딩을 적용해서 좀 더 간결화된 방법으로 프로젝트를 계속 이어가도록 하겠습니다.