AndroidのRecyclerViewで子要素を中心にスクロールさせる
とあるAndroid 案件で使ったRecyclerView の使い方のメモ。
RecyclerView でスクロールを行った時に、子要素を常に中心に配置するように補正する方法
TL;DR
LinearSnapHelper を使えば良い
全文は GitHub 参照
やりたいこと
RecyclerView でスクロールした時に、一番中心に近い要素をいい感じに中心に寄せてとめて欲しい。
通常
やりたいこと
方法: LinearSnapHelper を使う
LinearSnapHelper のインスタンスを作成して、それを該当の RecyclerView に設定するだけ。とても簡単です。
|
1 2 3 4 |
// To make item center val snapHelper = LinearSnapHelper() snapHelper.attachToRecyclerView(recyclerView) |
RecyclerView で要素をスナップ（特定の要素にフォーカスするような動き）をさせるには、SnapHelper を使います。LinearSnapHelper は、その実装クラスの一つ。同じく SnapHelper の実装クラスとして、ViewPager と同じような動きをする PagerSnapHelper というものもあります。
これで、ひとまずやりたいことはできるのですが、最初と最後の要素はこんな感じで端にあるままです。
もし端の要素もどうしても中心にしたい！という場合、RecyclerView に ItemDecoration を追加して最初と最後の要素だけマージンを追加してやればできました。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
// Force to center even if the item is first or last. recyclerView.addItemDecoration(object: RecyclerView.ItemDecoration() { override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State) { val edgeMargin = (parent.width - view.layoutParams.width) / 2 val position = parent.getChildAdapterPosition(view) if (position == 0) { outRect.left = edgeMargin } if (position == state.itemCount - 1) { outRect.right = edgeMargin } } }) |
他にも方法ありそう。
さいごに
簡単なことだけど忘れそうなのでメモ
確認環境
- Android Studio 3.3.1
- Nexus5X Android9 (Emulator)
- ‘com.android.support:recyclerview-v7:28.0.0’
最後まで読んでいただきありがとうございます。 このブログを「いいな」と感じていただけましたら、Twiter にてフォローいただけるとうれしいです。ブログ更新情報などもお届けします。
Follow @ryuta461
この記事をシェアする