Custom GridView

GridView is a ViewGroup that displays items in a two-dimensional, scrollable grid. The grid items are automatically inserted to the layout using an Adapter.

Here we are going to create an app with grid view.

• Start a new project
• Open activity_main and add gridview widget

 <GridView      
     android:id="@+id/gridview"   
     android:layout_width="fill_parent"   
     android:layout_height="fill_parent"   
     android:columnWidth="90dp"  
     android:gravity="center"   
     android:horizontalSpacing="10dp"   
     android:numColumns="auto_fit"   
     android:stretchMode="columnWidth"  
     android:verticalSpacing="10dp" />  

• Since we are creating custom gridview, design a layout for single item in the grid.
• Here in my app I am creating single item with an Icon and a label.

 <?xml version="1.0" encoding="utf-8"?>  
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent"  
   android:gravity="center"  
   android:orientation="vertical" >  
   <ImageView  
     android:id="@+id/iv_icon"  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:src="@drawable/ic_launcher" />  
   <TextView  
     android:id="@+id/tv_label"  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:text="Large Text"  
     android:textAppearance="?android:attr/textAppearanceLarge" />  
 </LinearLayout>  

• Open MainActivity.java and insert the following code for the onCreate() method:

 GridView gridview = (GridView) findViewById(R.id.gridview);  
   gridview.setAdapter(new GridAdapter(this));  
   gridview.setOnItemClickListener(new OnItemClickListener() {  
    public void onItemClick(AdapterView<?> parent, View v,  
      int position, long id) {  
     Toast.makeText(getApplicationContext(), "Position " + position,  
       Toast.LENGTH_SHORT).show();  
    }  
   });  

•  create an GridAdapter that extends BaseAdapter

 package com.sjk.gridviewsample;  
 import android.content.Context;  
 import android.view.LayoutInflater;  
 import android.view.View;  
 import android.view.ViewGroup;  
 import android.widget.BaseAdapter;  
 import android.widget.ImageView;  
 import android.widget.TextView;  
 public class GridAdapter extends BaseAdapter {  
  static final String[ ] GRID_DATA = new String[] {  
   "One" ,  
   "Two",  
   "Three" ,  
   "Four",  
   "Five" ,  
   "Six",  
   "Seven",  
   "Eight",     
   "Nine" ,  
   "Ten"  
  };  
  Context context;  
  public GridAdapter(Context context) {  
   super();  
   this.context = context;  
  }  
  @Override  
  public int getCount() {  
   // TODO Auto-generated method stub  
   return GRID_DATA.length;  
  }  
  @Override  
  public Object getItem(int position) {  
   // TODO Auto-generated method stub  
   return null;  
  }  
  @Override  
  public long getItemId(int position) {  
   // TODO Auto-generated method stub  
   return 0;  
  }  
  @Override  
  public View getView(int position, View convertView, ViewGroup parent) {  
   // TODO Auto-generated method stub  
   View grid;  
   LayoutInflater inflater=(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
   if(convertView==null){  
    grid=new View(context);  
    grid=inflater.inflate(R.layout.single_tile, null);  
    ImageView imageview=(ImageView)grid.findViewById(R.id.iv_icon);  
    TextView textview=(TextView)grid.findViewById(R.id.tv_label);  
    imageview.setBackgroundResource(R.drawable.ic_launcher);  
    textview.setText(GRID_DATA[position]);  
   }  
   else {  
    grid = (View) convertView;  
   }  
   return grid;  
  }  
 }  

• Run the application.
• Screenshot

You can download application from here