First we need to create our custom GridView, we used the package com.almondmendoza.myGridView
public class MyCustomGridView extends GridView implements OnItemClickListener{ private Listener mListener; public MyCustomGridView(Context context, AttributeSet attrs) { super(context, attrs); setOnItemClickListener(this); } public void onItemClick(AdapterView parent, View v, int position, long id) { if (mListener != null) { mListener.onClick(position); } } public void setListener(Listener l){ mListener = l; } public interface Listener{ void onClick(int position); } }
Explanation
Let us extend GridView and implement OnItemClickListener so that we could have a click even on each item
public class MyCustomGridView extends GridView implements OnItemClickListener
Use this constructor so we could use this class on our xml
public MyCustomGridView(Context context, AttributeSet attrs) { ... }
Create an Listener interface for us to use in other classes
public interface Listener{ void onClick(int position); }
Function which will be called when an item is clicked (implementation of OnItemClickListener)
public void onItemClick(AdapterView parent, View v, int position, long id) {
Call our onClick function from the instance that uses our Listener interface
if (mListener != null) { mListener.onClick(position); }
Main Class
public class Main extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); MyCustomGridView mGrid = (MyCustomGridView) findViewById(R.id.my_custom_grid_view); mGrid.setListener(new ItemListener()); mGrid.setAdapter(new ImageAdapter(this)); } private class ItemListener implements MyCustomGridView.Listener{ public void onClick(int position) { Log.d("almond","test"); } } public class ImageAdapter extends BaseAdapter { private Context mContext; public ImageAdapter(Context c) { mContext = c; } public int getCount() { return mThumbIds.length; } public Object getItem(int position) { return null; } public long getItemId(int position) { return 0; } // create a new ImageView for each item referenced by the Adapter public View getView(int position, View convertView, ViewGroup parent) { ImageView imageView; if (convertView == null) { // if it's not recycled, initialize some attributes imageView = new ImageView(mContext); imageView.setLayoutParams(new GridView.LayoutParams(85, 85)); imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); imageView.setPadding(8, 8, 8, 8); } else { imageView = (ImageView) convertView; } imageView.setImageResource(mThumbIds[position]); return imageView; } private Integer[] mThumbIds = { R.drawable.icon,R.drawable.icon,R.drawable.icon }; } }
Explanation
We had used xml with our MyCustomGridView and here we get that view
MyCustomGridView mGrid = (MyCustomGridView) findViewById(R.id.my_custom_grid_view);
Create a class that uses the Listener interface we used in MyCustomGridView
private class ItemListener implements MyCustomGridView.Listener{ ... }
Set an instance of the ItemListener class
mGrid.setListener(new ItemListener());
As GridView is an extension of a AbsListView, we need a ListAdapter and we extend BaseAdapter (Please read this for the explanation of the codes inside - Hello GridView)
public class ImageAdapter extends BaseAdapter { ... }
We then set an instance of ImageAdaptor to be our adapter to our GridView
mGrid.setAdapter(new ImageAdapter(this));
Main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <com.almondmendoza.myGridView.MyCustomGridView android:id="@+id/my_custom_grid_view" android:layout_width="fill_parent" android:layout_height="fill_parent" android:cacheColorHint="#00000000" android:listSelector="@android:color/transparent" android:numColumns="auto_fit" android:columnWidth="160px" /> </LinearLayout>
Explanation
Use our class with our XML
<com.almondmendoza.myGridView.MyCustomGridView ... >
References
Launcher app
Browser App
Hello GridView
Update History
Jan 17, 2012 - Visual Update
3 comments:
Thanks for post.
Can you give some code snippet for ribbon view?
Ribbon view
-> It would contain more than 10 options (any number)
-> It should stay bottom to screen
-> When we scroll left to right or right to left, it should scroll
-> When we click any option it should highlight
Thanks for the insight. But I've got a problem. I've extended the View class into something called BoardView and nothing I do will make the system call BoardView's onDraw() method. Any Idea Why?
Thanks in advance.
Jared
I found some useful things in this post. But my main problem is not solved yet. Please help me anybody. I want to listen the "longClick" event on GridView background. I'm getting hopeless almost :( Please help me !
Post a Comment