Android GridView

 Grid-view is considered to be the most useful layout in android for displaying items in Two-dimensional grid.
The following Example shows a simple layout designed with Grid view.
1. Create new Android project.
2. create an xml layout in res/layout/griditem.xml

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

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

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:orientation="vertical"

    android:padding="5dp" >

     <ImageView
        android:id="@+id/grid_item_image"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="10px"
        android:layout_gravity="center"
        android:src="@drawable/lieutenant" >
    </ImageView>

    <TextView
        android:id="@+id/grid_item_label"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5px"
        android:text="Lieutenant"
        android:gravity="center"
        android:textSize="16sp"
        android:textStyle="bold" >
    </TextView>

</LinearLayout>

3. Edit you activity_main.xml with below code:

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

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:background="#004c00"

    android:orientation="vertical"

    android:paddingBottom="@dimen/activity_vertical_margin"

    android:paddingLeft="@dimen/activity_horizontal_margin"

    android:paddingRight="@dimen/activity_horizontal_margin"

    android:paddingTop="@dimen/activity_vertical_margin"

    tools:context="skk.simple.gridview.MainActivity" >

     <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/gridView1"
        android:layout_alignParentTop="true"
        android:background="#fff"
        android:gravity="center"
        android:padding="5dp"
        android:textColor="#000"
        android:text="Pakistan Army Officer&apos;s Rank"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <GridView

        android:id="@+id/gridView1"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:columnWidth="100dp"

        android:gravity="center"

        android:numColumns="auto_fit"

        android:stretchMode="columnWidth" >

    </GridView>

</LinearLayout>

 4. Edit MainActivity.java

 

package skk.simple.gridview;

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.TextView;

import android.widget.Toast;

public class MainActivity extends Activity {

         GridView gridView;

         private final String[] ranks = { "Field marshal (5-Star)",

                          "General (4-Star)", "Lieutenant General (3-Star)",

                          "Major General (2-Star)", "Brigadier (1-Star)", "Colonel",

                          "Lieutenant Colonel", "Major", "Captain", "Lieutenant",

                          "2nd Lieutenant" };

         private int[] imgs = { R.drawable.fieldmartial, R.drawable.general,

                          R.drawable.lieutenantgeneral, R.drawable.majorgeneral,

                          R.drawable.brigadier, R.drawable.colonel, R.drawable.ltcolonel,

                          R.drawable.major, R.drawable.captain, R.drawable.lieutenant,

                          R.drawable.secondlieutenant };

         @Override

         public void onCreate(Bundle savedInstanceState) {

                 super.onCreate(savedInstanceState);

                 setContentView(R.layout.activity_main);

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

                 gridView.setAdapter(new GridAdapter(this, ranks, imgs));

                 gridView.setOnItemClickListener(new OnItemClickListener() {

                          public void onItemClick(AdapterView<?> parent, View v,

                                            int position, long id) {

                                   Toast.makeText(

                                                    getApplicationContext(),

                                                    ((TextView) v.findViewById(R.id.grid_item_label))

                                                                      .getText(), Toast.LENGTH_SHORT).show();

                          }

                 });

         }

}

 5. Create a Java Class, GridAdapter.java

package skk.simple.gridview;

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 {

         private Context context;

         private final String[] ranks;

         private int[] rankImages;

         public GridAdapter(Context context, String[] rank, int[] images) {

                 this.context = context;

                 this.ranks = rank;

                 this.rankImages = images;

         }

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

        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View gridView;
        TextView textView = null;
        ImageView imageView = null;

        gridView = new View(context);

        // get layout from griditem.xml
        gridView = inflater.inflate(R.layout.griditem, null);

        // set value into textview
        textView = (TextView) gridView.findViewById(R.id.grid_item_label);

        // set image based on selected text
        imageView = (ImageView) gridView.findViewById(R.id.grid_item_image);

        textView.setText(ranks[position]);
        imageView.setImageResource(rankImages[position]);
        return gridView;
        }

         @Override

         public int getCount() {

                 return ranks.length;

         }

         @Override

         public Object getItem(int position) {

                 return null;

         }

         @Override

         public long getItemId(int position) {

                 return 0;

         }

}

  6. Run Project

      Screen Shots :)

Download Source code :

 ---> Thanks for Reading <---