Android Custom GridView with Images and Text

In our previous tutorial we saw Custom ListView with Images and Text. Similar to ListView Android provides another mechanism called GridView which will show data as Grid.

GridView is widely used in Home Screen apps (Android Launcher) where installed apps are populated using a Custom Adapter and GridView.

Apart from Android Launchers there are other apps such as Amazon, Ebay, Flipkart, Google Play Store which uses Customized GridView.

In this tutorial I will show you custom GridView, you can make your own Simple GridView if you want just follow my Simple ListView Tutorial.

Now Let’s jump to the coding part.

1> Create a New Project
2> Provide your new application a Name
3> Check Phone & Tablet, From Drop down Select Minimum SDK Android 2.3 GingerBread
4> Select Blank Activity
5> Do not change name of your Activity or XML, let it be as it is and click on finish

Here is the code for activity_main.xml

 

Now create another layout xml file in res>layout folder name it custom_grid.xml

Now we need to create a Java file which will handle our customlistview.xml file (just like MainActivity.java handles activity_main.xml)

Create new Java class in Java folder > package (Not android test package), name it CustomListAdapter.java (No need to add extension).

I have put necessary comments read if you are confused.

 

Here is the code for CustomAdapter.java

 

Finally here is the code for MainActivity.java

 

That’s all we need to do.

We don’t need to make any changes in our manifest.xml and build.gradle files so I’m not including it.

If u have already setup an Emulator or have a Android phone connected in USB Debugging mode just press Alt + Shift +F10 to run app.

You can follow this link to setup Emulator or Device.

Leave a Reply

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