Custom Grid View

This example shows custom Grid View, have a ImageView and TextView in each grid like this: 

1) Create a folder /res/drawable to hold the different pictures.
2) Modify main.xml to have a GridView : 

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

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

android:id="@+id/gridView1" 

android:layout_height="fill_parent"

android:horizontalSpacing="5px"

android:verticalSpacing="5px"

android:stretchMode="columnWidth"

android:columnWidth="60px"

android:numColumns="3"

android:gravity="center"

/>

Now,
3)  Implement mygrid.xml in folder /res/layout/, it's the layout of individual grid. 

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

 <LinearLayout 

  android:id="@+id/linearLayout1"

  android:layout_width="fill_parent"

  android:layout_height="fill_parent"

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

  android:orientation="vertical">

    

 <ImageView 

     android:layout_height="100px" 

     android:id="@+id/imageView1"

     android:layout_width="100px"

     android:background="#444444"></ImageView>

    

    <TextView 

     android:id="@+id/textView1"

     android:layout_width="wrap_content"

     android:layout_height="wrap_content"

     android:gravity="center"

     android:textStyle="bold"

     android:layout_gravity="center"

     android:textColor="#669966"></TextView>    

</LinearLayout>

Next,
4) Modify the main Java code in src/<Packge-Name>/mygridActivity.java.

package com.GridDemo;

import android.app.Activity;

import android.content.Context;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.AdapterView;

import android.widget.BaseAdapter;

import android.widget.GridView;

import android.widget.ImageView;

import android.widget.TextView;

import android.widget.Toast;

import android.widget.AdapterView.OnItemClickListener;

public class mygridActivity  extends Activity {   

private GridView g;

Integer[ ] img = {

                                        R.drawable.icon_guidelines_logo,

                                        R.drawable.launcher_light,

R.drawable.menu_light,

                                        R.drawable.launcher_structure,

R.drawable.menu_style,

                                        R.drawable.tab_unselected_light,

R.drawable.statusbar_style,

                                        R.drawable.tab_style_unselected,

R.drawable.tab_icon_unselected

                                 };

String[ ] labels = {  "Android", "Calender", "Sweety's Home", 

                                        "New Calender","Home","Star","GTalk","Mick","No Entry"  } ;

/** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

        

        g = (GridView)findViewById(R.id.gridView1);

        g.setAdapter(new ImageAdapter(this));

        

        g.setOnItemClickListener(new OnItemClickListener() {

     public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,

     long arg3) {

         

        Toast.makeText(getBaseContext(), "Pic : " +(arg2+1), 1).show();

     }

           } );

        

    }    

    public class ImageAdapter extends BaseAdapter

    {

     Context mGrid;

public ImageAdapter(GridDemo g) {

this.mGrid = g;

}

public int getCount() {

return img.length;

}

public Object getItem(int position) {

return position;

}

public long getItemId(int position) {

return position;

}

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

View view;

if(convertView == null)

{

view = new View(mGrid);

LayoutInflater Inf = getLayoutInflater();

view = Inf.inflate(R.layout.myfile, null);

}

else

{

view = convertView;

}

ImageView iv = (ImageView)view.findViewById(R.id.imageView1);

TextView tv = (TextView) view.findViewById(R.id.textView1);

iv.setImageResource(img[position]);

        tv.setText(labels[position]);

return view;

}    

    }

}