[Kotlin] ListView 만들기

개발 환경

---------------------------------

OS : Mac

개발 툴 : Android Studio

개발 언어 : Kotlin

targetSdk : 31

minSdk : 23

---------------------------------

 

리스트 뷰가 필요할 때마다 인터넷에 검색을 했는데

이젠 검색하지 않으려고 직접 listView에 대해 정리해서 강제기억하려합니다.,.

 

먼저 listView는 항목 목록을 표시할 수 있는 컴포넌트입니다!

listView의 장단점과 recyclerView를 권장하는 이유 이런건 스킵하겠습니다!

 

바로 listView를 띄워보겠습니다

 

listView를 띄울려면 필요한 것들이 있는데

1. 데이터 클래스
2. 레이아웃에 ListView 추가
3. item 
4. 어댑터 

이렇게 네가지가 필요합니다!

 

먼저 데이터 클래스를 만들겠습니다

 

data class CompanyListData (
    val companyId : String,
    val companyName : String
        )

저는 회사 이름과 회사 아이디 데이터를 받아올에여

 

다음 리스트뷰를 띄울 레이아웃 xml에 리스트뷰 컴포넌트를 추가해줍니다

 

<ListView
    android:id="@+id/lsitView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

위 리스트뷰 컴포넌트를 원하시는 위치에 추가해주세요

 

 

 

 

 

Item을 만들겠습니다! 

 

listView 안에서 하나의 항목을 담당할 xml을 만들어보겠슴다

 

Layout Resource File 을 하나 생성해주세요

이름은 자유롭게! 

 

전 이렇게 회사 이름 한개만 넣겠습니당

생각해보니까 회사 아이디를 넣을 필요가 없어서여

데이터 클래스도 아이디는 뺐습니다!

 

마지막으로 어댑터를 생성하고 설정하겠습니다

 

listView를 레이아웃에 넣었고 listVeiw에 들어갈 item항목 레이아웃도 만들었고

데이터 클래스도 만들었다면? 이 세가지를 연결할 어댑터를 만들어야 합니다.

 

어댑터 클래스를 하나 생성해주세요

class CompanyListAdapter (val context: Context, val companyList: ArrayList<CompanyListData>) : BaseAdapter(){
    override fun getCount(): Int {
        return companyList.size
    }

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

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

    override fun getView(position: Int, convertView: View?, parent: ViewGroup?): View {
        val view : View = LayoutInflater.from(context).inflate(R.layout.company_item, null)

        val companyName = view.findViewById<TextView>(R.id.company_name)
        val company = companyList[position]
        
        companyName.text = company.companyName

        return view
    }

}

 BaseAdapter() 를 상속받고 임플리먼트 네개를 추가해주세여

 

🐥🐥 위 오버라이드 함수중에서 getVIew() 함수를 주목해야햐는데

getView()는 각 데이터 항목에 대하여 ListView에 표현하기 위한 view를 생성하는 함수입니다

 

val view : View = LayoutInflater.from(context).inflate(R.layout.company_item, null)

저희가 아까 만든 item layout 리소스를 뷰 객체에 반환해줍니다.

 

val companyName = view.findViewById<TextView>(R.id.company_name)

id값을 이용해 companyName TextView를 받아옵니다.

 

val company = companyList[position]

companyName.text = company.companyName

 

 

ArrayList<CompanyListData> 의 텍스트 데이터를 회사이름 텍스트 뷰에 붙입니다.

 

 

어댑터 생성이 끝났으니 이제 설정하겠습니다!

private val companylist = ArrayList<CompanyListData>()

val companyAdapter = CompanyListAdapter(this,companylist)
pwLoginBinding.companyList.adapter = companyAdapter

🐥🐥리스트뷰를 띄울 클래스의 onCreate()안에다가 adapter를 초기화 해주세여

 

 

이러고 데이터 연결해주면 끝 !

저는 서버에서 데이터를 받을건데 혹시 테스트 하시는 분들은 리스트에 임의의 데이터를 넣으시고 테스트해보시면 될것같습니당

 

그럼 이만!