Question

I have designed an application with a list-view in which I can change the colors of list items, here is a link to a screen from the application:

The colors are changed by changing an image on the left part of the list row. Now when I change the color slide down in the list, and the come back up the color go back to their original state (meaning the Image-view come back to its original source).

The data for the list is taken from an XML file, parsed to a hash-map and the using an adapter inflated into the list. How can I get around this issue?

As I see it because the list-view reuses the views that are not on screen, when I come back to the changed row that went out of the screen and then comes back it pulls its information again from the hash-map. So what I need to do is to find the index of data in the hash-map that was bind to row layout by the adapter, and there to change the associated color, that way the next time the adapter recreates this row it will be assigned with the right color. How can this be done?

Here is the Java code for this activity:

public class SkyGiraffeAppActivity extends Activity implements AdapterView.OnItemClickListener, View.OnClickListener {
// All static variables
static final String TAG = "SkyGiraffeAppActivity";
// XML node keys
static final String KEY_TASK = "task"; // parent node
static final String KEY_ID = "id";
static final String KEY_TITLE = "title";
static final String KEY_DATE = "date";
static final String KEY_TIME = "time";
static final String KEY_PRIORITY  = "priority";
static final String KEY_USERPRIORITY = "userpriority";

View currentRow;
final ArrayList<HashMap<String, String>> menuItems = new ArrayList<HashMap<String, String>>();

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
    ListView list = new ListView(this);
    list.setDivider(null);
    list.setDividerHeight(0);

    setContentView(list);
    getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.taskstitle);


    Log.e(TAG, "Created Array");

    XMLParser parser = new XMLParser();

    Log.e(TAG, "Getting xml from raw folder");
    InputStream xml = getResources().openRawResource(R.raw.taskslists); // getting XML

    Log.e(TAG, "reading xml file to string");
    String sxml = parser.readTextFile(xml);

    Log.e(TAG, "creating dom element from string");
    Document doc = parser.getDomElement(sxml); // getting DOM element

    Log.e(TAG, "getting node list of all the elements");
    NodeList nodeList = doc.getElementsByTagName(KEY_TASK);

    Log.e(TAG, "looping through all the elements");
    for (int i = 0; i < nodeList.getLength(); i++) 
    {
        // creating new HashMap
        HashMap<String, String> map = new HashMap<String, String>();
        Element e = (Element) nodeList.item(i);
        Log.e(TAG, "element number: " + i + " added to hash map");
        // adding each child node to HashMap key => value
        map.put(KEY_ID, parser.getValue(e, KEY_ID));
        map.put(KEY_TITLE, parser.getValue(e, KEY_TITLE));
        map.put(KEY_DATE, parser.getValue(e, KEY_DATE));
        map.put(KEY_TIME, parser.getValue(e, KEY_TIME));
        map.put(KEY_PRIORITY, parser.getValue(e, KEY_PRIORITY));
        map.put(KEY_USERPRIORITY, parser.getValue(e, KEY_USERPRIORITY));

        // adding HashList to ArrayList
        menuItems.add(map);
    }

    // Adding menuItems to ListView
    ListAdapter adapter = new SimpleAdapter(this, menuItems, R.layout.row,
          new String[] { KEY_TITLE, KEY_DATE, KEY_TIME, KEY_PRIORITY, KEY_USERPRIORITY}, 
          new int[]    { R.id.text_title, R.id.text_date, R.id.text_time ,R.id.image_priority, R.id.bchangecolor}){

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            View row =  super.getView(position, convertView, parent);
            View left = row.findViewById(R.id.bchangecolor);
            left.setTag(position);
            left.setOnClickListener(SkyGiraffeAppActivity.this);
            View right = row.findViewById(R.id.barrow);
            right.setTag(position);
            right.setOnClickListener(SkyGiraffeAppActivity.this);


            ImageView prioriy = (ImageView) row.findViewById(R.id.image_priority);
            ImageView usercolor = (ImageView) row.findViewById(R.id.bchangecolor);


            String userpriority = menuItems.get(position).get(KEY_USERPRIORITY);   
            Log.e(TAG, "user priority color for this view was: " + userpriority);

            if (userpriority.contentEquals("green"))
            {
                usercolor.setImageResource(R.drawable.task_bg_left_green);
            }
            else if (userpriority.contentEquals("blue"))
            {
                usercolor.setImageResource(R.drawable.task_bg_left_blue);
            }
            else if (userpriority.contentEquals("yellow"))
            {
                usercolor.setImageResource(R.drawable.task_bg_left_yellow);
            }
            else if (userpriority.contentEquals("orange"))
            {
                usercolor.setImageResource(R.drawable.task_bg_left_orange);
            }
            else if (userpriority.contentEquals("red"))
            {
                usercolor.setImageResource(R.drawable.task_bg_left_red);
            }


            int number = Integer.valueOf(menuItems.get(position).get(KEY_PRIORITY));
            switch ( number )
            {
            case 1:
                prioriy.setImageResource(R.drawable.priority_first);
                break;
            case 2:
                prioriy.setImageResource(R.drawable.priority_second);
                break;
            case 3:
                prioriy.setImageResource(R.drawable.priority_third);
                break;
            case 4:
                prioriy.setImageResource(R.drawable.priority_fourth);
                break;
            case 5:
                prioriy.setImageResource(R.drawable.priority_fifth);
                break;
            default:
                prioriy.setImageResource(R.drawable.priority_first);
            }

            return row;
        }
    };

    list.setAdapter(adapter);
    list.setOnItemClickListener(this);  
}

