Kotlin GridView example: Show Item Details | Android

In previous post, we had known how to show list of Items using GridView. This tutorial shows you way to implement onClick Event on Item and come into its details.

Related Post: Kotlin ListView example | Android

I. Technologies

– Android Studio 3
– Kotlin 1.1.51

II. Overview

1. Goal

We will build an example that uses GridView to show list of food items like this:

When clicking on any Item, we can go to its details in new Activity:

2. Project Structure


In this example, we add FoodDetails Activity class. Clicking on any Item in MainActivity will direct us to FoodDetails (with image, name, description).

III. Practice

1. Set up Project

– Create New Project:

– Add each item insides sample_images to res/drawable folder.

– Add FoodDetails Activity:

2. Layout
2.1 Container Layout

Open res/layout/activity_main.xml file:

2.2 Item Layout

Add food_entry.xml file to res/layout folder:

2.3 Item Details Layout

Open res/layout/activity_food_details.xml file:

3. Logic
3.1 Item Class

This class represents data of each Food Item:

3.2 Main Activity Class

We will:
– Create a BaseAdapter subclass.
– Set an instance of this class as data provider to the GridView.
– Return each cell’s view from getView() on your adapter.
– Add OnClickListener for Item’s image.

3.2 Item Details Activity Class

IV. Source Code


By grokonez | December 3, 2017.

Last updated on July 13, 2018.

Related Posts

1 thought on “Kotlin GridView example: Show Item Details | Android”

Got Something To Say:

Your email address will not be published. Required fields are marked *