본문 바로가기

개발 일기/Android

[Kotlin] 간단 메모장 만들기4 #RecyclerView #Adapter

MainActivity에  RecyclerView가 들어가있는 MainFragment를 넣어서 저장한 리스트를 보여줄 것이다.

 

main_fragment.xml

 

main_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.recyclerview.widget.RecyclerView
    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:id="@+id/MainFragment_RecyclerView_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:listitem="@layout/들어갈 View"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager">
</androidx.recyclerview.widget.RecyclerView>

 

tools:listitem = "여기에 리사이클뷰에 들어갈 뷰를 넣어준다" (위의 요소 하나하나를 담당할 아이템)

 

MainFragment.kt

 

class MainFragment : Fragment() {

    private lateinit var viewModel: MainViewModel

    companion object {
        fun newInstance() = MainFragment()
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
    	//해당 클래스와 연결될 xml레이아웃을 넣어준다
        return inflater.inflate(R.layout.main_fragment, container, false)
    }

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        
        val recyclerView = MainFragment_RecyclerView_view
       
        viewModel = ViewModelProvider(this).get(MainViewModel::class.java)
        viewModel.getAll().observe(this.viewLifecycleOwner, Observer { diary ->
            recyclerView.adapter=MainDiaryAdaper(diary)
        })
    }

}

 

recyclerView에는 위에서 만든 리사이클뷰의 id를 넣어준다.

viewModel에는 이전에 만든 모델을 ViewModelProvider를 통해 넣어준다.

그리고 뷰모델을 옵저버 형식으로 뷰모델이 바뀔때마다 어뎁터를 통해 데이터를 가져오도록 설정한다.

 

처음에 약간 헷갈렸는데 LiveData를 어떤식으로 어뎁터에 넣어야하는지 찾다가보니 라이브 데이터를 관장하는 observe에서 사용하면 어떨까?? 해서 사용해보았더니 성공했다.

 

마지막으로 어뎁터가 필요하다.

 

main_fragment_diary.xml

 

하나를 담당한다

<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_margin="10dp"
    app:cardCornerRadius="5dp">
    
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        
        <TextView
            android:id="@+id/diary_title"
            android:layout_marginLeft="10dp"
            android:layout_marginBottom="10dp"
            android:text="title"
            android:textSize="25dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?attr/textAppearanceListItem" />
            
        <TextView
            android:id="@+id/diary_content"
            android:layout_marginLeft="10dp"
            android:text="content"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:maxLines="2"
            android:textAppearance="?attr/textAppearanceListItem" />
            
    </LinearLayout>
</androidx.cardview.widget.CardView>

 

카드뷰 형식으로 디자인했다.

app:cardCornerRadius="5dp" 이걸로 사각형을 끝의 굴곡을 줄 수 있다.

 

MainDiaryAdapter.kt

 

class MainDiaryAdaper(
    private val diary: List<Diary>
) : RecyclerView.Adapter<MainDiaryAdaper.ViewHolder>() {

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context)
            .inflate(R.layout.main_fragment_diary, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        val item = diary[position]
        holder.title.text = item.title
        holder.content.text = item.content
    }

    override fun getItemCount(): Int = diary.size

    inner class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val title: TextView = view.diary_title
        val content: TextView = view.diary_content

    }
}

 

ViewHolder를 먼저 만들어 준다. 뷰홀더에는 하나를 담당하는 것에 대한 설정을 하는 곳이다. main_fragment_diary.xml 에서 설정한 id를 뷰홀더에서 변수로 설정하고 이 뷰홀더를 onBindViewHolder에서 받아와 해당 id에 대한 컨텐츠를 변경한다.

 

- 결론

이렇게 하면 LiveData를 사용하는 ViewModel에서 데이터를 가져와 RecyclerView에 Adapter를 통해 각각의 데이터를 보여줄 수 있다.