GridView is one of the most useful and important layouts in android. GridView layout is used to display data in a two-dimensional scrolling grid. GridView layout can be used in the application like news reader, image viewer, music app, note taking app, etc. In this tutorial, you will learn to make custom grid view and to display images and text in GridView. When an item is clicked (selected), a toast message will display the text of the image title.

GridView is a subclass of AdapterView, which retrieves data from an external source. In this grid view example, you will learn to make your own android application using GridView layout with simple steps.

Simple Android GridView Tutorial with Example
Display Images in Android GridView
Android ListView with Image and Text

Android Example: How to Display Images and Text in Custom GridView

Following are the simple steps to display images and text in android grid view. Let’s start by creating a new android project with project name Android GridView Example.

XML Layout File

Open your app XML layout file and add GridView layout then add the attributes like id, columnWidth, numColumns, etc. Following is the complete content of gridview_image_text_example.xml file.

res/layout/ gridview_image_text_example.xml

Again create a new XML layout file for custom grid view layout design and add an ImageView and TextView inside LinearLayout. Give a unique id for both image view and text view and fixed dp for ImageView width and height. Following is the complete content of gridview_layout.xml file.


Java Activity File

Create two new java activity files CustomGridViewActivity.java & GridViewImageTextActivity.java and add strings and images in GridViewImageTextActivity.java file to display in grid view. Following is the complete code of two java file.



Android Example: How to Display Images and Text in Custom GridView

Now, run your Android GridView with Image and Text application and click on the grid items, you will see a toast message with grid item title text. This app will look like above screenshot.

Post a Comment

Powered by Blogger.