【Android】Groupieの使い方

Groupieに使い方メモ。

Groupieとは

RecyclerViewによる画面レイアウトを簡単に作成することが出来るオープンソース

・公式

GitHub - lisawray/groupie: Groupie helps you display and manage complex RecyclerView layouts.

・app/build.gradle

android {
    dataBinding {
        enabled = true
    }
}

dependencies {
    implementation 'com.xwray:groupie:2.3.0'
    implementation 'com.xwray:groupie-databinding:2.3.0'
}

・activity_mian.xml

ここのRcyclerViewに値をsetする

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    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=".MainActivity" >

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_view_id"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
        app:layout_constraintBottm_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

 app:layoutManager でレイアウトを指定する。

・message_row.xml

ここで、recyclerViewに表示させるアイテムのレイアウトを作る

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
     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=".MainActivity" >

    <TextView
        android:id="@+id/textView_text_id"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="message"
        app:layout_constraintBottm_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

 ・MeesageRow.kt

messaeg_row.xmlに値をsetするクラス

class MessageRow(val message: String): Item<ViewHolder>() {

    override fun bind(viewHolder: ViewHolder, position: Int) {
        viewHolder.itemView.textView_text_id.text = message
    }

    override fun getLayout(): Int {
        return R.layout.messages_row
    }

}

 ・MainActivity.kt

class MainActivity: AppCompatActivity() {

    private lateinit var database: DatabaseReference
    val adapter = GroupAdapter<ViewHolder>()
    val messageList = ArrayList<String>()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        recycler_view_id.adapter = adapter
        recycler_view_id.addItemDecoration(DividerItemDecoration(this, DividerItemDecoration.VERTICAL))

        setData()
    }

    private fun setData() {
        database = Firebase.database.getReference("/messages")
        database.addChildEventListener(object: ChildEventListener {
            override fun onChildAdded(snapshot: DataSnapshot, previousChildName: String?) {
                val message = snapshot.getValue() ?: return
                messageList.add(message.toString())
                refreshList()
            }

            override fun onChildChanged(snapshot: DataSnapshot, previousChildName: String?) {
                val message = snapshot.getValue() ?: return
                messageList.add(message.toString())
                refreshList()
            }

            override fun onChildMoved(snapshot: DataSnapshot, previousChildName: String?) {}
            override fun onChildRemoved(snapshot: DataSnapshot) {}
            override fun onCancelled(snapshot: DataSnapshot) {}
        })
    }

    private fun refreshList() {
        adapter.clear()
        messageList.forEach {
            adapter.add(MessageRow(it))
        }
    }

}

 Firebase Realtime databaseからデータをfetchしてきて、recyclerViewにsetする方法。