Hyeyeon blog

[Android] Bottom Sheet Dialog 에 RecyclerView 적용하기 본문

개발/Android

[Android] Bottom Sheet Dialog 에 RecyclerView 적용하기

Hyeyeon.P 2020. 11. 25. 11:00
반응형

1. BottomSheetDialogFragment 를 상속받는 Fragment 생성

1-1. dialog_bottomsheet.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />
</FrameLayout>

1-2. BottomDialogFragment.kt

class BottomDialogFragment(var adapter: BottomDialogAdapter) : BottomSheetDialogFragment() {
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.dialog_bottomsheet,container,false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        view.findViewById<RecyclerView>(R.id.recyclerView).adapter = adapter
    }
}

 

2. 리스트에 사용할 Item class 생성

data class BottomDialogItem(var name: String)

 

3. RecyclerView Adapter 생성

3-1. list_item.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" 
    android:layout_height="60dp">
        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content
            android:layout_gravity="center"
            android:textColor="#000""/>
</FrameLayout>

3-2. BottomDialogAdapter.kt

class BottomDialogAdapter : RecyclerView.Adapter<BottomDialogAdapter.Holder>() {
    private var itemList: MutableList<BottomDialogItem> = ArrayList()

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

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

    override fun onBindViewHolder(holder: Holder, position: Int) {
    	val item = itemList[position]
        holder.bind(item)
    }

    fun setItem(items: MutableList<BottomDialogItem>) {
        if (!items.isNullOrEmpty()) {
            itemList = items
            notifyDataSetChanged()
        }
    }

    inner class Holder(val view: View) : RecyclerView.ViewHolder(view) {
        fun bind(item: BottomDialogItem) {
            view.findViewById<TextView>(R.id.textView).text = item.name
        }
    }
}

 

4. 적용

4-1. Fragment, Adapter 셋팅

val list = mutableListOf(BottomDialogItem("Item 1"),
	BottomDialogItem("Item 2"),
	BottomDialogItem("Item 3"),
	BottomDialogItem("Item 4"))
val adapter = BottomDialogAdapter()
val bottomDialogFragment = BottomDialogFragment(adapter)
adapter.setItem(list)

4-2. BottomSheetDialog 열기

bottomDialogFragment.show(supportFragmentManager, "TAG")

4-3. BottomSheetDialog 닫기

bottomDialogFragment.dismiss()

 

728x90
Comments