Android/Kotlin

안드로이드 Adaptor View(어댑터 뷰)의 개념 및 예제

meong_j 2022. 1. 16. 18:59
728x90
반응형

 Adaptor View(어댑터 뷰)

먼저 Adapter(어댑터)란 데이터와 View를 연결짓는 다리 역할을 하는 객체를 말한다. 

Adaptor View는 Adapter가 관리하는 데이터를 출력시켜줄 수 있는 view이다. 많은 정보들을 view에 직접 정보를 주입하여출력하지 않고, Adapter가 중간 다리 역할을 하여 관리해준다. 

Adaptor View는 ViewGroup을 상속을 받아 많은 view들을 담을 수 있고 출력할 수 있게 해준다.

 

 

어댑터 뷰 예제

어댑터 뷰 구조 및 흐름

MainActivity -> List['a','b','c']  -> Adapter -> listView_item.xml -> activity_main.xml (list)

 

 

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">

    <ListView
        android:id="@+id/mainListview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

메인 xml에서 어댑터 뷰로 사용할 ListView를 선언해주고 id를 지정한다.

 

 

listview_item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp">

    <TextView
        android:id="@+id/listviewItem"
        android:text="리스트뷰 아이템"
        android:textSize="30sp"
        android:layout_margin="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <TextView
        android:id="@+id/listviewItem2"
        android:text="리스트뷰 아이템"
        android:textSize="20sp"
        android:layout_margin="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</LinearLayout>

listview를 출력 할 textview 선언한다.

 

 

ListViewModel.kt

package com.meongj.listview_ex

import android.icu.text.CaseMap

data class ListViewModel (
    var title: String = "",
    var content : String = ""
)

title과 content를 가진 model인 ListViewModel을 생성하였다.

 

 

ListViewAdaptor.kt

package com.meongj.listview_ex

import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.BaseAdapter
import android.widget.TextView

class ListViewAdaptor(val List : MutableList<ListViewModel>) : BaseAdapter() {

    //오버라이드
    override fun getCount(): Int {
        return List.size
    }

    override fun getItem(position: Int): Any {
        return List[position]
    }

    override fun getItemId(position: Int): Long {
        return position.toLong()
    }

    override fun getView(position: Int, convertView: View?, parent: ViewGroup?): View {

        var converView = convertView

        if (converView == null) {
            converView = LayoutInflater.from(parent?.context).inflate(R.layout.listview_item, parent, false)
        }

        val title = converView!!.findViewById<TextView>(R.id.listviewItem)
        val content = converView!!.findViewById<TextView>(R.id.listviewItem2)
        title.text = List[position].title
        content.text = List[position].content
        // List[0] => ListViewModel("a","b")

        return converView!!
    }

}

 

데이터와 view를 잇는 Adaptor를 생성한다. ListViewModel을 List로 전달받아 view로 전달할 title과 content를 할당해준다.

 

 

MainActivity.kt

package com.meongj.listview_ex

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.ListView

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

        val list_item = mutableListOf<ListViewModel>()

        list_item.add(ListViewModel("title : a","content : b"))
        list_item.add(ListViewModel("title : c","content : d"))
        list_item.add(ListViewModel("title : e","content : f"))

        val listview = findViewById<ListView>(R.id.mainListview)

        //어댑터에 list전달
        val listAdaptor = ListViewAdaptor(list_item)
        listview.adapter = listAdaptor
    }
}

model에 출력할 값을 넣고 adaptor에 main 화면의 ListView로 전달한다.

 

 

 

 

반응형