Custom Grid View

10:40:00 Dhaval Sodha Parmar 0 Comments

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;
}    
    }
}

0 comments: