In this article I am going to explain how to create GridView in an Android application. In GridView multiple images will display and when an image is selected, a toast message will display the position of the image.

Create a project

•  Start a new project named GridViewDemo.
• Save the image files (image0.jpg, image1.jpg, image2.jpg, image3.jpg, image4.jpg, image5.jpg, image6.jpg, image7.jpg) into the project's res/drawable/ directory.
• Open the main.xml file inside the res/layout/. Insert the following:

<?xml  version="1.0" encoding="utf-8"?>

<GridView  xmlns:android="http://schemas.android.com/apk/res/android"      

             android:id="@+id/gridview"    

            android:layout_width="fill_parent"     

             android:layout_height="fill_parent"    

             android:columnWidth="90dp"    

             android:numColumns="auto_fit"    

             android:verticalSpacing="10dp"    

             android:horizontalSpacing="10dp"    

             android:stretchMode="columnWidth"    

           android:gravity="center"/>

·    Create a new class called ImageAdapter that extends BaseAdapter:

import android.content.Context;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseAdapter;

import android.widget.GridView;

import android.widget.ImageView;

  

public class ImageAdapter  extends BaseAdapter

{

        private Context  mContext;

        private Integer[]  mThumbIds = {R.drawable.image0,R.drawable.image1, 

              R.drawable.

             R.drawable.image2,R.drawable.image3,R.drawable.image4,R.drawable.image5,

             R.drawable.image6,R.drawable.image7};

        public ImageAdapter(Context c)

       {

               mContext=c;

       }

        public int getCount()

       {

               return mThumbIds.length;

       }

        public Object getItem(int position)

       {

              return null;

       }

        public long getItemId(int position)

       {

               return 0;

       }

        public View getView(int position, View convertView, ViewGroup parent)

       { 
              ImageView imageView; 
               if(convertView==null) 
              { 
                     imageView=new ImageView(mContext); 
                     imageView.setLayoutParams(new GridView.LayoutParams(85,85)); 
                     imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); 
                     imageView.setPadding(8, 8, 8, 8); 
              } 
               else 
              { 
                     imageView=(ImageView)convertView; 
              } 
              imageView.setImageResource(mThumbIds[position]); 
               return imageView; 
       } 
}

·     Open GridViewDemo.java and insert the following code:

import android.app.Activity; 
import android.os.Bundle; 
import android.view.View; 
import android.widget.AdapterView; 
import android.widget.AdapterView.OnItemClickListener; 
import android.widget.GridView; 
import android.widget.Toast; 

public class GridViewDemo extends Activity { 

     @Override 
     public void onCreate(Bundle savedInstanceState) 
    { 
         super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
        GridView gridview = (GridView) findViewById(R.id.gridview); 
        gridview.setAdapter(new ImageAdapter(this)); 
         gridview.setOnItemClickListener(new OnItemClickListener() { 
         public void onItemClick(AdapterView<?> parent, View v, int position, long id) 
        { 
               Toast.makeText(GridViewDemo.this, "" + (position+1), 
                                                          Toast.LENGTH_SHORT).show(); 
        } 
        }); 
    } 
}

·     Run the application.

Your grid layout should look something like this:

When you select an image the toast message display the position of a selected image.