Create Options Menu for RecyclerView Item Tutorial

Hello guys, today we will learn about creating options menu for RecyclerView Item in Android. You may have seen this in many apps. Sometimes you need to open an Options Menu for every item in the List. For creating the list we will use RecyclerView. I already posted some RecyclerView Tutorials. This time we will add an option menu to the items. So lets start.

Table of Contents

1 Creating an Android Studio Project
2 Learn Everything About RecyclerView in this Video
3 Adding RecyclerView and CardView
4 Creating RecyclerView
5 Designing List Items
6 Creating Menu Items
7 Creating List Model and Adapter
8 Adding Items to RecyclerView
9 Creating Options Menu for RecyclerView Item
- 9.1 Related

Creating an Android Studio Project

As we always do create a new Android Studio Project.
Select Empty Activity and move ahead.
As usual after project is loaded in Android Studio we will get MainActivity.java and activity_main.xml files (If you haven’t changed the names while creating projects).

Learn Everything About RecyclerView in this Video

If you are not familiar with RecyclerView then you can learn it from Scratch in this playlist. The playlist covers everything from beginning to advanced level.

If you don’t want to learn with video then leave it and lets move ahead on this tutorial.

Adding RecyclerView and CardView

For this List we will use RecyclerView and for the ListItems we will use CardView. Both the components are not available by default. So first we need to add these.
Go to File -> Project Structure -> app -> Dependencies, then click on the + icon from below and select Library Dependency.

Now find ReyclerView and CardView from the list and add them both.

Creating RecyclerView

Now we will create a RecyclerView, so come inside activity_main.xml and create a RecyclerView with the below given code.

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin"

tools:context="net.simplifiedcoding.recyclerviewoptionsmenu.MainActivity">

<android.support.v7.widget.RecyclerView

android:id="@+id/recyclerView"

android:layout_width="match_parent"

android:layout_height="match_parent">

</android.support.v7.widget.RecyclerView>

</RelativeLayout>

Designing List Items

Now its time to design our List Items. So create a new layout resource file inside layout folder. I have created list_items.xml. Copy the following code inside this file, we are using CardView here to design the list item.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical">

<android.support.v7.widget.CardView

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_margin="4dp"

android:elevation="4dp">

<RelativeLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:padding="@dimen/activity_horizontal_margin">

<TextView

android:id="@+id/textViewHead"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="Your Heading"

android:textAppearance="?android:textAppearanceLarge" />

<TextView

android:id="@+id/textViewDesc"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_below="@id/textViewHead"

android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi molestie nisi dui. "

android:textAppearance="?android:textAppearanceMedium" />

<TextView

android:id="@+id/textViewOptions"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentRight="true"

android:layout_alignParentTop="true"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:text="⋮"

android:textAppearance="?android:textAppearanceLarge" />

</RelativeLayout>

</android.support.v7.widget.CardView>

</LinearLayout>

The above code will generate the following ListItem.

Creating Menu Items

Now we need the menu item so first create a new directory inside res and name it menu.
Inside this menu directory create a menu resource file named options_menu.xml. And create the menus you want inside this file. See the following code.

<?xml version="1.0" encoding="utf-8"?>

<item

android:id="@+id/menu1"

android:title="Menu 1" />

<item

android:id="@+id/menu2"

android:title="Menu 2" />

<item

android:id="@+id/menu3"

android:title="Menu 3" />

</menu>

Creating List Model and Adapter

Now lets come to the coding part. First we will create a Model for our RecyclerView. So create a java file named MyList.java.

package net.simplifiedcoding.recyclerviewoptionsmenu;

