Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

ItemTouchHelperでRecyclerViewの入れ替え

More than 3 years have passed since last update.

この記事は、株式会社Y's アドベントカレンダー 25日目の記事になります。
KotlinによるAndroid開発の初歩的な内容になります。

  
RecyclerView内のViewをロングタップで入れ替えたいときの1つのやり方として、ItemTouchHelperを使うと簡単に実装することができるよ!って話をしようと思います。↓みたいなイメージ。

こう並べて
device-2017-12-24-121236.png

ドラッグして
device-2017-12-24-121405.png

指を離すと入れ替わる
device-2017-12-24-121423.png

Viewの配置

RecyclerViewとGridLayoutManagerを使って並べていきます。

    // 30個のViewを作成
    val data = ArrayList<String>()
    for (number in 1..30) data.add(number.toString())

    // GridLayoutManagerで横幅を5に
    val recycler: RecyclerView = findViewById(R.id.recycler)
    val adapter = Adapter(data)
    recycler.adapter = adapter
    recycler.layoutManager = GridLayoutManager(this, 5)

ここまでで、
30個のViewが配置できました。
device-2017-12-24-121236.png

ItemTouchHelperでの入れ替え

ロングタップでの並び変え程度であれば、ItemTouchHelper.SimpleCallbackで簡単に実装できます。

    val touchHelper = ItemTouchHelper(object : ItemTouchHelper.SimpleCallback(
            ItemTouchHelper.UP or ItemTouchHelper.DOWN
         or ItemTouchHelper.RIGHT or ItemTouchHelper.LEFT, 0) {
       // ここで指定した方向にのみドラッグ可能

        override fun onMove(recyclerView: RecyclerView, viewHolder: RecyclerView.ViewHolder, target: RecyclerView.ViewHolder): Boolean {

            val from = viewHolder.adapterPosition
            val to = target.adapterPosition

            val data = adapter.data.removeAt(from)
            adapter.data.add(to, data)

            adapter.notifyItemMoved(from, to)

            return true
        }

        override fun onSwiped(viewHolder: RecyclerView.ViewHolder?, direction: Int) {
            // スワイプで削除する場合はここ
        }
    })

    touchHelper.attachToRecyclerView(recycler)
    recycler.addItemDecoration(touchHelper)
    // ここを忘れると動かないので注意

  
これを付け加えるだけでドラッグでの移動が簡単にできるようになりました!
device-2017-12-24-121405.png
  
device-2017-12-24-121423.png

  

wantan
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away