Simplecursoradapter with Listview just mixed up while scrolling

Question

Folks.

I've a problem with my simplecursorAdapter. Everything works perfectly except when scrolling the listview it just mixes up the Favorite icon for the rows which included in the custom layout and it just appears randomly while scrolling. Can you guide me what's wrong in my code?

Thanks in advance!

public class AlternateRowCursorAdapter extends SimpleCursorAdapter {

int layoutn;
Cursor localCursor, test;
Bitmap bitImg;
Context localContext;
Bitmap Avatar;
ImageView one, two, three, four, five;
LayoutInflater mInflater;
SQLiteDatabase mDb;
MyDbHelper mHelper;

public static final String TABLE_NAME = "MSGS";
public static final String COL_MsgID = "msgIdc";
public static final String COL_MsgCat = "msgCatC";
public static final String COL_MsgTit = "msgtitleC";
public static final String COL_MsgFavor = "msgFavorC";


public AlternateRowCursorAdapter (Context context, int layout, Cursor c,
        String[] from, int[] to) {

    super(context, R.layout.listtype, c, from, to);

    this.localContext = context;

}


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


    View row = super.getView(position, convertView, parent);

    final Cursor cursbbn = getCursor();

    if (row == null)

    {
        row = ((LayoutInflater) localContext
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE))
                .inflate(R.layout.listtype, null);

    }


    final String Title;
    String SandID;
    final String MsgID;
    final String MsgFav;

    Typeface tf = Typeface.createFromAsset(localContext.getAssets(),"fonts/khalaadsara.ttf");

     Title = cursbbn.getString(2);
     SandID = cursbbn.getString(1);
     MsgID=cursbbn.getString(0);
     MsgFav=cursbbn.getString(4);

    TextView titler = (TextView) row.findViewById(R.id.Sandtit);

    titler.setTypeface(tf);
    titler.setText(Title);



    one = (ImageView) row.findViewById(R.id.imageView5);
    two = (ImageView) row.findViewById(R.id.imageView4);
    three = (ImageView) row.findViewById(R.id.ImageView03);
    four = (ImageView) row.findViewById(R.id.ImageView02);
    five = (ImageView) row.findViewById(R.id.imageView1);


    if(MsgFav.contentEquals("YES"))
    {
        one.setImageResource(R.drawable.favorpress);
    }



    return row;

}

}

Edit : Here is my code to refresh the values in Onresume event :

private void refreshvalues() {

    mDb = mHelper.getWritableDatabase();

    curs = mDb.query(MyDbHelper.TABLE_NAME, columns, null, null, null,
            null, null,

            null);

    cursF = mDb.query(TABLE_NAME, columns, COL_MsgFavor + "=" + "?",
            new String[] { "YES" }, null, null, COL_MsgTit + " ASC");

    String[] headers = new String[] {MyDbHelper.COL_MsgTit ,MyDbHelper.COL_MsgID};

    mAdapter = new AlternateRowCursorAdapter(this, R.layout.listtype, curs,
            headers, new int[] { R.id.Sandtit});

    fAdapter = new AlternateRowCursorAdapter(this, R.layout.listtype,
            cursF, headers, new int[] { R.id.Sandtit });

    mList.setAdapter(mAdapter);
    fList.setAdapter(fAdapter);

curs.moveToFirst();
cursF.moveToFirst();

mAdapter.notifyDataSetChanged();
fAdapter.notifyDataSetChanged();

mList.invalidateViews();
fList.invalidateViews();

curs.requery();
cursF.requery();

}

Answer 1

First of all, you are customizing the ListView which needs to implement the custom adapter that extends any of the SimpleCustomAdapter , ArrayAdapter , and BaseAdapter .

Now, you get your listview messed up because, you are not holding the values in the views. You need to write a class ViewHolder that holds your views of the ListView in the same state, before it was scrolled. And Inside getView() method, you need to implement the else part of the if statement.

This is the efficient way to use ListView. Check below, how it can be implemented: For example:

I made a class Task which contains the values from the database as:

static class Task {

        int task_id;
        String task_brief;
        String task_priority;
        String is_completed = "false";

        Task(int tmp_task_id, String tmp_task_brief, String tmp_task_priority,
                String tmp_task_is_completed) {
            task_id = tmp_task_id;
            task_brief = tmp_task_brief;
            task_priority = tmp_task_priority;
            is_completed = tmp_task_is_completed;
        }

        int get_task_id() {
            return task_id;
        }

        String get_task_brief() {
            return task_brief;
        }

