iOSエンジニアのつぶやき

毎朝8:30に iOS 関連の技術について1つぶやいています。まれに釣りについてつぶやく可能性があります。

3分で RecyclerView を作成する

みなさん、AndroidRecyclerView は使っていますか?僕はやっと最近触りはじめました(最近 Android はじめたので)👷‍♀️ なので、使ったついでにその実装方法の手順を今日は簡単に紹介したいと思います!

f:id:yum_fishing:20201119163454p:plain

それではやっていく🛠

1.アプリレベルの Gradle に RecyclerView を追加して、同期します。

implementation 'androidx.recyclerview:recyclerview:1.1.0'

2.今回は、Fragment で使用したいので、Fragment の レイアウトファイルに RecyclerView を追加します。

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/main_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:layout_editor_absoluteX="16dp"
        tools:layout_editor_absoluteY="-70dp" />

3.次に RecyclerView のそれぞれのアイテムに表示するデータを定義します。

class ItemData {
    var title: String? = null
    var description: String? = null
}

4.次にそれぞれのアイテムのレイアウトファイルを作成します。

ここは割愛しますが、前の工程で定義した titledescription を表示できるように、TextView 要素を二つほど追加しておきます。

5.ViewHolder を作成します。

ViewHolder は RecyclerView の1アイテムの View の参照を保持するクラスです。

class MainViewHolder(itemView: View, viewType: Int) : RecyclerView.ViewHolder(itemView) {
    var title: TextView = itemView.findViewById(R.id.hoge_title_text_view) // `4` で定義した TextView
    var description: TextView = itemView.findViewById(R.id.hoge_contents_text_view) // `4` で定義した TextView
}

6.Adapter を作成します。

AdapterRecyclerViewViewHolder の仲介をしてくれるクラスです。

class MainAdapter internal constructor(private var itemDataList: List<ItemData>) : RecyclerView.Adapter<MainViewHolder>() {

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

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

    override fun onBindViewHolder(holder: MainViewHolder, position: Int) {
        val data = itemDataList[position]
        holder.title.text = data.title
        holder.description.text = data.description
    }
}

7.最後に Fragment クラス の onViewCreated で RecyclerView を定義したら完成です。

private var page = 1

//...


override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        val recyclerView = this.activity!!.findViewById<RecyclerView>(R.id.main_recycler_view)
        recyclerView.setHasFixedSize(true) // setHasFixedSize を true にすると、アイテムサイズを固定にするのでパフォーマンスが向上する
        
        val layoutManager: RecyclerView.LayoutManager = LinearLayoutManager(this.activity) // RecyclerView のレイアウトをレスポンシブに管理する
        recyclerView.layoutManager = layoutManager

        mainAdapter = MainAdapter(createItemDataList(page))
        recyclerView.adapter = mainAdapter
    }

    private fun createItemDataList(page: Int): List<ItemData> {
        val dataSet: MutableList<ItemData> = ArrayList()
        var i = 1
        while (i < page * 20) {
            val data = ItemData()
            data.title = "Let's go fishing" + Integer.toString(i)
            data.description = "YamatoOtaka" + Integer.toString(i)
            val add = dataSet.add(data)
            i += 1
        }
        return dataSet
    }

参考

その他の記事

yamato8010.hatenablog.com

yamato8010.hatenablog.com

yamato8010.hatenablog.com