public void onClick(View v) 
{
     Intent i = new Intent(this, TaskColorChangeActivity.class);
     i.putExtra("color", "choosecolor");

     switch(v.getId()) {
        case R.id.bchangecolor:
            Log.e(TAG, "pressed the color change button on" + v.getId());
            currentRow = v;
            startActivityForResult(i, 1);
            break;
        case R.id.barrow:
            Log.e(TAG, "pressed the arrow button on" + v.getId());
            i = createIntentwithExtra(v.getRootView());
            startActivity(i);
            break;
        default:
            break;
        }   
}

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    // TODO Auto-generated method stub
    super.onActivityResult(requestCode, resultCode, data);

    if(data.getExtras().containsKey("chosencolor"))
    {
        ImageView imageView = (ImageView) currentRow.findViewById(R.id.bchangecolor);
        if (data.getStringExtra("chosencolor").contentEquals("blue"))
        {
            imageView.setImageResource(R.drawable.task_bg_left_blue);
            //menuItems.get(po)
        }
        else if (data.getStringExtra("chosencolor").contentEquals("green"))
        {
            imageView.setImageResource(R.drawable.task_bg_left_green);
        }
        else if (data.getStringExtra("chosencolor").contentEquals("yellow"))
        {
            imageView.setImageResource(R.drawable.task_bg_left_yellow);
        }
        else if (data.getStringExtra("chosencolor").contentEquals("orange"))
        {
            imageView.setImageResource(R.drawable.task_bg_left_orange);
        }
        else if (data.getStringExtra("chosencolor").contentEquals("red"))
        {
            imageView.setImageResource(R.drawable.task_bg_left_red);    
        } 
    }
}

public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
    Log.e(TAG, "pressed the row itself" + v.getId());
    Intent intent = createIntentwithExtra(v);
    startActivity(intent);  
}

public Intent createIntentwithExtra(View v)
{
    Intent intent = new Intent(getApplicationContext(), SingleMenuItemActivity.class);
    String title = ((TextView) v.findViewById(R.id.text_title)).getText().toString();
    String date = ((TextView) v.findViewById(R.id.text_date)).getText().toString();
    String time = ((TextView) v.findViewById(R.id.text_time)).getText().toString();
    intent.putExtra(KEY_TITLE, title);
    intent.putExtra(KEY_DATE, date);
    intent.putExtra(KEY_TIME, time);

    return intent;
}}

Answer 1

You should re-use the already created view.Some thing like this:

public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder holder = null;
    if(convertView == null){
        //CREATE NEW HOLDER
        holder = new ViewHolder();
        // Layout XML
        int layoutFile = R.layout.adapter_layout;
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = inflater.inflate(layoutFile, null);
        convertView.setTag(holder);
        holder.tvName= (TextView)convertView.findViewById(R.id.tvName);

              /// SET DE VALUES TO THE VIEW HERE, INCLUDING THE
              /// ONCLICK TO THE VIEW
    Users u = arrayUser.get(position);

    holder.tvName.setText(u.getName());


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

static class ViewHolder{
    TextView tvName;
}