Sep 4, 2011

Custom GridView

In order to modify GridView to suit our requirement, we can implement our own adapter extends BaseAdapter.



Custom GridView




Create /res/layout/gridlayout.xml, the layout of individual grid
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>




main.xml, The ayout, it 's same as in the last post Simple GridView example.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
/>
<GridView
android:id="@+id/grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="2"
android:columnWidth="100px"
android:stretchMode="columnWidth"
android:gravity="center"/>
</LinearLayout>




package com.AndroidGridView;

import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;

public class AndroidGridViewActivity extends Activity {

public class MyAdapter extends BaseAdapter {

final int NumberOfItem = 30;
private Bitmap[] bitmap = new Bitmap[NumberOfItem];

private Context context;
private LayoutInflater layoutInflater;

MyAdapter(Context c){
context = c;
layoutInflater = LayoutInflater.from(context);

//init dummy bitmap,
//using R.drawable.icon for all items
for(int i = 0; i < NumberOfItem; i++){
bitmap[i] = BitmapFactory.decodeResource(context.getResources(), R.drawable.icon);
}
}

@Override
public int getCount() {
// TODO Auto-generated method stub
return bitmap.length;
}

@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return bitmap[position];
}

@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub

View grid;
if(convertView==null){
grid = new View(context);
grid = layoutInflater.inflate(R.layout.gridlayout, null);
}else{
grid = (View)convertView;
}

ImageView imageView = (ImageView)grid.findViewById(R.id.image);
imageView.setImageBitmap(bitmap[position]);

return grid;
}

}

GridView gridView;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
gridView = (GridView)findViewById(R.id.grid);

MyAdapter adapter = new MyAdapter(this);
gridView.setAdapter(adapter);
}

}





next:
- Custom GridView II, with ImageView and TextView



1 comment:

  1. Hey, Your site is really valuable. This article helps me lot. Please keep up the good work

    ReplyDelete

Infolinks In Text Ads