RecyclerView in PopupMenu

Hey Folks, in this blog i am going to tell you about how to implement RecyclerView in PopupWindow and in case you are new to android and wondering what are these Go check out the official documentation ->> PopupWindow RecyclerView

Here’s a demo what we are going to achieve after this tutorial:-

Download project

Lets get Started.

Boilerplate:
1>Create a new android project.
2>Import RecyclerView Dependancy:
File->Project Structure->Dependencies->Add(+)->Library Dependancy->search for recyclerview->apply.
3>Import CircleImageView Dependancy

 compile 'de.hdodenhof:circleimageview:2.2.0'

Code:
activity_main.xml:
Our layout consists of relativelayout, textview and a imageview clicking on which our PopupWindow will show.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary"
    tools:context="ahuja.shivam.recyclerviewinpopupwindow.MainActivity">

    <android.support.v7.widget.AppCompatImageView
        android:id="@+id/PopupWindowOpener_iv"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="50dp"
        android:layout_marginTop="50dp"
        android:background="@android:color/transparent"
        android:clickable="false"
        android:src="@drawable/ic_arrow_drop_down_black_24dp"
        android:tint="#fff" />

    <android.support.v7.widget.AppCompatTextView
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_marginTop="50dp"
        android:layout_toRightOf="@id/PopupWindowOpener_iv"
        android:background="@android:color/transparent"
        android:gravity="center"
        android:text="PopupMenu"
        android:textColor="@color/white"
        android:textSize="30dp" />
</RelativeLayout>

PopupWIndow layout ->recyclerview.xml:
Create a layout file for popupwindow, in our case we will use RecyclerView.

<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingRight="5dp"
    android:paddingBottom="5dp"
    android:overScrollMode="never">

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

RecyclerView item layout -> listitem_circle.xml:
Create a layout for Recyclerview content, in our case we are using CircleImageView.

<de.hdodenhof.circleimageview.CircleImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="40dp"
    android:layout_height="40dp"
    android:paddingLeft="5dp"
    android:paddingTop="5dp"/>

RecyclerView Adapter->Adapter.java
In this we are setting the color to the respective position.The colors are in hexcode format.

public class Adapter extends RecyclerView.Adapter<Adapter.ViewHolder> {
    Context context;
    ArrayList<String> colors;

    public Adapter(Context context, ArrayList<String> colors) {
        this.context = context;
        this.colors = colors;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        return new ViewHolder(LayoutInflater.from(context).inflate(R.layout.listitem_circle, parent, false));
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        holder.circle.setImageDrawable(new ColorDrawable(Color.parseColor(colors.get(position))));
    }

    @Override
    public int getItemCount() {
        return colors.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        private final CircleImageView circle;

        public ViewHolder(View itemView) {
            super(itemView);
            circle = (CircleImageView) itemView;
        }
    }
}

