Create a clickable image in a GridView in Android

Question

I have images displayed in a GridView as in this tutorial. I want to be able to click on a single image and do other events and I need to know what image was clicked.

Do I have to add imageView.onKeyDown(keyCode, event) in the ImageAdapter class? Here is the code as it currently exists:

@Override
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);
    //does this need imageView.onKeyDown(keyCode, event)?
  } 
  else {
    imageView = (ImageView) convertView;
  }

  imageView.setImageResource(mThumbIds[position]);
  return imageView;
}

How will it indicate what image was clicked? How do I create the proper handler?

score 25 · Accepted Answer · answered Apr 17 '09 at 08:25

25

For a GridView you can use the setOnItemClickListener method to have an OnItemClickListener listener. That listener will give you a method that you must override with the signature

onItemClick(AdapterView<?> parent, View v, int position, long id)

where you get the position of the item in the grid that was clicked and the View that is inside the cell of the grid. Is that what you need?

answered Apr 17 '09 at 08:25

Alejandro Mezcua

1,211
1
9
13

See [Jianhong's answer](http://stackoverflow.com/a/5789159/199364) for more detailed code for this approach. – ToolmakerSteve Dec 29 '16 at 19:23

score 6 · Answer 2 · answered Apr 26 '11 at 10:44

i tried the above mentioned method getView(final int position . . .) realized that the position got "reset" after 28 items and the position when back to 0 after the 28th item in the gridview.

i suspected the final keyword is creating problem and after removing it i was able to get the positions as expected.

Below is a sample code with the click event being called in the activity that is showcasing the gridview.

public class MainActivity extends Activity {

ArrayList<Integer> item_ids = new ArrayList<Integer>();

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    item_ids = //get your item ids method

    GridView gridview = (GridView) findViewById(R.id.grid_featured);
    gridview.setAdapter(new ImageAdapter(this));
    gridview.setOnItemClickListener(itemClickListener);

    footer = (Footer)findViewById(R.id.layoutFooter);
    footer.setActivity(this);
}

private OnItemClickListener itemClickListener = new OnItemClickListener() {
    public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
    Log.d(TAG,"Position Clicked ["+position+"] with item id ["+item_ids.get(position)+"]");
    }
};

}

score 6 · Answer 3 · answered Apr 11 '09 at 15:55

I was able to get the position of the clicked image by making the position final and adding an onClick listener to the imageView. This logs the position of the image that was clicked.

@Override
public View getView(final 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);


    imageView.setOnClickListener(new View.OnClickListener() {

      @Override
      public void onClick(View view) {
        Log.d("onClick","position ["+position+"]");
      }

    });

  } 
  else {
    imageView = (ImageView) convertView;
  }

  imageView.setImageResource(mThumbIds[position]);
  return imageView;
}

This is not the way you want to do things. Instead use Alejandros method. It's much cleaner and doesn't involve you changing the methods signature. — Kurtis Nusbaum, Oct 03 '11 at 19:48
Instead of this, See [Jianhong's answer](http://stackoverflow.com/a/5789159/199364), which shows code for using gridView.setOnItemClickListener as described by Alejandro. (And mentions a bug if attempt to use the solution in this answer.) — ToolmakerSteve, Dec 29 '16 at 19:21

Create a clickable image in a GridView in Android

3 Answers3

Linked

Related