Here is source code of the Program to Demonstrate Custom Grid View Layout in Android. The program is successfully compiled and run on a Windows system using Eclipse Ide. The program output is also shown below.
Main Activity
package com.example.custom_grid_view; import java.util.ArrayList; import android.app.Activity; import android.content.res.TypedArray; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.os.Bundle; import android.view.View; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.GridView; import android.widget.Toast; public class MainActivity extends Activity { private GridView gridView; private Myadapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); gridView = (GridView) findViewById(R.id.gridView); adapter = new Myadapter(this, R.layout.row_grid, getData()); gridView.setAdapter(adapter); gridView.setOnItemClickListener(new OnItemClickListener() { public void onItemClick(AdapterView<?> parent, View v, int position, long id) { Toast.makeText(MainActivity.this, position + "#Selected", Toast.LENGTH_SHORT).show(); } }); } private ArrayList getData() { final ArrayList imageItems = new ArrayList(); TypedArray imgs = getResources().obtainTypedArray(R.array.image_ids); for (int i = 0; i < imgs.length(); i++) { Bitmap bitmap = BitmapFactory.decodeResource(this.getResources(), imgs.getResourceId(i, -1)); imageItems.add(new item(bitmap, "Image#" + i)); } return imageItems; } }
Myadapter
package com.example.custom_grid_view; import java.util.ArrayList; import android.app.Activity; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ArrayAdapter; import android.widget.ImageView; import android.widget.TextView; public class Myadapter extends ArrayAdapter { private Context context; private int layoutResourceId; private ArrayList data = new ArrayList(); public Myadapter(Context context, int layoutResourceId, ArrayList data) { super(context, layoutResourceId, data); this.layoutResourceId = layoutResourceId; this.context = context; this.data = data; } @Override public View getView(int position, View convertView, ViewGroup parent) { View row = convertView; ViewHolder holder = null; if (row == null) { LayoutInflater inflater = ((Activity) context).getLayoutInflater(); row = inflater.inflate(layoutResourceId, parent, false); holder = new ViewHolder(); holder.imageTitle = (TextView) row.findViewById(R.id.text); holder.image = (ImageView) row.findViewById(R.id.image); row.setTag(holder); } else { holder = (ViewHolder) row.getTag(); } item item = (item) data.get(position); holder.imageTitle.setText(item.getTitle()); holder.image.setImageBitmap(item.getImage()); return row; } static class ViewHolder { TextView imageTitle; ImageView image; } }
item
advertisement
package com.example.custom_grid_view; import android.graphics.Bitmap; public class item { private Bitmap image; private String title; public item(Bitmap image, String title) { super(); this.image = image; this.title = title; } public Bitmap getImage() { return image; } public void setImage(Bitmap image) { this.image = image; } public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } }
Activity_Main
<RelativeLayout 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="#f0f0f0" tools:context=".MainActivity" > <GridView android:id="@+id/gridView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:columnWidth="100dp" android:drawSelectorOnTop="true" android:gravity="center" android:numColumns="auto_fit" android:stretchMode="columnWidth" android:verticalSpacing="5dp" android:background="@drawable/grid_color"> </GridView> </RelativeLayout>
grid.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:background="@drawable/ic_launcher" android:clickable="true" android:focusable="true" android:orientation="vertical" android:padding="5dp" > <ImageView android:id="@+id/image" android:layout_width="100dp" android:layout_height="100dp" > </ImageView> <TextView android:id="@+id/text" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:gravity="center" android:textSize="12sp" > </TextView> </LinearLayout>
You define a colour in drawable folder and apply this to the grid item.
grid_color.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@android:color/black" android:state_pressed="true"/> <item android:drawable="@android:color/black" android:state_selected="true"/> <item android:drawable="@android:color/white"/> </selector>
advertisement
Sanfoundry Global Education & Learning Series – 100+ Java Android Tutorials.
If you wish to look at all Tutorials, go to Java Android Tutorials.
Related Posts:
- Practice Programming MCQs
- Apply for Computer Science Internship
- Check Java Books
- Check Programming Books
- Practice Information Technology MCQs