How to create Custom GridView

Question

I have been trying to make custom gridview, so that I can manipulate the looks of what a single grid could look like, but I have not been successful.

I was able to create a gridview that would just get the image and and text using volley. And I have been trying to manipulate the adapter class and search for tutorials but unfortunately no luck.

Can you guys help me on how would I be able to do it and what am I doing wrong? Thanks in Advance!

This is my Adapter class GridViewAdaper:

public class GridViewAdapter extends BaseAdapter {

    private ImageLoader imageLoader;


    private Context context;

     private ArrayList<String> images;
    private ArrayList<String> names;

    public GridViewAdapter (Context context, ArrayList<String> images, ArrayList<String> names){
        this.context = context;
        this.images = images;
        this.names = names;
    }

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

    @Override
    public Object getItem(int position) {
        return images.get(position);
    }

    @Override
    public long getItemId(int position) {
        return 0;
    }

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

        LayoutInflater inflater= (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView=inflater.inflate(R.layout.list_item, null);

        TextView name=(TextView)convertView.findViewById(R.id.textViewName);
        ImageView icon=(NetworkImageView)convertView.findViewById(R.id.imageViewHero);

        imageLoader = CustomVolleyRequest.getInstance(context).getImageLoader();
        imageLoader.get(images.get(position), ImageLoader.getImageListener(icon, R.mipmap.ic_launcher, android.R.drawable.ic_dialog_alert));

        icon.setImageResource(images.get(position),imageLoader);

        name.setText(names.get(position));

       icon.setScaleType(ImageView.ScaleType.CENTER_CROP);
        icon.setLayoutParams(new GridView.LayoutParams(200,200));

        return convertView;
    }
}

Answer 1

Well I already solved the problem :D

Adapter Class:

public class GridViewAdapter extends BaseAdapter {

private ImageLoader imageLoader;

private Context context;

private ArrayList<String> images;
private ArrayList<String> names;

 public GridViewAdapter (Context context,ArrayList<String> images, 
 ArrayList<String> names){
    this.context = context;
    this.images = images;
    this.names = names;
}

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

@Override
public Object getItem(int position) {
    return images.get(position);
}

@Override
public long getItemId(int position) {
    return 0;
}

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

    View grid;
    LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    grid = inflater.inflate(R.layout.list_item, null);

    TextView title = (TextView) grid.findViewById(R.id.textViewName);
    NetworkImageView thumbNail = (NetworkImageView) grid.findViewById(R.id.imageViewHero);

    imageLoader = CustomVolleyRequest.getInstance(context).getImageLoader();
    imageLoader.get(images.get(position), ImageLoader.getImageListener(thumbNail, R.mipmap.ic_launcher, android.R.drawable.ic_dialog_alert));

    title.setText(names.get(position));
    thumbNail.setImageUrl(images.get(position), imageLoader);


    return grid;
}
}