        String get_task_priority() {
            return task_priority;
        }

        String get_task_is_completed() {
            return is_completed;
        }

        void set_task_is_completed(String tmp_task_is_completed) {
            is_completed = tmp_task_is_completed;
        }
    }

Now, we create a class TaskViewHolder that holds the view:

static class TaskViewHolder {

        TextView tv_task_brief;
        ImageView iv_task_is_completed;

        public TaskViewHolder(TextView tmp_tv_task_brief,
                ImageView tmp_iv_task_is_completed) {
            tv_task_brief = tmp_tv_task_brief;
            iv_task_is_completed = tmp_iv_task_is_completed;
        }

        TextView get_tv_task_brief() {
            return tv_task_brief;
        }

        ImageView get_iv_task_is_completed() {
            return iv_task_is_completed;
        }
    }

And after that, implement custom adapter as below:

static class TaskAdapter extends ArrayAdapter<Task> {

        LayoutInflater inflater;

        public TaskAdapter(Context context, List<Task> tmp_al_task) {
            super(context, R.layout.single_row_home,
                    R.id.textViewSingleRowHome, tmp_al_task);
            inflater = LayoutInflater.from(context);
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            // TODO Auto-generated method stub

            Task task = (Task) this.getItem(position);

            final ImageView imageView;
            final TextView textView;

            if (convertView == null) {

                convertView = inflater.inflate(R.layout.single_row_home, null);

                imageView = (ImageView) convertView
                        .findViewById(R.id.imageViewSingleRowHome);
                textView = (TextView) convertView
                        .findViewById(R.id.textViewSingleRowHome);

                convertView.setTag(new TaskViewHolder(textView, imageView));

            } else {

                TaskViewHolder viewHolder = (TaskViewHolder) convertView
                        .getTag();
                imageView = viewHolder.get_iv_task_is_completed();
                textView = viewHolder.get_tv_task_brief();
            }

            imageView.setTag(task);

            textView.setText(task.get_task_brief());
            if(task.get_task_priority().equals("High"))
                textView.setTextColor(Color.RED);
            else if(task.get_task_priority().equals("Medium"))
                textView.setTextColor(Color.GREEN);
            else
                textView.setTextColor(Color.BLUE);

            if (task.get_task_is_completed().equals("true")) {

                imageView.setImageResource(R.drawable.action_cancel_icon);
                textView.setPaintFlags(textView.getPaintFlags()
                        | Paint.STRIKE_THRU_TEXT_FLAG);
            } else {

                imageView.setImageResource(R.drawable.action_cancel_icon_2);
                textView.setPaintFlags( textView.getPaintFlags() & (~ Paint.STRIKE_THRU_TEXT_FLAG));
            }

            imageView.setFocusable(false);
            imageView.setFocusableInTouchMode(false);
            imageView.setClickable(true);
            imageView.setOnClickListener(new View.OnClickListener() {

                public void onClick(View v) {

                    Task task = (Task) imageView.getTag();

                    if (task.get_task_is_completed().equals("false")) {


                        imageView.setImageResource(R.drawable.action_cancel_icon);

                        ContentValues values = new ContentValues();
                        values.put("is_completed", "true");

                        database.update("task_info", values, "task_id=?",
                                new String[] { task.get_task_id() + "" });
                        values.clear();

                        textView.setPaintFlags(textView.getPaintFlags()
                                | Paint.STRIKE_THRU_TEXT_FLAG);

                        task.set_task_is_completed("true");

                    } else {

                        imageView.setImageResource(R.drawable.action_cancel_icon_2);

                        ContentValues values = new ContentValues();
                        values.put("is_completed", "false");

                        database.update("task_info", values, "task_id=?",
                                new String[] { task.get_task_id() + "" });
                        values.clear();

                        textView.setPaintFlags( textView.getPaintFlags() & (~ Paint.STRIKE_THRU_TEXT_FLAG));

                        task.set_task_is_completed("false");
                    }
                }
            });

            return convertView;
        }
    }

Note: One important thing, if your ListView contains items that has click events, then that items should be set to view.setFocusable(false); view.setFocusableInTouchMode(false); and view.setClickable(true); . We need this because ListView takes the click event of any of the view as its own click event. Also, the view's click event should be separated from ListView's Click event.

Answer 2

ListView recycles list item View s. So make sure to always call one.setImageResource() .

if (MsgFav.contentEquals("YES")) {
    one.setImageResource(R.drawable.favorpress);
} else {
    one.setImageResource(R.drawable.default_drawable_as_specified_in_layout);
}