Android custom gridview having (imagebutton + imageview) on every grid items

Question

I'm trying to put an imageButton and ImageView on the grid view items, so here is my code shown below, what am trying to do is create an Adapter extending BaseAdapter and then creating a Viewholder and putting both the ImageView and Imagebutton in the holder. However, there are no errors but again when the grid view is opened, the App stops.

Any clue will be of much great help...Thanks!!

public class DestinationActivity extends Activity implements OnClickListener, OnItemClickListener {
@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.grid_view);
        GridView grid = (GridView) findViewById(R.id.gvGrid);
        myImageAdapter = new ImageAdapter(this);
        grid.setAdapter(myImageAdapter);
    }

class ViewHolder {
        int id;
        ImageView imageview;
        ImageButton button;
        }

    public class ImageAdapter extends BaseAdapter {
    private LayoutInflater mInflater;

    public ImageAdapter() {
        mInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    }

    private Context mContext;
    ArrayList<String> itemList = new ArrayList<String>();

    public ImageAdapter(Context c) {
        mContext = c;
    }

    void add(String path) {
        itemList.add(path);
    }

    @Override
    public int getCount() {
        return itemList.size();
    }

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

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

}

@Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            holder = new ViewHolder();
            convertView = mInflater.inflate(R.layout.image_button, null);
            holder.imageview = (ImageView) convertView.findViewById(R.id.thumbImage);
            holder.button = (ImageButton) convertView.findViewById(R.id.ibClose);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();

        }

        holder.button.setId(position);
        holder.imageview.setId(position);
        holder.imageview.setPadding(1, 1, 1, 1);
        holder.imageview.setScaleType(ImageView.ScaleType.CENTER_CROP);
        holder.imageview.setLayoutParams(new GridView.LayoutParams(330, 330));
        Bitmap bm = decodeSampledBitmapFromUri(itemList.get(position),
                330, 330);
        holder.imageview.setImageBitmap(bm);
        holder.button.setOnClickListener(new ImageButton.OnClickListener() {

            @Override
            public void onClick(View v) {
                // // TODO Auto-generated method stub
                Toast.makeText(getApplicationContext(), "Hello..!!", Toast.LENGTH_SHORT).show();

            }
        });

        holder.imageview.setImageBitmap(null);
        holder.id = position;
        return convertView ;

    }
    }

image_button.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

<ImageView
    android:id="@+id/thumbImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true" />

<ImageButton
    android:id="@+id/ibClose"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:src="@drawable/close_dialog" />

</RelativeLayout>

grid_view.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<GridView
    android:id="@+id/gvGrid"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF"
    android:clipToPadding="false"
    android:columnWidth="10dp"
    android:gravity="center"
    android:horizontalSpacing="0dp"
    android:numColumns="2"
    android:scrollbarStyle="outsideOverlay"
    android:stretchMode="columnWidth"
    android:verticalSpacing="5dp" 
  />
</LinearLayout>

In your `adapter` **getView()** method your inflating layout `gallerydeleteitems` but the layout you have specified here is `image_button.xml` and you are using `holder.imageview` for both `imageview` and `imagebutton` — Pankaj, Nov 26 '15 at 09:39
Another problem that you have with this line holder.imageview.setLayoutParams(new GridView.LayoutParams(330, 330)); try it after deleting this line and see log cat.\ — Nas, Nov 26 '15 at 11:08

score 1 · Answer 1 · answered Nov 26 '15 at 09:42

Instead of below lines:

convertView = mInflater.inflate(R.layout.gallerydeleteitems, null);
            holder.imageview = (ImageView) convertView.findViewById(R.id.thumbImage);
            holder.imageview = (ImageButton) convertView.findViewById(R.id.ibClose);

change to this:

convertView = mInflater.inflate(R.layout.image_button, null); //layout name changed
holder.imageview = (ImageView) convertView.findViewById(R.id.thumbImage);
holder.button= (ImageButton) convertView.findViewById(R.id.ibClose);  //changed the name to holder.button

What issue you are having now?? And post your logcat. – Pankaj Nov 26 '15 at 09:56 — Pankaj, Nov 26 '15 at 09:56

score 0 · Answer 2 · answered Nov 26 '15 at 09:38

You're not finding the id for your ImageButton. Check getView() method of your adapter:

holder.imageview = (ImageView) convertView.findViewById(R.id.thumbImage);
holder.imageview = (ImageButton) convertView.findViewById(R.id.ibClose);

Also, next time, post the error log.

score 0 · Accepted Answer · edited Apr 11 '16 at 09:12

public class DestinationActivity extends Activity implements OnClickListener, OnItemClickListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.grid_view);
    GridView grid = (GridView) findViewById(R.id.gvGrid);
    myImageAdapter = new ImageAdapter(this);
    grid.setAdapter(myImageAdapter);
}

static class ViewHolder {
    ImageView imageview;
    ImageButton imageButton;
    int position;
}

public class ImageAdapter extends BaseAdapter {


    public ImageAdapter() {

    }

    private Context mContext;
    ArrayList<String> itemList = new ArrayList<String>();

    public ImageAdapter(Context c) {
        mContext = c;
    }

    void add(String path) {
        itemList.add(path);
    }

    @Override
    public int getCount() {
        return itemList.size();
    }

    @Override
    public Object getItem(int position) {

        return position;
    }

    @Override
    public long getItemId(int position) {

        return position;

    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        return null;
    }
}

public View getView(int position, View convertView, final ViewGroup parent) {
    Bitmap bm = null;
    View view = convertView;
    final ViewHolder holder;
    if (convertView == null) {
        holder = new ViewHolder();
        LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        view = inflater.inflate(R.layout.delete_destination, parent, false);
        holder.imageview = (ImageView) convertView.findViewById(R.id.thumbImage);
        holder.imageButton = (ImageButton) convertView.findViewById(R.id.ibClose);
        view.setTag(holder);
    } else {
        holder = (ViewHolder) view.getTag();
    }
    holder.imageButton.setId(position);
    holder.imageview.setId(position);
    try {

        bm = decodeSampledBitmapFromUri(itemList.get(position), 330, 330);

    } catch (Throwable e) {

    }
    holder.imageview.setScaleType(ImageView.ScaleType.CENTER_CROP);
    holder.imageview.setPadding(1, 1, 1, 1);
    holder.position = position;
    holder.imageview.setImageBitmap(bm);
    return view;
}
}

Android custom gridview having (imagebutton + imageview) on every grid items

image_button.xml

grid_view.xml

3 Answers3