Android Customized GridView

In the Previous tutorial we have seen an example of Simple GridView , in this post we will see about how to customized the grid items in gridview .



Lets See An Example

Project Detail

Project Name	CustomGrid
Package	com.pavan.customgrid
Minimum SDK	API 8
Target SDK	API 17
Theme	Holo Light with Dark Action Bar

1. XML Layout

file:-grid_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<GridView 
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/gridView1"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:columnWidth="150dp"
     android:gravity="center"
     android:numColumns="auto_fit"
     android:padding="5dp"
     android:stretchMode="columnWidth" >
</GridView>

file:-grid_item.xml

<?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:padding="15dp"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:layout_gravity="center"
        android:textSize="20dp"
        />

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:src="@drawable/ic_launcher" />

</LinearLayout>

2. Activity

file:-Grid_activity.java

package com.pavan.customgrid;

import android.os.Bundle;
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.TextView;

public class Grid_activity extends Activity {
    GridView gv;
    String[] data = new String[] { "samsung", "lg", "htc", "moto" };

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.grid_activity);
        gv = (GridView) findViewById(R.id.gridView1);
        gv.setAdapter(new Custom_view(this));
    }
    public class Custom_view extends BaseAdapter {
        Context ctx;
        Custom_view(Context ctx) {
            this.ctx = ctx;
        }
        public int getCount() {
         return data.length;
       }
     public Object getItem(int position) {
              return null;
        }
      public long getItemId(int position) {
            return 0;
       }
        public View getView(int position, View convertView, ViewGroup parent) {

         View myview = convertView;
           if (myview == null) {
                LayoutInflater li = getLayoutInflater();
                myview = li.inflate(R.layout.grid_item, null);
                TextView tv = (TextView) myview.findViewById(R.id.textView1);
                ImageView iv = (ImageView) myview.findViewById(R.id.imageView1);
              if (data[position].equals("samsung")) {
                 tv.setText(data[position]);
                   iv.setImageResource(R.drawable.samsung);
                } else if (data[position].equals("lg")) {
                    tv.setText(data[position]);
                    iv.setImageResource(R.drawable.lg);
                } else if (data[position].equals("htc")) {
                    tv.setText(data[position]);
                    iv.setImageResource(R.drawable.htc);
                } else if (data[position].equals("moto")) {
                    tv.setText(data[position]);
                    iv.setImageResource(R.drawable.moto);
                }
            }
            return myview;
        }
    }
}

3. RUN