모르는게 많은 개발자

[안드로이드] RecylcerView - Kotlin 간단 예제 본문

안드로이드

[안드로이드] RecylcerView - Kotlin 간단 예제

Awdsd 2020. 5. 4. 20:55
반응형

RecyclerView 예제에 대해 설명하려 한다. 

 

1. RecyclerView란

  • 사용자가 관리하는 많은 데이터 집합을 개별 아이템으로 단위로 구성하여 화면에 출력하는 뷰그룹
  • 한 화면에 표시되기 힘든 많은 데이터를 스크롤 가능한 리스트로 표시해주는 위젯
  • LayoutManager를 통해 아이템뷰 나열형태 관리

2. 구성

 

RecyclerView 구성 요소

RecyclerView는 Data List의 ItemView(한개의 Data View)를 Adapter를 통해 생성한다.

Adapter안에는 ViewHolder라는 것이 있다.

※ ViewHolder

  • 화면에 나타날 ItemView를 저장하는 Holder객체이다.
  • inflate(xml로 쓰인 View를 실제 객체로 만드는 것)을 최소화하기 위해 View를 재활용할 때, 각각의 ItemView를 바로 접근할 수 있게 저장하고 사용하기 위한 객체

3. 예제

3.1 프로젝트 구성


3.2 build.gradle 추가

    implementation "androidx.recyclerview:recyclerview:1.1.0"
    implementation "androidx.recyclerview:recyclerview-selection:1.1.0-rc01"

3.3 아이템 뷰 XML

<!-- ex_recycle_list_item.xml -->
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:paddingTop="15dp"
    android:paddingBottom="15dp">

    <TextView
        android:id="@+id/age"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

간단하게 텍스트뷰만 넣었다.


3.4 Activity XML

<!-- actvity_main.xml -->
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/Linear"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <androidx.recyclerview.widget.RecyclerView
            android:layout_width="match_parent"
            android:id="@+id/ex_recycle"
            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
            android:layout_height="match_parent"
            tools:listitem="@layout/ex_recycle_list_item"/>
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

RecyclerView를 적용하기 위해서는 RyclerView layout을 XML에 설정해줘야 한다.


3.5 item class

아이템 정보를 담을 클래스

//kotlin은 getter,setter을 자동으로 제공
class ExItem(val age: Int) {
}

3.6 Adapter

Adapter는 onCreateViewHolder, onBindViewHolder, getItemCount를 오버라이딩한다.

class ExRecyclerAdapter(private val items: ArrayList<ExItem>) :
    RecyclerView.Adapter<ExRecyclerAdapter.ViewHolder>() {

    //RecyclerView 초기화때 호출된다.
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val inflatedView = LayoutInflater.from(parent.context)
            .inflate(R.layout.ex_recycle_list_item, parent, false)	//아이템 뷰 xml설정
        return ExRecyclerAdapter.ViewHolder(inflatedView)
    }

    //생성된 View에 보여줄 데이터를 설정
    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        //클릭 리스너 설정
        val listener = View.OnClickListener {it ->
            Toast.makeText(it.context, items[position].age.toString(), Toast.LENGTH_SHORT).show()
        }
        //
        holder.bind(listener, items[position])

    }

    //보여줄 아이템 개수가 몇개인지 알려줍니다
    override fun getItemCount(): Int = items.size


    //ViewHolder 단위 객체로 View의 데이터를 설정합니다
    class ViewHolder(private var v: View) : RecyclerView.ViewHolder(v){
        fun bind(listener: View.OnClickListener, item: ExItem){
            v.setOnClickListener(listener)
            v.age.text = item.age.toString()
        }
    }
}

3.7 Activity

ArrayList에 임의의 데이터를 넣고 Adapter설정

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val list = ArrayList<ExItem>()

        list.add(ExItem(13))
        list.add(ExItem(14))
        list.add(ExItem(15))
        list.add(ExItem(16))
        list.add(ExItem(17))
        list.add(ExItem(18))
        list.add(ExItem(19))
        ex_recycle.adapter = ExRecyclerAdapter(list)
    }
}

3.8 결과

반응형
Comments