Introduction

---

In this post I show you how to add an OnClickListener to your recyclerview and display data in a new activity.

In the new activity you'll learn to display an image using an ImageView widget and some text using a TextView widget.

All Source Code is available on my Github for free.

App Demo

---

Here's a visual of the simple app we'll be building:

The app will have a total of two activities. MainActivity.java and GalleryActivity.java.

MainActivity will contain a RecyclerView with all the list items.

GalleryActivity will contain an ImageView Widget and a TextView that displays the image of the location and the name respectively.

User's must click on a list item in MainActivity to get to GalleryActivity.

Dependencies

---

We'll start with the dependencies:

We have the RecyclerView support library that's required for using RecyclerViews. The Glide library for retrieving and displaying images from the internet. And a CircleImageView library for displaying circular images.

build.gradle (app file)

Layouts

---

Next we have the layouts.

activity_main.xml

activity_main is simple. There's just a RecyclerView widget with a vertical orientation for holding our list items.

layout_listitem.xml

layout_listitem is the layout for the individual list items that we'll be inflating in the RecyclerView. As you can see there's just a Circular ImageView widget and a TextView where we'll display the name of the location.

activity_gallery.xml

activity_gallery is the layout for GalleryActivity.

Java Classes

---

We have three java classes:

1. RecyclerViewAdapter.java
2. GalleryActivity.java
3. MainActivity.java

RecyclerViewAdapter.java

The RecyclerViewAdapter class is for adapting our individual list items to the RecyclerView list.

It works by saving the widgets in memory using the ViewHolder, then inflating them one-by-one as the user scrolls the list. Only the widgets in view are loaded into the list. This helps to improve app performance.

Notice the OnClickListener in the "OnBindViewHolder" override method. That's what captures the clicks from the user and navigates them to GalleryActivity.

To send the selected list item data to the new activity we've attached some intent extra's. The two intent extras are:

1. image_url
2. image_name

The extras are retrieved in GalleryActivity as you'll see below.

GalleryActivity.java

GalleryActivity comes into view when a user clicks on an item from the RecyclerView.

It's a simple class that displays the image of the location and the name of it.

MainActivity.java

MainActivity is very simple.

We just get some random image urls from the internet and add them to an ArrayList named "mImageUrls." We also add some location names to a separate ArrayList called "mImageNames."

The two ArrayList's are passed to the RecyclerViewAdapter class, then the adapter is set to the RecyclerView in the "initRecyclerView" method.

Internet Permissions

---

Don't forget to add internet permission to the manifest.

Summary

---

Now you can add an OnClickListener to your RecyclerView items and navigate user's to a new activity.

Staying in the Loop

If you want to stay in the loop and get an email when I write new blog posts, Follow me on Instagram or join the CodingWithMitch community on my website. It only takes about 30 seconds to register.

Authors

---

Mitch Tabian

codingwithmitch.com

Software Dev