How to implement swipe to reveal actions in a RecyclerView in Kotlin Android

How to implement swipe to reveal actions in a RecyclerView in Kotlin Android.

Here's a step-by-step tutorial on how to implement swipe to reveal actions in a RecyclerView in Kotlin Android.

Step 1: Set up your project

Create a new Android project in Android Studio. Choose an appropriate name and package for your project.

Step 2: Add RecyclerView dependency

Open the app-level build.gradle file and add the RecyclerView dependency to the dependencies block:

dependencies {
    implementation 'androidx.recyclerview:recyclerview:1.2.1'
}

Sync the project to download the RecyclerView library.

Step 3: Create a layout for the RecyclerView item

Create a new layout file for the RecyclerView item. This layout will define the UI of each item in the list. For example, you can create a file called item_layout.xml with the following content:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <!-- Add your item UI components here -->

</LinearLayout>

Step 4: Create the RecyclerView adapter

Create a new Kotlin class called MyAdapter that extends RecyclerView.Adapter. This adapter will handle the data binding between the data set and the RecyclerView.

class MyAdapter(private val items: List<String>) : RecyclerView.Adapter<MyAdapter.ViewHolder>() {

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

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        val item = items[position]
        // Bind data to UI components of the item layout
    }

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

    inner class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        // Declare UI components of the item layout here
    }
}

Step 5: Implement swipe to reveal actions

In order to implement swipe to reveal actions, we need to add a touch listener to the RecyclerView item layout. Open the ViewHolder inner class in the MyAdapter class and add the following code:

inner class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
    
    private val swipeRefreshLayout: SwipeRefreshLayout = itemView.findViewById(R.id.swipeRefreshLayout)
    private val contentView: View = itemView.findViewById(R.id.contentView)
    private val actionView: View = itemView.findViewById(R.id.actionView)

    init {
        swipeRefreshLayout.setOnRefreshListener {
            // Perform the action when the user swipes
            // For example, you can delete the item from the list
        }
        
        contentView.setOnTouchListener(object : View.OnTouchListener {
            private val gestureDetector = GestureDetector(itemView.context, object : GestureDetector.SimpleOnGestureListener() {
                override fun onFling(
                    e1: MotionEvent?,
                    e2: MotionEvent?,
                    velocityX: Float,
                    velocityY: Float
                ): Boolean {
                    val distanceX = e2?.x?.minus(e1?.x ?: 0f) ?: 0f
                    if (distanceX < -ACTION_THRESHOLD) {
                        // User swiped left, reveal the action view
                        actionView.visibility = View.VISIBLE
                    } else if (distanceX > ACTION_THRESHOLD) {
                        // User swiped right, hide the action view
                        actionView.visibility = View.GONE
                    }
                    return super.onFling(e1, e2, velocityX, velocityY)
                }
            })
            
            override fun onTouch(v: View?, event: MotionEvent?): Boolean {
                gestureDetector.onTouchEvent(event)
                return true
            }
        })
    }
}

Note: In the code above, ACTION_THRESHOLD is a constant value that determines the minimum distance the user needs to swipe to trigger the action. You can adjust this value based on your requirements.

Step 6: Set up the RecyclerView in the activity

Open your activity layout file (e.g., activity_main.xml) and add a RecyclerView:

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

In your activity class, find the RecyclerView and set up the adapter:

class MainActivity : AppCompatActivity() {

    private lateinit var recyclerView: RecyclerView

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

        recyclerView = findViewById(R.id.recyclerView)
        recyclerView.layoutManager = LinearLayoutManager(this)
        recyclerView.adapter = MyAdapter(getData())
    }
    
    private fun getData(): List<String> {
        // Return your list of data here
    }
}

Step 7: Run the app

Run the app on an emulator or a physical device. You should now be able to swipe left or right on the RecyclerView items to reveal or hide the action view.

That's it! You have successfully implemented swipe to reveal actions in a RecyclerView using Kotlin in Android.