리스트뷰 그리는 방법1 : addView

리스트뷰는 유사하게 반복되는 뷰를 그리기 위한 도구이다.

 

리스트뷰를 그리는 방법에는 세가지가 있다.

1. addView : 실제로 리스트뷰를 그리기 위해 잘 사용되지 않는다.

2. ListView : 예전에 많이 사용되었다.

3. RecycleView : 최근에 가장 많이 사용되고있고 가장 효율이 높다.

 

위 세가지를 구현하는 방법 중 addView에 대해 알아본다.

 

addView

1.  Item을 담을 XML과 이를 담을 XML을 만들어 준다.
2.  container View에 더해준다.
3.  반복한다.

 

이때 주의할 점은 자동으로 스크롤을 가능하게하지 않기때문에

scrollview로 감싸주어야한다는 점이다.

 

Item을 담을 XML 파일인 item_view를 만들어준다. item은 textview 3개로 이루어져있다.

<?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="match_parent"
    android:background="#3F51B5">

    <TextView
        android:id="@+id/car_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="20dp"/>

    <TextView
        android:layout_width="1dp"
        android:layout_height="wrap_content"
        android:background="#ffffff"/>

    <TextView
        android:id="@+id/car_engine"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="20dp"/>

</LinearLayout>

item_view를 반복적으로 나타낼 activity_add_view를 만든다.

item_view는 LinearLayout에 담고 이를 스크롤 가능하게하기 위해 scrollView로 감싸준다.

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

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true">
       
        <LinearLayout
            android:id="@+id/addview_container"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    
    </ScrollView>

</LinearLayout>

 

activity에서는 아래의 순서대로 진행된다

1. 리스트로 만들고 싶은 아이템의 리스트를 준비한다.
2. 인플레이터를 준비한다.
3. 인플레이터로 아이템 하나에 해당하는 뷰를 만들어준다.
4. 위에서 만든 뷰를 컨테이너뷰에 붙여준다.

1. Car의 이름과 엔진을 담을 CarForList 클래스를 만들어주고

onCreate 안에서 생성 후 반복문을 이용하여 10개의 CarForList를 만든다.

// 아이템 리스트 준비
        val carList = ArrayList<CarForList>()
        for (i in 1 .. 10){
            carList.add(CarForList(""+i+"번째 자동차", ""+i+"순위 엔진"))
        }

아이템들을 담을 LinearLayout인 addview_container를 container에 가져오고

2. 뷰를 그리기위해 LayoutInflater를 준비한다.

        val container = findViewById<LinearLayout>(R.id.addview_container)
        val inflater = LayoutInflater.from(this@AddViewActivity)

carList 크기만큼 반복해주는데,

3. 인플레이터로 아이템 하나에 해당하는 뷰인 itemView를 가져오고

itemView에 들어있는 car_name과 car_engine도 가져와 carList에 들어있는 값을 넘겨준다.

4. 이후 container에 뷰를 붙여준다.

        for(i in 0 until carList.size) {
            val itemView = inflater.inflate(R.layout.item_view, null)
            val carNameView = itemView.findViewById<TextView>(R.id.car_name)
            val carEngineView = itemView.findViewById<TextView>(R.id.car_engine)

            carNameView.text = carList[i].name
            carEngineView.text = carList[i].engine
            container.addView(itemView)
        }

 

정리된 AddViewctivity는 이런 모습이다.

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

        // 아이템 리스트 준비
        val carList = ArrayList<CarForList>()
        for (i in 1 .. 10){
            carList.add(CarForList(""+i+"번째 자동차", ""+i+"순위 엔진"))
        }

        val container = findViewById<LinearLayout>(R.id.addview_container)
        val inflater = LayoutInflater.from(this@AddViewActivity)
        for(i in 0 until carList.size) {
            val itemView = inflater.inflate(R.layout.item_view, null)
            val carNameView = itemView.findViewById<TextView>(R.id.car_name)
            val carEngineView = itemView.findViewById<TextView>(R.id.car_engine)

            carNameView.text = carList[i].name
            carEngineView.text = carList[i].engine
            container.addView(itemView)
        }
    }
}

class CarForList(val name: String, val engine: String) {

}