Get different multiple image views in a list view

Question

I have been trying to implement a list view which has five image views in a single row of a list view. I found that it can be done with layout inflater but since I am new to android I could not exactly get how to make the best use of it. I want to get a view of this sort:

L,S,D,A,E are images and it should change accordingly for different users in the list view according to the data provided dynamically. Can anybody please help me with the code snippet for this, or just give me an idea on how to implement it?

Answer 1

Okay so your list view should inflate a layout of this type:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:orientation="horizontal"
android:id="@+id/layoutContainer" >
    <ImageView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/iv1" />
    <ImageView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/iv2" />
    <ImageView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/iv3" />
    <ImageView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/iv4" />
    <ImageView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/iv5" />
</LinearLayout>

Save it to row.xml located in your layout folder.

Next implement this in your activity's onCreate() method:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    CustomAdapter myAdapter = new CustomAdapter(getApplicationContext());
    ListView mainListView = (ListView) findViewById(R.id.lv);
    mainListView.setAdapter(myAdapter);
}

Finally, you need to create the CustomAdapter.java class, like this:

import android.content.Context;
import android.graphics.Bitmap;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;

public class CustomAdapter extends BaseAdapter {
    private Bitmap[][] data;
    private int count;
    private Context context;

    public CustomAdapter(Context context) {
        this.context = context;
            data = new Bitmap[100][];
            count = 0;
    }
    @Override
    public int getCount() {
        return count;
    }
    @Override
    public Bitmap[] getItem(int position) {
        // TODO Auto-generated method stub
        return data[position];
    }
    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return position;
    }
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View adapterView = convertView;
        if (adapterView == null) {
            adapterView = inflater.inflate(R.layout.row, null);
        }
        ImageView imageView = (ImageView) adapterView.findViewById(R.id.iv1);
        imageView.setImageBitmap(data[position][0]);
        //Repeat the last two steps for all five images, changing the last index accordingly
        return adapterView;
    }
    public void addBitmapArray (Bitmap[] newValue) {
        data[++count] = newValue;
    }
}

Answer 2

In row of the list add a linear layout LinearLayout1 then do something like fallowing in your adapter add dynamically images to the list item..

 public View getView(final int position, View convertView, ViewGroup parent)
{
    // System.out.println("  inside KeyvalueAdapter..");
    ViewHolder holder = null;
    if (convertView == null)
    {
        LayoutInflater mInflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = mInflater.inflate(R.layout.new_row, null);
        holder = new ViewHolder();

        holder.tv_title = (TextView) convertView.findViewById(R.id.titleTextView);

        ImageView imageView = new ImageView(context);
        imageView.setImageResource(resId);

        LinearLayout linearLayout = (LinearLayout) findViewById(R.id.LinearLayout1);
        linearLayout.addView(imageView);


        convertView.setTag(holder);

    }
    else holder = (ViewHolder) convertView.getTag();

    holder.tv_title.setText(notifList.get(position));

    return convertView;

}

Answer 3

If you want to load different image you have to extend your listview adapter: example if i understand correctly your question.

Answer 4

Check out this thread: Android custom Row Item for ListView

You have to write your own xml with 5 imageviews