泥部

Androidアプリ開発の入門サイトです。

【Android】RecyclerViewを実装する

f:id:ayb:20181015200734j:plain

こんばんは。 @okuzawats です。今回は、何度実装してもソラで実装できないRecyclerViewの実装方法をメモしておきます。

まずはapp/build.gradleに以下の記述を追加して、RecyclerViewを使えるようにします。記述を追加したら忘れずにSyncします。

dependencies {
    // RecyclerView
    implementation 'com.android.support:recyclerview-v7:28.0.0'
}

これでRecyclerViewを使えるようになったかと思いますので、レイアウトにRecyclerViewを追加します。

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

RecyclerViewでリスト表示する個々のレイアウトファイルを作ります。今回はlist_item.xmlというファイル名で作りました。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

個々のレイアウトファイルに対応するデータクラスを定義します。今回はItem.ktというファイル名で作りました。

data class Item(val text: String)

次に、ViewHolderを実装します。今回は、Activityのインナークラスとして実装しましたが、適宜クラスに切り出しましょう。ここで参照しているtextViewは、list_item.xml内に定義されているものです。

inner class RecyclerViewHolder(view: View): RecyclerView.ViewHolder(view) {
    val textView = view.textView
}

次に、Adapterを実装します。こちらもActivityのインナークラスとして実装していますが、適宜クラスに切り出します。onBindViewHolderにおいて、RecyclerViewに表示するデータとViewHolderを結びつけています。

inner class RecyclerAdapter(private val items: List<Item>): RecyclerView.Adapter<RecyclerViewHolder>() {
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.list_item, parent, false)
        return RecyclerViewHolder(view)
    }

    override fun getItemCount(): Int = items.count()

    override fun onBindViewHolder(holder: RecyclerViewHolder, position: Int) {
        val item = items.get(position)
        holder.textView.text = item.text
    }
}

ここまできたら、あとはデータを取得してAdapterに渡してあげればOKです。また、LayoutManagerが何種類かあるので、用途に応じて設定します。個々のレイアウトのサイズが同じ場合は、setHasFixedSizeにtrueを渡してあげるとパフォーマンスが良くなります。

val items = listOf(
        Item("hoge"),
        Item("fuga"),
        Item("piyo")
)

recyclerView.adapter = RecyclerAdapter(items)
recyclerView.layoutManager = LinearLayoutManager(this)
recyclerView.setHasFixedSize(true)

以上で、RecyclerViewにデータを表示することができるようになったのではないかと思います。