/**

* Created by Belal on 05/10/16.

public class MyList {

private String head;

private String desc;

//constructor initializing values

public MyList(String head, String desc) {

this.head = head;

this.desc = desc;

}

//getters

public String getHead() {

return head;

}

public String getDesc() {

return desc;

}

Now its time to create our RecyclerView Adapter. So create a java file named CustomAdapter and write the following code.

package net.simplifiedcoding.recyclerviewoptionsmenu;

import android.content.Context;

import android.support.v7.widget.RecyclerView;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

import java.util.List;

/**

* Created by Belal on 29/09/16.

public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.ViewHolder> {

private List<MyList> list;

private Context mCtx;

public CustomAdapter(List<MyList> list, Context mCtx) {

this.list = list;

this.mCtx = mCtx;

}

@Override

public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

View v = LayoutInflater.from(parent.getContext())

.inflate(R.layout.list_items, parent, false);

return new ViewHolder(v);

}

@Override

public void onBindViewHolder(CustomAdapter.ViewHolder holder, int position) {

MyList myList = list.get(position);

holder.textViewHead.setText(myList.getHead());

holder.textViewDesc.setText(myList.getDesc());

holder.buttonViewOption.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

//will show popup menu here

}

});

}

@Override

public int getItemCount() {

return list.size();

}

public class ViewHolder extends RecyclerView.ViewHolder {

public TextView textViewHead;

public TextView textViewDesc;

public TextView buttonViewOption;

public ViewHolder(View itemView) {

super(itemView);

textViewHead = (TextView) itemView.findViewById(R.id.textViewHead);

textViewDesc = (TextView) itemView.findViewById(R.id.textViewDesc);

buttonViewOption = (TextView) itemView.findViewById(R.id.textViewOptions);

}

Adding Items to RecyclerView

Now lets add some items to our RecyclerView. So come inside MainActivity.java and write the following code.

package net.simplifiedcoding.recyclerviewoptionsmenu;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.support.v7.widget.LinearLayoutManager;

import android.support.v7.widget.RecyclerView;

import android.widget.TextView;

import java.util.ArrayList;

import java.util.List;

public class MainActivity extends AppCompatActivity {

//recyclerview objects

private RecyclerView recyclerView;

private RecyclerView.LayoutManager layoutManager;

private RecyclerView.Adapter adapter;

//model object for our list data

private List<MyList> list;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

//initializing views

recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

recyclerView.setHasFixedSize(true);

recyclerView.setLayoutManager(new LinearLayoutManager(this));

list = new ArrayList<>();

//loading list view item with this function

loadRecyclerViewItem();

}

private void loadRecyclerViewItem() {

//you can fetch the data from server or some apis

//for this tutorial I am adding some dummy data directly

for (int i = 1; i <= 5; i++) {

MyList myList = new MyList(

"Dummy Heading " + i,

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi molestie nisi dui."

);

list.add(myList);

}

adapter = new CustomAdapter(list, this);

recyclerView.setAdapter(adapter);

}

Now run the application and you should see the following output.

So by now we have our nice looking RecyclerView. Now we need to create Options Menu for RecyclerView Items. You can see the three vertical dots in every item. We will option the option on the click over this three vertical dot.

Creating Options Menu for RecyclerView Item

Now the last phase of this tutorial is creating Options Menu for RecyclerView Item. So again come inside CustomAdapter.java. And inside onClick() method where we written a comment that will show popup menu here, write the following code.

//creating a popup menu

PopupMenu popup = new PopupMenu(mCtx, holder.buttonViewOption);

//inflating menu from xml resource

popup.inflate(R.menu.options_menu);

//adding click listener

popup.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {

@Override

public boolean onMenuItemClick(MenuItem item) {

switch (item.getItemId()) {

case R.id.menu1:

//handle menu1 click

break;

case R.id.menu2:

//handle menu2 click

break;

case R.id.menu3:

//handle menu3 click

break;

}

return false;

}

});

//displaying the popup

popup.show();

So the final code of the CustomAdapter.java after adding the Options Menu for RecyclerView Item will be.

package net.simplifiedcoding.recyclerviewoptionsmenu;

import android.content.Context;

import android.content.DialogInterface;

import android.support.v7.app.AlertDialog;

import android.support.v7.widget.PopupMenu;

import android.support.v7.widget.RecyclerView;

import android.view.LayoutInflater;

import android.view.MenuItem;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

import java.util.List;

/**

* Created by Belal on 29/09/16.

public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.ViewHolder> {

private List<MyList> list;

private Context mCtx;

public CustomAdapter(List<MyList> list, Context mCtx) {

this.list = list;

this.mCtx = mCtx;

}

@Override

public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

View v = LayoutInflater.from(parent.getContext())

.inflate(R.layout.list_items, parent, false);

return new ViewHolder(v);

}

@Override

public void onBindViewHolder(final CustomAdapter.ViewHolder holder, int position) {

MyList myList = list.get(position);

holder.textViewHead.setText(myList.getHead());

holder.textViewDesc.setText(myList.getDesc());

holder.buttonViewOption.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

//creating a popup menu

PopupMenu popup = new PopupMenu(mCtx, holder.buttonViewOption);

//inflating menu from xml resource

popup.inflate(R.menu.options_menu);

//adding click listener

popup.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {

@Override

public boolean onMenuItemClick(MenuItem item) {

switch (item.getItemId()) {

case R.id.menu1:

//handle menu1 click

break;

case R.id.menu2:

//handle menu2 click

break;

case R.id.menu3:

//handle menu3 click

break;

}

return false;

}

});

//displaying the popup

popup.show();

}

});

}

@Override

public int getItemCount() {

return list.size();

}

public class ViewHolder extends RecyclerView.ViewHolder {

public TextView textViewHead;

public TextView textViewDesc;

public TextView buttonViewOption;

public ViewHolder(View itemView) {

super(itemView);

textViewHead = (TextView) itemView.findViewById(R.id.textViewHead);

textViewDesc = (TextView) itemView.findViewById(R.id.textViewDesc);

buttonViewOption = (TextView) itemView.findViewById(R.id.textViewOptions);

}

Now run the application.

Bingo! Its working absolutely fine.
Still facing problems? Don’t worry you can get my source code from github repository, just go to the link given below.

So thats all for this Options Menu For RecyclerView Tutorial friends. If you are still facing troubles or have any query please don’t hesitate to leave your comments. Thank You 🙂

Belal Khan

Hi, my name is Belal Khan and I am a Google Developers Expert (GDE) for Android. The passion of teaching made me create this blog. If you are an Android Developer, or you are learning about Android Development, then I can help you a lot with Simplified Coding.

Checkout these tutorials as well:

19 thoughts on “Create Options Menu for RecyclerView Item Tutorial”

VIN
October 5, 2016 at 11:59 pm
Very nice tutorial man! What a big help! Thank you.
VINKHIL
November 2, 2016 at 8:31 am
VERY NICE TUTORIAL. HELPED ME ALOT TO UNDERSTAND RECYCLER VIEW..EASY AND VERY WELL DESCRIBED TUTORIAL…LOVED IT..HATS OFF TO U GUYS..KEEP GOING..
MB Obiosio
November 30, 2016 at 6:43 am
How do I update the content of the cardview once in 24 hours? Need just one cardview on the main activity then I want to update the contents once daily.
K. hahaz
December 15, 2016 at 3:41 am
Hello there, wanna ask you something, how to implement recyclerview inside a fragment? any help would be very appreciated 😀
- Anas Lakhani
  March 11, 2020 at 9:23 am
  Its very easy just like activity but you can you context in getActivity method in Context
sharon
December 22, 2016 at 9:09 am
how to design multiple recycleview pls tell me like google playstore
ashna
January 13, 2017 at 7:42 am
Hi there, i have a problem with my listview. it is not appearing one after the other. i have to scroll down to get the other one. Can you tell me where i have gone wrong?
wiz
February 11, 2017 at 7:10 pm
thanks for sharing bro!!! love you
Rahul
July 31, 2017 at 11:14 am
It helped me… thanks
M Vishnuvardhan Reddy
December 5, 2017 at 1:19 pm
TypedValue{t=0x3d=0x3ee “res/drawable/ic_menu more overflow material.xml” a=1 r=0x10803d6}
This error i am getting in my project when i am used pop menu code in adapter. When i run the app it showing unfortunatly stop becoz of the adove error.
saz
December 21, 2017 at 2:23 pm
android:layout_width=”wrap_content” not give perfect click for me
i use this insted
android:layout_width=”40dp”
android:gravity=”center”
CAT
December 28, 2017 at 5:03 am
Hello,
I wish to create Recyclerview with Floating button.
In detail, recyclerview’s each cell will contain an imageview & 1 floating action button. On click floating action button, circular floating action menu will appear.
I tried this using a library of github ie. https://github.com/oguzbilgener/CircularFloatingActionMenu library.
I stuck,where, when I click on 1st item floating button, circular floating menu get visible of 1st cell which is correct . But at the same time when I scroll down, last cell’s circular floating menu is also opened.
I request your guidance, regarding Recyclerview with floating action button & particularly how to handle clicked cell position of resp floating button inside recyclerview.
Thanks in advance.
Seth
February 27, 2018 at 7:49 am
What a nice hack with “⋮” 😀
Anand Mishra
April 18, 2018 at 5:41 am
how to hide Menu 3 for 4th position element in RecyclarView
Julia
July 15, 2018 at 5:33 pm
Very helpful, thank you!
Rudhin
September 9, 2018 at 6:23 pm
Thank you so much, I missed popup.show() all these time. Big saver.
VIvek raj
February 12, 2019 at 12:24 pm
Great, Thanks for sharing.
Pratik
June 27, 2019 at 5:29 pm
Hi, can you guide pls? How can we show options just below the item horizontaly instead of side menu?
Rahat Shah
January 14, 2022 at 2:03 pm
finally, it helped.. thanks

Creating an Android Studio Project

Learn Everything About RecyclerView in this Video

Adding RecyclerView and CardView

Creating RecyclerView

Designing List Items

Creating Menu Items

Creating List Model and Adapter

Adding Items to RecyclerView

Creating Options Menu for RecyclerView Item

Related

Checkout these tutorials as well:

19 thoughts on “Create Options Menu for RecyclerView Item Tutorial”

Leave a Comment Cancel reply