MainActivity.java:
In our MainActivity we  have implemented the ImageView OnClickListener to show PopupWindow on click. We have also initialized the RecyclerView aka PopupWindow layout and set its layout manager to GridLayoutManger.

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private AppCompatImageView PopupWindowOpener_iv;
    private PopupWindow popupWindow;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        PopupWindowOpener_iv = (AppCompatImageView) findViewById(R.id.PopupWindowOpener_iv);
        PopupWindowOpener_iv.setOnClickListener(this);
        initPopup();
    }

    private void initPopup() {
        //inflate layout and set its layout manager
        RecyclerView recyclerview = 
        (RecyclerView) LayoutInflater.from(this).inflate(R.layout.recyclerview, null);
        recyclerview.setLayoutManager(new GridLayoutManager(this, 6));
        
        //make colors list
        ArrayList<String> colors = new ArrayList<>();
        colors.add("#f29a8b"); colors.add("#ffcc85"); colors.add("#7fdba9");
        colors.add("#80b8d1"); colors.add("#bf93eb"); colors.add("#ed93d6");
        colors.add("#f29a8b"); colors.add("#ffcc85"); colors.add("#7fdba9"); 
        colors.add("#80b8d1"); colors.add("#bf93eb"); colors.add("#ed93d6");
        colors.add("#f29a8b"); colors.add("#ffcc85"); colors.add("#7fdba9");
        colors.add("#80b8d1"); colors.add("#bf93eb"); colors.add("#ed93d6");
        colors.add("#f29a8b"); colors.add("#ffcc85"); colors.add("#7fdba9");
        colors.add("#80b8d1"); colors.add("#bf93eb"); colors.add("#ed93d6");
        colors.add("#f29a8b"); colors.add("#ffcc85"); colors.add("#7fdba9"); 
        colors.add("#80b8d1"); colors.add("#bf93eb"); colors.add("#ed93d6");
        colors.add("#f29a8b"); colors.add("#ffcc85"); colors.add("#7fdba9"); 
        colors.add("#80b8d1"); colors.add("#bf93eb"); colors.add("#ed93d6");
        
        //set Adapter
        final Adapter adapter = new Adapter(this, colors);
        recyclerview.setAdapter(adapter);

        //create popup and setView->> 
        //public PopupWindow (View contentView, int width, int height, boolean focusable)
        popupWindow = new PopupWindow(
                recyclerview,
                RecyclerView.LayoutParams.WRAP_CONTENT,
                RecyclerView.LayoutParams.WRAP_CONTENT, true);
        popupWindow.setElevation(3);
        
    }

    @Override
    public void onClick(View view) {
        //show Popup
        popupWindow.showAsDropDown(PopupWindowOpener_iv);
    }
}

and thats it guys.

Thankyou for reading.

Recent Post

  • Linguistics and NLP: Enhancing AI Chatbots for Multilingual Support

    In today’s interconnected world, businesses and individuals often communicate across linguistic boundaries. The growing need for seamless communication has driven significant advancements in artificial intelligence (AI), particularly in natural language processing (NLP) and linguistics. AI chatbots with multilingual support, are revolutionizing global customer engagement and service delivery. This blog explores how linguistics and NLP are […]

  • How Reinforcement Learning is Shaping the Next Generation of AI Chatbots?

    AI chatbots are no longer just about answering “What are your working hours?” or guiding users through FAQs. They’re becoming conversation partners, problem solvers and even reporting managers and sales agents. What’s driving this transformation? Enter Reinforcement Learning (RL)—a type of machine learning that’s changing the way chatbots think, learn, and respond. At Codalien Technologies, […]

  • AI Chatbots for Sales Team Automation: The Critical Role of AI Sales Assistants in Automating Your Sales Team

    Sales teams are the heart of any successful business, but managing them effectively can often feel like trying to juggle flaming swords. The constant pressure to generate leads, maintain relationships, and close deals leaves your team overwhelmed, spending more time on administrative tasks than actual selling. Here’s where AI-powered sales assistants step in to completely […]

  • Transforming HR with AI Assistants: The Comprehensive Guide

    The role of Human Resources (HR) is critical for the smooth functioning of any organization, from handling administrative tasks to shaping workplace culture and driving strategic decisions. However, traditional methods often fall short of meeting the demands of a modern, dynamic workforce. This is where our Human Resource AI assistants enter —a game-changing tool that […]

  • How Conversational AI Chatbots Improve Conversion Rates in E-Commerce?

    The digital shopping experience has evolved, with Conversational AI Chatbots revolutionizing customer interactions in e-commerce. These AI-powered systems offer personalized, real-time communication with customers, streamlining the buying process and increasing conversion rates. But how do Conversational AI Chatbots improve e-commerce conversion rates, and what are the real benefits for customers? In this blog, we’ll break […]

  • 12 Essential SaaS Metrics to Track Business Growth

    In the dynamic landscape of Software as a Service (SaaS), the ability to leverage data effectively is paramount for long-term success. As SaaS businesses grow, tracking the right SaaS metrics becomes essential for understanding performance, optimizing strategies, and fostering sustainable growth. This comprehensive guide explores 12 essential SaaS metrics that every SaaS business should track […]

Click to Copy