리스트뷰와 어댑터 ListView & Adapter

이전에 애드뷰로 리스트뷰를 그리는 작업은 다음과 같이 진행되었습니다.

 

1. 먼저 리스트로 만들고 싶은 아이템의 리스트를 준비합니다.

2. Inflater를 이용해 아이템 하나에 해당하는 뷰를 만듭니다.

3. 아이템에 해당하는 뷰를 Container 뷰에 붙여준다.

 

위의 방식으로 리스트뷰를 준비한 것이 AddView 였다면, 리스트뷰(ListView)는 2~3번의 과정을 어댑터(Adapter)를 이용합니다. 애드뷰는 리스트에 보여줄 아이템의 갯수와 상관 없이 '한 번에' 모두 표현하지만, 리스트뷰는 먼저, 한 화면에 보여지는 부분을 뷰로 나타내고, 이후 필요할 경우에만 추가적인 뷰를 더 나타냅니다.

 

그럼 리스트뷰로 어떻게 뷰를 나타내는지 직접 알아봅니다.

 

우선 액티비티 파일을 만들고, 해당 액티비티의 레이아웃 xml 파일을 확인합니다. xml 파일에 리스트뷰를 추가합니다. 리시트뷰의 속성중에 divider(dividerHeight)는 리스트뷰를 그릴 시 자동적으로 생기는 흰 구분선을 의미하는데, 이를 @null로 지정하면 해당 구분선이 사라지게 됩니다.

<LinearLayout 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=".ListviewActivity">

    <ListView
        android:id="@+id/listView"
        android:dividerHeight="@null"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

반응형

다음은 액티비티를 코딩합니다. 액티비티 파일에 기존 예문의 반복문을 그대로 사용하였습니다. waitingList는 WaitForList의 결과의 손님 번호와 대기 번호를 배열로 가지게 되며, for문을 사용해서 반복시켜 준 것입니다. 

class ListviewActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_listview)

        val waitingList = ArrayList<WaitForList>()
        for (i in 0 until 10){
            waitingList.add(WaitForList("" + i + "번째 손님", "" + i + "번째 대기번호"))

        
       }
       
       //어댑터 생성 및 활용
       val adapter = ListViewAdapter(waitingList, LayoutInflater.from(this@ListviewActivity))
       listView.adapter = adapter

    }
}

이후에는 액티비티에 어댑터 클래스를 만들어줍니다. 어댑터는 조종하는 역할을 하므로, 리스트뷰를 사용하려면 필수로 만들어줘야 합니다.

class ListViewAdapter(
    val waitForList: ArrayList<WaitForList>,
    val layoutInflater: LayoutInflater
): BaseAdapter(){

    //전체 그리는 부분분
   override fun getView(position: Int, convertView: View?, parent: ViewGroup?): View {
        val view = layoutInflater.inflate(R.layout.item_view, null)
        val guestNameTextView = view.findViewById<TextView>(R.id.guest_name)
        val waitingTextView = view.findViewById<TextView>(R.id.waiting)

        guestNameTextView.setText(waitForList.get(position).guest_number)
        waitingTextView.setText(waitForList.get(position).waiting_number)

        return view

    }

    //그리고자 하는 전체 리스트에서 아이템 하나
   override fun getItem(position: Int): Any {
        return waitForList.get(position)
    }

    //아이템의 포지션(즉, 아이디)
    override fun getItemId(position: Int): Long {
        return position.toLong()
    }

    //리스트의 총 사이즈
    override fun getCount(): Int {
        return waitForList.size
    }
}

ListViewAdapter 어댑터 클래스는 waitForList, layoutinflater를 가지고 있으며, BaseAdapter( )를 상속받습니다. BaseAdapter를 상속받을 때는 해당 클래스의 메소드를 구현해줘야 합니다. 따라서, getView, getItem, getItemId, getCount 총 네 가지를 구현합니다.

먼저, getView는 뷰 전체를 나타내는 부분입니다. 앞전에 정의한 layoutinflater를 이용해, 그리게 될 뷰(item_view)를 view 변수에 넣어주고, 해당 뷰의 guest_name, waiting에 해당하는 텍스트뷰를 가져옵니다. 그리고 해당 텍스트뷰 자리는 WaitForList 클래스의 인자로 채워줄 수 있도록 코딩합니다.

 

아래는 이전에 작업한 WaitForList 클래스입니다. 인자로 들어간 guest_number, waiting_number가 guestNameTextView, waitingTextView로 들어가게 됩니다. 그리고 해당 뷰를 리턴해주면 전체적인 뷰가 그려지겠죠?

class WaitForList(val guest_number: String, val waiting_number: String){

}

getItem은 전체적인 뷰 중에서 하나에 해당하는 아이템입니다. 리스트뷰의 아이템이 1~5라면, 1번 아이템의 position 1번이 됩니다. waitForList.get(position)을 리턴함으로써 아이템을 가져오게 됩니다.

 

getItemId는 말그대로 아이템마다 아이디가 있다면, 아이디를 가져오는 것입니다. 아이디가 없으므로 그냥 포지션으로 가져옵니다. position 자체는 Int 타입이므로, toLong( ) 메소드를 통해서 캐스팅해줬습니다.

 

getCount( )에서는 리스트의 크기를 리턴해줘야 합니다. 말그대로 waitForList.size의 사이즈를 가져오면 됩니다.

 

이렇게 어댑터가 완성되면, ListviewActivity 클래스에 어댑터를 생성한 후, 해당 어댑터를 통해서 리스트뷰를 가져오면 됩니다. 아래와 같이, 어댑터 클래스는 waitingList와 LayoutInflater를 받습니다. WaitForList 타입의 ArrayList인 waitingList와 context(this)를 이용해 ListviewActivity에 접근한 LayoutInflater를 인자로 받은 생성자를 adapter에 넣어준 것입니다. 그리고 xml 파일의 id가 listView였던 리스트뷰의 어댑터에 해당 adapter를 넣어줌으로써, onCreate 부분에서 리스트뷰가 그려지게 됩니다. 

val adapter = ListViewAdapter(waitingList, LayoutInflater.from(this@ListviewActivity))
listView.adapter = adapter