[안드로이드/AdapterView] RecyclerView

RecyclerView

• 안드로이드 5.0 때 추가된 view, Lagacy에 포함되어 있는 리스트뷰나 그리드뷰보다 권장되는 뷰
• ListView, GridView 의 기능을 통합한 View (구현도 비슷)
• Adapter 를 직접 구현해줘야 하므로 구현이 복잡하지만 항목을 자유롭게 구성 가능 (디자인이나 기능을 다양하게 넣고 싶으면 추천) => 항목들을 어떠한 형태로 보여줄 것인가를 반드시 설정해야 화면에 나타남

 

ViewHolder

• 항목 하나를 구성하는 View들의 주소값을 관리하는 클래스
• RecyclerView의 Adapter 클래스 내부에 구현

//VieHolder 클래스 (항목 하나를 구성하기 위해 필요)
        inner class ViewHolderClass(itemView : View) : RecyclerView.ViewHolder(itemView), View.OnClickListener {
            // itemView : 항목 뷰 하나를 매개변수로 받아 사용, 상속받은 부모 클래스에도 전달 필요

            // 항목 View 내부의 View 객체의 주소값을 담음 -> 뷰바인딩으로 처리하는 코드 작성 필요!!
            val rowImageView = itemView.findViewById<ImageView>(R.id.rowImageView)
            val rowTextView = itemView.findViewById<TextView>(R.id.rowTextView)

            override fun onClick(p0: View?) {
                binding.textView.text = data1[adapterPosition] // adapterPosition -> 현재 터치한 항목의 인덱스 번호
            }
        }

Adapter

• RecyclerView.Adapter 클래스를 상속받아 작성
• onCreateViewHolder : ViewHolder 를 생성하고자 할 때 이 메소드 호출 
• onBindViewHolder : 항목을 구성하기 위해 호출. 여기서 ViewHolder가 가지고 있는 View들을 구성

//RecyclerView의 Adapter 클래스
    //항목 터치시 기능 구현 리스너도 어댑터 안에 구현
    inner class RecyclerAdapter : RecyclerView.Adapter<RecyclerAdapter.ViewHolderClass>() {

        // 항목 구성을 위한 ViewHolder 객체가 필요할 때 호출되는 메서드
        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolderClass {
            // 항목으로 사용할 View 객체를 생성
            rowBinding = RowBinding.inflate(layoutInflater) // 항목 뷰 객체
            val holder = ViewHolderClass(rowBinding.root) // 항목 뷰 객체를 뷰홀더 클래스에 넘겨줌
            rowBinding.root.setOnClickListener(holder) // holder에 리스너 구현 -> 각 항목마다 리스너 달아주기

            return holder
        }

        // ViewHolder를 통해 항목을 구성할 때 항목 내의 View 객체의 데이터를 셋팅
        override fun onBindViewHolder(holder: ViewHolderClass, position: Int) {
            holder.rowImageView.setImageResource(imgRes[position])
            holder.rowTextView.text = "${data1[position]} 입니당."
        }

        override fun getItemCount(): Int {
           return imgRes.size
        }
  }

RecyclerView의 항목 배치

• RecyclerView가 ListView 와 GridView를 통합한 뷰인 만큼 리스트뷰처럼 or 그리드뷰처럼 보여줄 것인가를 결정해야 함
  • LinearLayoutManager : ListView 처럼 항목을 보여줌
  • GridLayoutManager : GridView 처럼 항목을 보여줌
  • StaggerGridLayoutManager : GridView 처럼 보여주지만 완전한 그리드가 아닌 각 항목의 크기에 달 유동적으로 조절

//binding.recycler1.layoutManager = LinearLayoutManager(this)
//binding.recycler1.layoutManager = GridLayoutManager(this,3) // 칸수 설정

// 지정한 칸수를 가로기준으로 할지 세로기준으로 할지 정할 수 있음 //모든 그리드의 크기가 다 동일하지 않고 자기 사이즈에 맞게 각각 조절
binding.recycler1.layoutManager = StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.HORIZONTAL)

 

[전체 코드]

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding
    private lateinit var rowBinding: RowBinding

    var imgRes = intArrayOf(R.drawable.ic_launcher_background,R.drawable.ic_launcher_background,
        R.drawable.ic_launcher_background,R.drawable.ic_launcher_background,R.drawable.ic_launcher_background,
        R.drawable.ic_launcher_background,R.drawable.ic_launcher_background,R.drawable.ic_launcher_background,
        R.drawable.ic_launcher_background,R.drawable.ic_launcher_background,R.drawable.ic_launcher_background)

    var data1 = arrayOf("항목1","항목2","항목3","항목4","항목5","항목6","항목7","항목8","항목9","항목10","항목11")

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater) //뷰바인딩 객체
        val view = binding.root //뷰바인딩을 통해 레이아웃과 뷰가 결합 -> .root 를 통해 View 객체만를 뽑아내는(?)
        setContentView(view)

        //val adapter1 = RecyclerAdapter() //adapter 객체 변수 지정해 따로 만들어도 됨
        binding.recycler1.adapter = RecyclerAdapter()
        //binding.recycler1.layoutManager = LinearLayoutManager(this)
        //binding.recycler1.layoutManager = GridLayoutManager(this,3) // 칸수 설정

        // 지정한 칸수를 가로기준으로 할지 세로기준으로 할지 정할 수 있음 //모든 그리드의 크기가 다 동일하지 않고 자기 사이즈에 맞게 각각 조절
        binding.recycler1.layoutManager = StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.HORIZONTAL)

   }

    //RecyclerView의 Adapter 클래스
    //항목 터치시 기능 구현 리스너도 어댑터 안에 구현
    inner class RecyclerAdapter : RecyclerView.Adapter<RecyclerAdapter.ViewHolderClass>() {

        // 항목 구성을 위한 ViewHolder 객체가 필요할 때 호출되는 메서드
        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolderClass {
            // 항목으로 사용할 View 객체를 생성
            rowBinding = RowBinding.inflate(layoutInflater) // 항목 뷰 객체
            val holder = ViewHolderClass(rowBinding.root) // 항목 뷰 객체를 뷰홀더 클래스에 넘겨줌
            rowBinding.root.setOnClickListener(holder) // holder에 리스너 구현 -> 각 항목마다 리스너 달아주기

            return holder
        }

        // ViewHolder를 통해 항목을 구성할 때 항목 내의 View 객체의 데이터를 셋팅
        override fun onBindViewHolder(holder: ViewHolderClass, position: Int) {
            holder.rowImageView.setImageResource(imgRes[position])
            holder.rowTextView.text = "${data1[position]} 입니당."
        }

        override fun getItemCount(): Int {
           return imgRes.size
        }


        //VieHolder 클래스 (항목 하나를 구성하기 위해 필요)
        inner class ViewHolderClass(itemView : View) : RecyclerView.ViewHolder(itemView), View.OnClickListener {
            // itemView : 항목 뷰 하나를 매개변수로 받아 사용, 상속받은 부모 클래스에도 전달 필요

            // 항목 View 내부의 View 객체의 주소값을 담음 -> 뷰바인딩으로 처리하는 코드 작성 필요!!
            val rowImageView = itemView.findViewById<ImageView>(R.id.rowImageView)
            val rowTextView = itemView.findViewById<TextView>(R.id.rowTextView)

            override fun onClick(p0: View?) {
                binding.textView.text = data1[adapterPosition] // adapterPosition -> 현재 터치한 항목의 인덱스 번호
            }
        }

    }

}